In mobile-centric Africa, Responsive Web Design just makes business sense!
Web design is a funny thing. So many of the issues we had over 15 years ago still bother us today! I can remember, quite vividly, how often we would be confounded building web sites for clients when a multitude of desktop web browsers emerged that supported different technologies and standards. As a result, you would build a web site to work for Microsoft’s Internet Explorer web browser but when you viewed it on Netscape or Mozilla, it would look completely different and quite simply not “work” as it was meant to. Therefore, we would then have to look at making compromises to the web design process so as to target the most popular browser and then deliberately downgrade the technology so that it could run across “most” of the more popular web browsers out there. Although these issues have been somewhat improved by the arrival of HTML5 and other “tech” that has made life easier for all those web designers out there, we still face some issues to this very day, and thats just on desktop web browsers.
Fast forward to 2012 and so much has changed about web browsers and accessing the Internet on a global basis. Today, a good number of Internet users do so on mobile devices spanning everything from entry-level and slow GPRS enabled feature phones, to 4G Smartphones and Tablets. In addition, the arrival of fairly user-friendly and cost-effective Internet-connected “Smart” TVs means that we now have a truly broad range of “screens” where one can access the web and apps. Its daunting to say the least and as you can imagine its made life a whole lot more challenging for every web designer out there to make sure a web site can be “consumed” across a mind-boggling range of ever-changing screens. But, alas, something I have been meaning to write about for months about on this blog is the emerging practice (now) known as Responsive Web Design, or, RWD for short. Going by the Wikipedia definition, RWD can be defined as follows:
Responsive Web Design (RWD) an approach to web design in which a designer intends to provide an optimal viewing experience—easy reading and navigation with a minimum of resizing, panning, and scrolling—across a wide range of devices (from desktop computer monitors to mobile phones)
My goal is NOT to inundate you with the technical aspects of how to build and deploy a RWD web site but rather to share with you what I see as the business benefits from a business perspective. You see, especially in Africa, the Internet and access to the web is largely happening on mobile devices. In markets such as Kenya, research from the likes of the Communications Commission of Kenya (CCK) suggests that over 90% of Internet access in Kenya is happening via the mobile channel – thats huge, whichever way you look at it (even if its also probably representative of a good number of 3G dongles hooked up to desktop computers and laptops). These sort of numbers are not unique to Kenya and one finds that in many African and other emerging markets, the Internet is indeed mobile. Many of the Internet’s newest Internautes over the past few years have come on-board probably for the very first time and continue to do so on mobile devices. Indeed, the mobile screen IS the Internet and the web for them in all of its myriad forms including mobile apps, social media, etc.
Therefore, from a business perspective, and my excitement in doing this blog post is that RWD is especially important for mobile-centric markets such as Africa. However, if one samples a good number of branded corporate web sites in Kenya, one will note that the majority of them when viewed from a mobile device tend to render very poorly. This ranges from the fact that these web sites, although probably accessed mostly from mobile devices have been designed for a desktop web browser experience with all the requisite and bloated “bells and whistles” such as Flash, etc. Quite simply, this does NOT work for mobile and a RWD compliant approach to building web sites, across the board, is required.
The really cool thing though is that although RWD is only around 2 years old in its current form and fast gaining adoption globally, there are already so many web sites and resources online that you can find via Google to get you started including pre-built templates, code base, etc. Like I said, the main thing is NOT to learn the technical issues but learn as much as you can about it and ensure that whoever is building or managing your web site utilizes RWD, from the bottom up. Indeed, it was only recently that some research from Google found that if consumers could not access your business web site effectively via a mobile device, they would not consider buying your products or services. For me, this is reason enough to get on the RWD bandwagon if nothing else? Its a “build once, run everywhere” model that ensures your web site is reliably visible on all screen sizes and devices irrespective of what they are. Nuff said! See below the infographic explaining RWD in more detail:
The Author
10 Comments
Irony is your blog design is not responsive
@MMK work in progress. At least it has a mobile version 🙂
I disagree. Responsive Web design is not right for Africa yet. Reason? One word: bandwidth. Africa, especially Nigeria doesn’t have the necessary mobile bandwidth to accommodate responsive websites. A typical Web Page could be as much as 2mb upwards whereas a mobile Page would be aiming for 50kb or there about.
A responsive Site is just a resized version of the desktop Page. A customer with just 100mb data allowance will not want to visit a 4mb responsive Site ifhe can visit a 50kb Site with the same information. Barack Obama said Site is responsive, but even on mobile it weighs at a hefty 4.5mb. BlackBerry Internet browser can’t even open the Page.
My Site http://www.ibsnigeria.com is responsive but I used minimal graphics such that even on the desktop it consumes minimal bandwidth. Unless a web page is built for mobile and scaled up, responsive web pages do not make business sense in Africa yet.
@oladipo thanks from the feedback. I can see your point of view. However, there are always solutions to these sort of Issues. Code can be tweaked. Images can be adaptive. That’s the beauty about RWD – there are always different ways to execute to achieve the desired outcomes.
@Oladipo we have been doing a research that targets two African countries (Angola and Mozambique that we also define as MOBILE-CENTRIC ) and our findings are that the best approach to deliver web content to these countries is a mix of “Mobile First Responsive Webdesign” and user agent sniffin combined with strategically placed servers for redundancy.
You could also detect download connection speeds on your mobilefirst approach and do some progressive enhancement if you detect a broadband (not likely in the countries we research Angola average connection speed is 923kbps and Mozambique 834kbps).
@Moses Kemibaro congratulations for your article we will be showing it to our clients as a great insight from someone in the region (i’m from Portugal)
Your argument is completely wrong.At the heart of responsive web design is media queries,which is part of css thus the line between content and presentation is extremely clear.
If you cannot gzip your static assets or put them on a CDN,then your problem is not responsive design in Africa or wherever else your page is visited from.All in all,the javascript,css,sprites can never add up to a megabyte for ordinary day to day wesbites.
Nice article Moses
The real questions is: has the development community embraced it and who are the real users of your site?
There is no doubt that standards need to be in place to better manage the multi-screen web, fluid grids, images, frameworks and content that adapts to any screen. But there is a big debate now in the dev community that maybe adaptive web design approach is the better answer for the future web development.
RWD is in its early stages. Web designers will continue to offer different opinions and recommend directions related to whether to build for mobile first, how to fit these decisions into the design process,and so forth. And as more and more screen sizes and form factors arrive, the conversation will continue.
It’s clear that some form of responsive Web design will be used to meet the challenges, and it’s equally clear that standards will continue to evolve as better ways of handling the changing world of devices and browsers are discovered.
Your visitors don’t give a damn if your website is responsive, what’s most important is that the end user need to have a good experience across all platforms–especially mobile–by having your website load quickly and without awkward or broken interaction.
The end-goal is to have a website that is best optimized for your audience on all devices, whether it be a laptop, tablet or smartphone, and it’s your job to figure out what the best means to that end would be. However, don’t jump on the “responsive web design” bandwagon without asking first if responsive is the best way to go.
I think it’s better to do two things when creating or altering a web site design:
1) Check Google Analytics for your websites and see what devices are generally found viewing your website. If browser XWY hasn’t even been used to view your website, don’t stress it – it’s not a big deal.
2) Do some research for the typical user-level that will view websites in your niche. If most are beginners, don’t expect them to use super high-tech browsers or computers.
With this information, you can optimize your website design for those specific browsers/resolutions/Operating Systems, and then let the rest just be as it.
The real answer is to invest in user experience research.
I got back to this post to anounce that we just beta launch http://www.storiesofwines.pt the first Wine Club in Angola the development approach needed to be mobilefirst and we used a mix of #rwd and server side user agent sniffin to deliver light weight fast webpages. In a country were the average internet speed is bellow 1mb/s the feed back that we have so far is very positive.
Responsive Web Design is critical and must be a part of your mobile strategy. As a business, if you don’t have a mobile strategy then you must implement one today. People today require more information on the go and are highly mobile. So the products and information you provide your potential customers must be tailored to the specific platform in use. For the developer, the issue of bandwidth might come into play but there are ways to combat this. One could systematically optimize all aspects of the design while another way to achieve RWD via server side but this will require the host is up to speed
Great piece Moses and an eye opener to many designers outside there.I recently design this http://kidscompcamp.com/.
And Yes development community have embraced it. And yes your visitors do mind if they can navigate easily.
We will share your thoughts and one by one make Africa a better place.