Responsive Design Alternatives

Published on 14 Sep 2014 at 9:43 pm.
Filed under Google,Informative,Mobile,Search Engine Optimization,Web Design.

Mobile web traffic is growing fast. So why do industry giants choose responsive design alternatives?

Responsive Design

Responsive design is the core of the mobile-first philosophy. Responsive design places focus on the browser. With it you design your site with fluid grids that grow or expand as the screen size changes. It may result in content being hidden away from users browsing at certain screen sizes. If a website changes its look as you resize the browser and looks like your phone when you get small enough then the site uses using responsive design.

Responsive design results in one version of your website controlled entirely by the same front-end technologies used to build any modern website — HTML, CSS, and JavaScript. Any web design company can create a polished website using responsive design. These websites are easily indexed by search engines and will work just fine in new devices.

Responsive Design Alternatives: Adaptive Design

Adaptive design takes another approach to mobile traffic. Adaptive design places focus on the user and not the browser. It encourages you to create a user experience focused on the person and their current needs. For example, you may present a mobile user with a click-to-call button, or a print button for a desktop user. You can still have fluid grids like with responsive design. You just may not need those grids all the time — like when using a desktop.

In addition to responsive design, Google has two recommended responsive design alternatives for building a smartphone-optimized website. You can either dynamically serve different content or you could send them to a separate mobile website. Both of these scenarios work based on user-agent detection. User-agent detection is when you detect the user’s browser from HTTP information supplied in the opening request. User-agent detection is risky because an error with the detection mechanism would send the user a poor experience. You must judge for yourself if different content you’re sending to the user is worth the risk. You must also update your detection mechanism as new devices like Firefox OS and Tizen gain users.

The following sites use some form of adaptive design as responsive design alternatives.

• Google Search — dynamic content.
• Bing — dynamic content, though until last month used a separate mobile site.
• Amazon — dynamic content.
• Facebook — separate mobile website.
• Twitter — separate mobile website.
• LinkedIn — separate mobile website.
• Pinterest — dynamic content.
• WikiPedia — separate mobile website.
• YouTube — separate mobile website.
• BBC — separate mobile website.
• CNN — dynamic content.
• TMZ — separate mobile website.

Dynamic Content

Dynamic content is the short way of saying dynamically serving different content based on the user agent. With this method you have one URL for any given page, but you produce a different experience using different HTML, CSS, and JavaScript.

Dynamic content websites are appealing when it comes to responsive design alternatives because there are no possible indexing issues with regards to SEO. They also make an ideal user experience when someone shares a page.

Separate Mobile Websites

A separate mobile website is just like it sounds. It’s a separate website with different URLs for every page. With these types of websites you must add bidirectional tags to tell search engines of the link between the two pages. When Google sees the link between these pages they will send mobile users directly to the mobile version of your site and not the desktop version. This saves the user time.

Separate mobile sites are appealing when it comes to responsive design alternatives because they are easy to design. All they need is the user-agent detection switch, and the ability to create a web page. By default they do not prevent a desktop user from visiting a mobile page. Whether that is a bug or a feature is subjective. I know just as many people who prefer to browse the mobile website as I know that hate that they are not redirected to the desktop.

Mobile websites do create a minor SEO risk if you do not include the bidirectional tags. Without them you are separating possible ranking value between the different versions of each page. To counter this you have more mechanisms to gain search engine data. For example, Google Webmaster Tools will only supply 2,000 search queries per day per domain. Since the mobile website is a different domain you can get 2,000 queries for the desktop site and 2,000 queries for the mobile site. Neither responsive design nor dynamic content can offer this.

Whether your choose responsive design or one of the responsive design alternatives you are improving the mobile user experience. These improvements you lead to happier users and will let you grow your brand.

Thank you and keep building your brand.

This post was originally published as Responsive Design Alternatives for Brand Builder Websites.