The online landscape is forever changing - as is the way we view it. Gone are the days of a standard screen size. Users can nowviewwebsites on 60-inch television screens or 6-inch Smartphone screens. The trick for website owners is to ensure an equal experience on both.
With the proliferation of Smartphones and tablets in the past several years, usability of websites in mobile environments has become a chief concern for designers. Two distinct options present themselves: responsive Web design (RWD) and mobile-specific authoring.
Responsive Web design uses a variety of techniques to standardize the viewing experience for users on all platforms. That is, a site using RWD “adapts” to the device, so users looking at the site on 60-inch television screens and those using 6-inch Smartphones see the site much the same way. RWD also optimizes the site for all platforms so that users don’t have to resize or scroll even if their device’s screen is smaller or larger than the average computer monitor.
The key to a responsive Web design is proportion-based grids. Elements are sized in relative percentages rather than fixed measurements like points or pixels. So, for example, an image is allocated 30% of the available screen space, rather than 300 x 300 pixels. Flexible images and media queries that allow different CSS styles based on device characteristics such as browser width are also hallmarks of RWD.
Mobile-specific authoring techniques create websites that function best on portable devices like Smartphones and tablets. These sites use design principles and programming specifically for mobile devices, including CSS and XHTML for mobile.
Mobile-specific sites don’t scale up the way responsive sites do. That is, they’re not meant to be viewed on 60-inch television screens. They’re not even meant to be viewed on an average-sized computer monitor! These sites are specifically designed to look and function best on smaller mobile devices.
What they lack in scalability, though, they more than make up for in usability. Just as a tailored suit fits better than one directly off the rack, a site authored specifically for mobile devices offers the best user experience on these devices. If functionality on mobile devices is essential to a website’s success, then that site better have mobile-specific authoring.
Websites that simply support offline operations or are a first foray into the online marketplace will likely find a responsive design sufficient. Responsive sites are faster and cheaper to create, and they can allow a company to establish an online presence and track user behaviour before investing in a mobile site if necessary.
Companies for which the website represents a major portion of business activities will likely find a mobile site more beneficial, especially if analytics show that users access the site via phones or tablets. Although more expensive and somewhat more exacting to create, mobile-specific websites offer superior usability due to their precise mobile-centric design.
Associated tags: Web Design, Responsive