Tuesday, 06 November 2012 15:00
Hey all, we're announcing a new smashing, fresh, right out of the oven podcast for you to listen to! We did an interview for a podcast on Dev1.tv together with BraveNewCode's (the WPTouch guys) Co-Founder Dale Mugford. The topic was Responsive Design Vs. Server-Side Solutions. Go and listen to it now!
In the podcast, we discuss and compare some of the main points regarding responsive design and server-side mobile solutions, which are sometimes referred to as “dynamic serving” – like Mobile Joomla! and the WPtouch plugin.
In this article, we'll provide a summary of the topics discussed in the podcast, as well as some additional material. Read on!
Overall, the differences between responsive design techniques and server-side approaches can be broken down into four categories:
One of the significant benefits of server-side solutions is fast and efficient delivery of content. Many studies and surveys have shown that people are only willing wait around 4 seconds for content to display on smartphones.
The server-side solutions can deliver mobile pages that are up to 500% smaller than their desktop counterparts by serving images optimized for the client browser and removing unnecessary scripts from being sent to the client at all. These things are not technically possible in the responsive approaches currently.
The server-side optimized pages also load up to 400x faster which is critical for low bounce rates and higher page views. While mobile cache limits are easily exceeded, so that the website assets need to be requested over the air over and over again, heavy sites can also significantly slow down, and even crash some mobile browsers.
Some have argued that Google has recommended responsive design as the preferred solution. Well, Google isn't really recommending responsive design for all. What they really say is that you should build a site that makes sense for your users. Elsewhere in the news, you might have noticed Google and Microsoft stating “Every millisecond matters” - people will visit a website less often if it is slower than a close competitor by more than 250 milliseconds (250 thousandths of a second). Speed matters.
In any case, if you are using a responsive template, you better pay attention to how well your site really is optimized, after all, for mobile. It's not just the layout, it's the page size and loading time as well. You can try our Responsive Template Analyzer to estimate how much you could improve your Joomla! site's mobile performance if you had Mobile Joomla! installed to optimize your site on the server-side. Read more about the client-side and server-side differences and responsive server-side development.
Designing a good mobile user experience is much more than just making sure that the logo looks the same across various browsers and screen sizes. Good design also includes usability factors and not just the visual layout. Server-side solutions put focus on the content formatting requirements. This ensures a polished, dependable design is provided for all site visitors regardless of the device.
Server-side solutions can, however, require additional work in order to maintain similar branding across devices. The fact that the responsive design is based on a single set of styles used for all devices that provides consistent design, is probably its strongest benefit. Although, many semi-smartphones and feature phones may have serious problems coping with the size of the responsive pages, as well as non-supported scripts and other styling.
The differences between the approaches are clear when it comes to content that is inappropriate for mobile visitors. With responsive design, the inappropriate content is sent to the client device and only ‘hidden’ through stylesheet formatting. With server-side solutions webmasters can specify the content that is not applicable to mobile visitors - and the content will not be delivered to their devices, further streamlining and optimizing the mobile display of content.
It's often said successful responsive design should start "mobile first." Day to day maintaining of responsive design may mean reliance on expert web designers who have strong enough grasp of both mobile technologies and mobile design skills. Also, responsive design best practices are a very much still work in process.
On the contrary hand, many server-side solutions are built to be convenient to handle for the site owner, using easy-to-use interface to apply updates and changes.
Now listen to the full Dev1.tv “Responsive Design vs. Alternate Mobile Solutions” podcast!
What do you think about the topic? Let us know below in the comments!