Responsive web design is a design approach aimed at creating websites to provide an optimal viewing experience for many or all devices. These devices include desktops, laptop computers, cell phones, and more recently, tablets. The result of well-implemented responsive designs include easy reading and navigation with a minimum of resizing, panning, and scrolling.
Responsive websites rely only on Cascading Style Sheets (CSS) and media queries to dynamically adapt the content layout of a website. A different layout structure is defined in CSS for several device widths and heights, usually specified in ranges of sizes.
Google Recommends Responsive Web Designs
Google recommends webmasters follow the industry best practice of using responsive web designs, namely serving the same HTML for all devices and using only CSS media queries to decide the rendering on each device.
If responsive design is not the best option to serve your users, Google supports having your content being served using different HTML. The different HTML can be on the same URL or on different URLs, and Googlebot can handle both setups appropriately if you follow our recommendations.
Why Google Prefers Responsive Designs
First off, Google may mistakenly identify your mobile website for duplicate content. This results in lower page rakings and search engine “penalties”. However, there is a way to make it apparent to search engines that your mobile site is merely an extension of your main website. This can be done in a number of ways, including through Google’s “Webmaster Tools”.
Also, Google advocates providing an equivalent web design and user experience for both desktops and smartphones. Basically, anything an Internet user sees or experiences on a desktop or laptop should be the same for mobile devices.
Drawbacks of Responsive Web Design
Content meant only for devices with larger screen sizes is often delivered to small screens and “turned off” with CSS media queries. Responsive web designs may result in unnecessary downloads, causing responsive websites to load slower.
Because responsive designs are a “one-size-fits-all” solution, webmasters are incapable of changing the order of the CSS markup based on the device or screen size. Also, webmasters are unable to eliminate unnecessary elements completely, resulting in poor performance and overall design.
What you will likely notice here is that the drawbacks with a responsive web design are areas where a custom mobile website excels. We wanted the best of both worlds for Better Mobile websites — the advantages that a responsive approach and a mobile website solution have to offer.
A Practical Comparison
Compare your website to your lunch hour. When choosing a place to eat, you probably wouldn’t select a restaurant 20 minutes away. Why? Well, because it takes time to be seated, time to be greeted, and time to be served. By the time you have the opportunity to order, you are forced to rush back to work without eating.
The restaurant 20 minutes away possibly provides a much better dining experience and higher quality meals. However, the potential benefits are never experienced.
Just the same, responsive websites that are rich in multimedia content may provide a unique and pleasurable experience for desktop users. Thanks to responsive web designs, smartphone users will leave the website before it’s done downloading. Why? Because there are optimized mobile websites that download faster and provide the user with the information and experience that they require – no more and no less.
Summary
Although responsive web designs may be ideal for business with limited IT resources or businesses with lightweight websites, it isn’t for everyone.
