Responsive Design for Mobile-Tools, Techniques, Future Trends

(Guest post from Magnus Jern, CEO of Golden Gekko).

Next to the Mobile First philosophy (see previous article) Responsive Design (according to Wikipedia) also referred to as Liquid Design is probably the most talked about trend in mobile and web user experience design. The term was coined by Ethan Marcotte in 2010 and the principle is simply that you design one web site that adapts to any device using modern web development methods including CSS3 and image scaling.

Examples of Responsive Design

Although there are thousands of examples of web sites based on responsive design today there is only a limited number of big companies that have adopted it and usually more as an experience or only partially. The most mentioned being the Boston Globe which displays beautifully on devices ranging from a big screen TV to a Blackberry Curve. Other examples include Starbucks and Google News (partial). Ethan also has a list of other great sites here. To get a basic understanding of how it works simply open up one of these sites in a browser and reduce and increase the browser window and see how the page changes and try accessing it from your mobile. Then compare it to a traditional site such as NYTimes.com (the owner of Boston Globe).

So is responsive design a hype or solution?

Opinions vary. At the moment the main proponents of responsive design are web front-end developers as it puts them in a powerful position and potentially removes the need for separate sites and teams and they can claim to support all channels. On the other hand only a few major websites have fully embraced the methodology and some like Linkedin simply believe that it delivers a bad user experience for their users according to an article in Venture Beat. So what are the pros and cons?

Pros 

• Easier and quicker to manage one project and web site than multiple
• Reduces cost of development and maintenance by only maintaining one infrastructure and one team
• Typically will work automatically on new devices, e.g. tablet without customisation
• Simple technical solution to a common issue
• Could improve SEO as all traffic will be directed to one URL rather than multipe, e.g. www.website.com, m.website.com and touch.website.com
• No need for device recognition
• Read more pros in this article in Society of Digital Agencies

 Cons 

• Complex to plan and design which may actually lead to a higher cost and longer time to market than separate channel
• Data size of pages become very big for a mobile device both in terms of download time and memory used (see article about Mobile First)
• Rescaling for mobile devices typically generates very long pages requiring lots of scrolling which is a bad mobile user experience
• Difficult to generate revenue from ads Images are typically optimised for the device with the highest resolution
• Use cases for mobile and a PC web can be very different
• Most common denominator between browsers means you typically end up doing trade-offs to support all channels
• User interaction between different devices is very different on a touch screen device from a screen controlled by a mouse or remote control (TV)
• Requires the same amount of testing but needs to be done across a lot more devices every when you make an update.

So what’s lies ahead in the future?
The reason that most major companies have not embraced responsive design is that although it’s technically straight forward, it really complicates the layout of pages and information architecture a lot. Designers have to plan for most common denominator between different devices which will usually lead to a compromise. At the same time any website should be as responsive as possible without compromising the user experience for bigger screens. Both Amazon and Facebook are examples of partially responsive design that scales certain elements but not all. One of the reasons to separate mobile and web is also that the use cases are very different. If you are standing in a clothing store accessing their website then you are most likely to want to find out about something related to the customer touch points in the store such as price comparison, offers, where your size of a product is available, etc. If you are sitting at home browsing then you’re primary use case is more likely to be browsing through the products. I believe that the Mobile First methodology is a more important principle than Responsive Design as it forces you to focus on the core use cases and enhance over time.

 (Image courtesy of white-fire.co.uk)

Golden Gekko's expands Asian operations-adds app developers

PHNOM PEHN-Leading mobile application developer Golden Gekko has been at the forefront of mobile marketing since 2005 and, building on its success, is now planning further expansion.


Golden Gekko is currently expanding operations in Cambodia, Spain, Sweden and UK with an announcement on entry in new markets soon to be announced, says the company. With 65 employees and plans to reach 100 by the end of 2010, Asia already represents a key development hub for Golden Gekko.


Since 2009, Golden Gekko has been adding new solutions to its product portfolio, key amongst which is the Mobile Directory Solution, designed to put Yellow Page and other Business Directory sites onto mobile. Golden Gekko now delivers the full range of mobile apps and mobile websites to European Directories, Europe's biggest Yellow Page operator.


The company also says that it plans to launch its iAds for the iPhone platform within apps developed and so deliver more exciting and appealing ads while still remaining within the application environment.