13 June 2013

Considerations for implementing responsive design:

Screen size
This is the most obvious and often the single obsession when designing a site for both desktop and mobile. The smart strategy is to work mostly in percentages, but using device detection can help to augment a table of padding and dimensions in CSS. The Safari browse also make automatic compensation for landscape vs portrait display and there is little that can be done to augment this.

When working with mobile devices it’s important to consider the amount and the complexity of you functionality. In less than optimal situations your working with what are essentially the dial up speeds of old. Additionally, you don’t have the same processor power of a full computer so loading tasks into the browser can slow things considerably. In testing and surveys it has been found that users are less tolerant of slow load times on mobile that on computers.

In particular, HD video and resizing graphics can be a burden on load time. More problematic is heavy or poor use of java script. Lazy load or staged loading of functionality can help, but generally does not solve page load problems.

Interaction models
Touch screens utilize different interaction than mouse and keyboard computers. Using public domain scripting libraries can approximate native OS (particularly iOS) touch screen interactions but they are no where near as elegant or sophisticated. In many cases native interactions can only be approximated, if accomplished at all. Lastly, these libraries are typically java script which will cause considerable page load lag.

This is probably the most important consideration. User are typically operating under different situations and with different priorities when using a mobile device that when sitting at a computer. Understanding your user’s context of use is critical. For instance, if you’re a retailer, your store locator (or address/map/directions) is probably significantly more important on a mobile device. Adjusting the hierarchy of elements within the site, or on a single page is a prudent step in developing a successful responsive strategy. The one demographic exception to this might be preteens and teenagers who utilize mobile devices more like traditional computers that any other group of users. That doesn’t mean you don’t have to understand the context of use, only that the mobile utilization will be more similar to computer use than with other user groups.

Developer Resources
Developing convertible sites or sites that render and function appropriately on differing devices has been a long work in progress and continues to evolve. As more devices and operating systems are released into the market the complexity levels continue to rise. This makes finding the appropriate developers a challenge. Determining the level of sophistication and complexity in your sites responsiveness may be driven by resource limitation over any other consideration.

As a final thought, it's important to assess the complexity of your main site, and the capabilities of your team. Making the site for computer consumption and for mobile consumption is not the goal. While consistency is important, sameness is not, and making the site work for your users in context is more important than all of this. Many content based strategists will tell you other wise, but if your site is too complex, and your team not up to the 'responsive' task, a separate mobile site has some advantages.