 "Joining the digital dots")
A few years ago conversations for brands revolved around the necessity of a digital and mobile strategy. Today, given the popularity of handheld devices, both these mediums have moved from good-to-have to must-have. They are an indispensable part of any brand strategy, whether from an advertising and consumer engagement standpoint or a transactional, commerce one. As marketers and consumers mature with regard to their usage and engagement on the digital and mobile platforms, it is time to move the conversation to the next level: how best can the content be delivered to the consumer is an area that now needs serious consideration.
Currently, the approach adopted by most brands is to either create specific mobile URLs (web addresses) or native applications that can be downloaded from the app stores. There are certain shortcomings with both these approaches. One, the sheer variety of devices, with different physical aspects like screen sizes, resolution etc can lead to a variation in the viewing experience, even for the same URL. Customising the experience using a native app may be a good idea, but the number of users that can be targeted is limited. Popular app stores such as the ones accessed by iOS and Android devices will let you reach out to only a certain demographic. What about the rest? It may also be impractical to create a different app for every app store out there in terms of the time and money invested.
The solution then rests in what the web designing industry is beginning to refer to as 'responsive design.' The term was first attributed to a designer, named Ethan Marcotte. It simply stands for an approach to web design that adjusts to the user, from varying browser sizes to changes in device, retaining a uniform viewing experience across devices. (WHICH SOLUTION IS BETTER FOR YOUR MOBILE SITE)
Responsive design should not necessarily be looked at as a 'cost saving' initiative. What you may save by not having to design multiple versions of the same app, you may spend on strategising and planning that overarching design. That is because the responsive design approach may require an overhaul of your existing digital architecture and not exactly build on it. The benefits may start pouring in after some time and in some unexpected quarters like search optimisation. Sample this: responsive design websites are recommended by search engines like Google as they avoid duplicate content issues. This can mean improved ranking performance for your websites.
The term responsive design may be used interchangeably with another, namely 'adaptive design.' There isn't much difference in what the two approaches achieve. They vary instead in the more technical aspects like the codes used for creating and designing the website. In this article though, we won't go into the coding aspect but focus on the end result of the new design ideas gaining ground and how and why, if at all, it works.
Sudhindra V, creative director and experience design lead, SapientNitro India, an interactive marketing, and technology services agency, explains the 'how' part of responsive design: "Responsive design must be looked at from the perspective of creating an entire architecture and not just as a method to adopt your website to different screen sizes. There needs to be a great degree of strategic planning keeping in mind trends that could impact the web viewing experience over the next few years. For instance, one needs to define breakpoints or the range of device categories that must be considered. The current ones being the big browser versions (for desktops and laptops), tablets and hand phones (mobile phones)."
He says that in technology the need to watch out for new devices is exacerbated by sudden game changing introductions in the landscape. For instance, before the iPad, tablet as a category was virtually non-existent. "Web designers must therefore work in sync with expected product introductions to anticipate the changes to the way the internet would be consumed in future," he adds.
The scope
Responsive design exerts its influence beyond the realm of regular web design. It gains critical importance when the consumer's only engagement point with the brand is a handheld device, like say in the case of email marketing messages. Naveen Bachwani, head, marketing services, Experian India, explains, "Most people access their emails on their smartphones today. If they face any problems while opening the email, they will simply abandon the effort. There is very little possibility that they will go back to their inboxes via say a desktop to access a particular promotional email. The message must therefore recognise the device and render itself accordingly to ensure good click-through rates."
Before we proceed, who benefits the most? The marketer or the consumer?
The advantages are for all to see, but as a marketer don't lull yourself into the belief that you absolutely need it. At least, not before you analyse whether you truly need it.
Consider this. When Ethan Marcotte was asked to put together a list of 20 best responsive websites by Creative Bloq in 2011, one of the websites he picked belonged to an architecture firm, Andersson-Wise Architects.
When Marcotte asked the website's designer Chris Malven why they adopted a responsive approach, the latter reportedly said that the diversity of their audience was key. Malven elaborated, "There are many different situations in which someone could be looking at the Andersson-Wise website. It could be a prospective home-builder casually browsing on her iPad, or a university president researching firms on her office computer. Or, for that matter, an architecture student browsing on the phone during her daily commute. We wanted everyone to feel like the site was designed specifically for the way they were viewing it, regardless of device, screen size, or connection speed. With a responsive approach you get one of the best qualities of print: a design perfectly suited to its format. But you also get the best of the web: content that adapts to every viewing situation."
Malven's explanation is key to what responsive design helps you achieve but it also highlights one point that can be counter intuitive, that of the diversity in the usage of a website, depending on the device picked. Consider the example of booking air tickets. It is an extensive, time consuming process - not so much due to the actual act of booking the tickets but more because of the research that goes into it. One would naturally be more comfortable using a laptop or a desktop for such extensive browsing. But consider that you are en route for airport. You forgot to do your web check-in. An app on the mobile web would be your go-to option.
The point is that every digital touchpoint may be serving a different need of the consumer, rendering the responsive design approach useless and thus demanding a more defined one instead. Sudhindra of SapientNitro gives the example of auto company Chrysler. "Car purchases are big family decisions, which require a lot of research, accompanied by high image and video consumption. This is not possible on handheld devices. The obvious approach here was to keep the big browser and mobile website versions separate. Specific content like dealer details and locations were included in the mobile version from the handset perspective."
Not a yes-or-no decision
If you have gone through the arguments we have presented above, you will realise the decision to adopt responsive design cannot be a simple yes or no choice. Even social networking giant Facebook famously retracted its responsive design journey partly with CEO Mark Zuckerberg admitting to have laid too much emphasis on HTML5 (the language used for responsive design primarily) vis-a-vis native apps at Techcrunch's Disrupt Conference last year. This, despite the fact that Facebook gets a lot of walk-ins from mobile web. The reason: the requisite 'quality' wasn't coming through on the back of HTML5.
The need of the hour may be to look for innovative ways out, depending on your needs. There are certain obvious 'edge cases' like mobile commerce. The solution for two companies in the same space may vary greatly depending on how your customers like to shop - via a native app or mobile web. May be certain apps are throwing up the numbers but others are sinking. A mixed app-cum-mobile-web approach may be in order then.
At times, responsive design may be required to serve just a subset of the content available on your full browser versions. Take the case of television channels. Most of them host a player on their websites for viewers to consume content already aired. Try accessing one of these "players" from a handheld device and chances are it will be pixellated. A host of channels such as Disney UTV, NDTV, Maa TV and Comedy Time have found the solution in a tie up with a Silicon Valley-based mobile video and media company Vuclip. According to Nickhil Jakatdar, CEO, Vuclip, the channels share their content with Vuclip, which in turn hosts it on its players, making it available in consistent quality across devices.
If you still want to take the responsive path, remember that the idea doesn't boil down to fitting your site on a mobile screen. It is also about making sure that all the functions are available on mobile. This is what we mean. Say the consumer is on her way to your restaurant. Your responsive site should be able to hook her to the maps for easy access to directions. This means that the user interface are touch-friendly, taking into consideration the vast number of handheld devices.
Whether your decision is in favour of or against responsive web design, remember that it must be taken from a strategic standpoint and not a tactical one. It is almost like choosing your future store locations-it is really that far reaching.
Currently, the approach adopted by most brands is to either create specific mobile URLs (web addresses) or native applications that can be downloaded from the app stores. There are certain shortcomings with both these approaches. One, the sheer variety of devices, with different physical aspects like screen sizes, resolution etc can lead to a variation in the viewing experience, even for the same URL. Customising the experience using a native app may be a good idea, but the number of users that can be targeted is limited. Popular app stores such as the ones accessed by iOS and Android devices will let you reach out to only a certain demographic. What about the rest? It may also be impractical to create a different app for every app store out there in terms of the time and money invested.
The solution then rests in what the web designing industry is beginning to refer to as 'responsive design.' The term was first attributed to a designer, named Ethan Marcotte. It simply stands for an approach to web design that adjusts to the user, from varying browser sizes to changes in device, retaining a uniform viewing experience across devices. (WHICH SOLUTION IS BETTER FOR YOUR MOBILE SITE)
Responsive design should not necessarily be looked at as a 'cost saving' initiative. What you may save by not having to design multiple versions of the same app, you may spend on strategising and planning that overarching design. That is because the responsive design approach may require an overhaul of your existing digital architecture and not exactly build on it. The benefits may start pouring in after some time and in some unexpected quarters like search optimisation. Sample this: responsive design websites are recommended by search engines like Google as they avoid duplicate content issues. This can mean improved ranking performance for your websites.
The term responsive design may be used interchangeably with another, namely 'adaptive design.' There isn't much difference in what the two approaches achieve. They vary instead in the more technical aspects like the codes used for creating and designing the website. In this article though, we won't go into the coding aspect but focus on the end result of the new design ideas gaining ground and how and why, if at all, it works.
| 10 Considerations for responsive design execution |
Dan Israel Strategy lead, Mobile Center of Excellence, Atlanta, SapientNitro |
Sudhindra V, creative director and experience design lead, SapientNitro India, an interactive marketing, and technology services agency, explains the 'how' part of responsive design: "Responsive design must be looked at from the perspective of creating an entire architecture and not just as a method to adopt your website to different screen sizes. There needs to be a great degree of strategic planning keeping in mind trends that could impact the web viewing experience over the next few years. For instance, one needs to define breakpoints or the range of device categories that must be considered. The current ones being the big browser versions (for desktops and laptops), tablets and hand phones (mobile phones)."
He says that in technology the need to watch out for new devices is exacerbated by sudden game changing introductions in the landscape. For instance, before the iPad, tablet as a category was virtually non-existent. "Web designers must therefore work in sync with expected product introductions to anticipate the changes to the way the internet would be consumed in future," he adds.
The scope
Responsive design exerts its influence beyond the realm of regular web design. It gains critical importance when the consumer's only engagement point with the brand is a handheld device, like say in the case of email marketing messages. Naveen Bachwani, head, marketing services, Experian India, explains, "Most people access their emails on their smartphones today. If they face any problems while opening the email, they will simply abandon the effort. There is very little possibility that they will go back to their inboxes via say a desktop to access a particular promotional email. The message must therefore recognise the device and render itself accordingly to ensure good click-through rates."
Before we proceed, who benefits the most? The marketer or the consumer?
The advantages are for all to see, but as a marketer don't lull yourself into the belief that you absolutely need it. At least, not before you analyse whether you truly need it.
Consider this. When Ethan Marcotte was asked to put together a list of 20 best responsive websites by Creative Bloq in 2011, one of the websites he picked belonged to an architecture firm, Andersson-Wise Architects.
When Marcotte asked the website's designer Chris Malven why they adopted a responsive approach, the latter reportedly said that the diversity of their audience was key. Malven elaborated, "There are many different situations in which someone could be looking at the Andersson-Wise website. It could be a prospective home-builder casually browsing on her iPad, or a university president researching firms on her office computer. Or, for that matter, an architecture student browsing on the phone during her daily commute. We wanted everyone to feel like the site was designed specifically for the way they were viewing it, regardless of device, screen size, or connection speed. With a responsive approach you get one of the best qualities of print: a design perfectly suited to its format. But you also get the best of the web: content that adapts to every viewing situation."
Malven's explanation is key to what responsive design helps you achieve but it also highlights one point that can be counter intuitive, that of the diversity in the usage of a website, depending on the device picked. Consider the example of booking air tickets. It is an extensive, time consuming process - not so much due to the actual act of booking the tickets but more because of the research that goes into it. One would naturally be more comfortable using a laptop or a desktop for such extensive browsing. But consider that you are en route for airport. You forgot to do your web check-in. An app on the mobile web would be your go-to option.
The point is that every digital touchpoint may be serving a different need of the consumer, rendering the responsive design approach useless and thus demanding a more defined one instead. Sudhindra of SapientNitro gives the example of auto company Chrysler. "Car purchases are big family decisions, which require a lot of research, accompanied by high image and video consumption. This is not possible on handheld devices. The obvious approach here was to keep the big browser and mobile website versions separate. Specific content like dealer details and locations were included in the mobile version from the handset perspective."
Not a yes-or-no decision
If you have gone through the arguments we have presented above, you will realise the decision to adopt responsive design cannot be a simple yes or no choice. Even social networking giant Facebook famously retracted its responsive design journey partly with CEO Mark Zuckerberg admitting to have laid too much emphasis on HTML5 (the language used for responsive design primarily) vis-a-vis native apps at Techcrunch's Disrupt Conference last year. This, despite the fact that Facebook gets a lot of walk-ins from mobile web. The reason: the requisite 'quality' wasn't coming through on the back of HTML5.
The need of the hour may be to look for innovative ways out, depending on your needs. There are certain obvious 'edge cases' like mobile commerce. The solution for two companies in the same space may vary greatly depending on how your customers like to shop - via a native app or mobile web. May be certain apps are throwing up the numbers but others are sinking. A mixed app-cum-mobile-web approach may be in order then.
At times, responsive design may be required to serve just a subset of the content available on your full browser versions. Take the case of television channels. Most of them host a player on their websites for viewers to consume content already aired. Try accessing one of these "players" from a handheld device and chances are it will be pixellated. A host of channels such as Disney UTV, NDTV, Maa TV and Comedy Time have found the solution in a tie up with a Silicon Valley-based mobile video and media company Vuclip. According to Nickhil Jakatdar, CEO, Vuclip, the channels share their content with Vuclip, which in turn hosts it on its players, making it available in consistent quality across devices.
If you still want to take the responsive path, remember that the idea doesn't boil down to fitting your site on a mobile screen. It is also about making sure that all the functions are available on mobile. This is what we mean. Say the consumer is on her way to your restaurant. Your responsive site should be able to hook her to the maps for easy access to directions. This means that the user interface are touch-friendly, taking into consideration the vast number of handheld devices.
Whether your decision is in favour of or against responsive web design, remember that it must be taken from a strategic standpoint and not a tactical one. It is almost like choosing your future store locations-it is really that far reaching.