There is a conversation happening among web designers, techies and consumers at the moment, a debate which has been growing in recent years with the rise of the mobile device and tablets; the question is – what is the best way to be accessible across all mediums? Do you go for a “Responsive Web Design” or do you simply create a Mobile Website and / or an App for mobile users?
Responsive Web Design essentially means that your website will adjust itself according to the screen size it’s being displayed on. Many pro-responsive developers affectionately term RD “one-Web,” which emphasizes the single set of code a responsive site is based on. As a result, users across a wide range of devices (smartphones/tablets) and normal web browsers will have access to a single source of content, laid out so as to be easy to read and navigate with a minimum of resizing, panning and scrolling. Sound simple, effective, and pretty damn cool right? Well, we’re not so sure, and we’re going to explain why.
In a nutshell, the objective of responsive web design (RWD) is that it is flexible; with responsive design, your website will fit virtually any device with a full browser: smartphones, iPad + other tablets (both landscape and portrait modes), and even TVs. It doesn’t matter that the Galaxy Tab’s resolution is different from an iPhone — your site should render across both. RWD is a perfect solution if the only changing factor in the users experience is their device – magazines and newspapers work well because the user requirement is the same – to read the content. The most notable example of this type of RD is the Boston Globe.
The idea behind RWD is not really that new; any web designer who has been using Dreamweaver for long enough will have noticed the update back in 2010, which introduced HTML5 and Media Queries support, along with a ‘multiscreen’ button which allows users to view their designs across varying resolutions. So, there is definitely something to be said for the functional application of Responsive Web Design; however, while responsive design aims to scale web content fluidly across multiple devices with different screen sizes, it may not represent the best option for organizations aiming to deliver unique and innovative experiences to customers.
Unfortunately this depends very much on your website requirements – if you have a simple website, then perhaps this might be true. Our new websites for England Under 21 player, Marvin Sordell & Team GB Cyclist Alex Dowsettare both RWD websites. Unfortunately, in most cases, the time spent building a complex website using RWD can be a lot greater than doing it the old fashioned way. You should also consider how much ROI you are going to get from a responsive design – It’s quite often the case that a non-responsive design will work fairly well on a mobile interface and having a responsive design may not even be necessary; there is also a greater risk of incurring extra cost due to unforeseen complications and possible bugs with a responsive design.
It is also the case that with a responsive design that more code is required to allow it to ‘seamlessly’ flow between interfaces – the problem with that is that more code = more to update – this means more of the developers time, more of your time, and more of your money.
If you already have a website which functions well and you simply want a more user-friendly mobile interface for it, Responsive Web Design is not the way to go, because, as any web designer will tell you, it’s extremely difficult to transfer your current site into a responsive design. It’s far easier to rebuild the website from scratch. This means – you guessed it – more time, more money, more headache.
Responsive Web Design means that you are delivering all the same content, regardless of the platform or device being used. All it has done is optimise this for your users viewing screen.
However, it’s likely that you will have a lot of content on your website that doesn’t need to be shown to mobile users; and even if you hide it through the use of CSS Media Queries, the device will automatically download all the hidden information. This takes up an enormous amount of space and slows the process down immensely, creating a frustratingly slow user experience. Even if you try override an image with one created specifically for mobile, both the mobile AND the desktop image are then downloaded. Yikes!
A good example of reduced and tailored content for mobile website would be m.londonpass.com & m.daytona.co.uk
With viewable content, the same issue occurs; when the browser has resized an image to fit the smaller screen, the full image is still downloaded in it’s original size – not only that, but browser resizing can be extremely memory intensive as the device will download the larger image, uncompress it and resize it to fit the screen. Even Apples Mobile Safari Documentation reads: “You need to size images appropriately, don’t rely on browser scaling.’
This applies to more than just images – CSS Media Queries will not remove unnecessary html or javascript that will slow down mobile browsers. Even if you can’t see that Google Map, your phone is still downloading it, and that means MORE space being taken up.
In addition, long content pages with one, or even two side columns that work well on the desktop, are finger cramping scrolling exercises on the thin single column of the phone, creating a painful mobile experience.
As we have pointed out above – speed matters, and hiding information does not stop it from being downloaded. This means that unless your customers devices are running on some seriously hot wifi, the download speed of your website is going to be S…L…O…W
In addition, content delivery on responsive sites has the potential to deter users; for instance, if you are trying to deliver complex functionality built with CSS, JavaScript, Ajax or other heavy Web Development tech, pages will be dramatically slower on mobile devices. In comparison, device specific sites can be developed with HTML5 to add functionality and deliver adaptive user experiences. Time lost equals potential loss of customers, as page loading times have a direct impact on your ability to deliver a positive user experience.
It seems to me that responsive design suggests that mobile web usage is simply a substrate of the full usage web, but it seems clear that in fact, people use mobile web browsing to a very different end. Consider what a user might be searching for with their mobile; the user won’t have the time or desire to ‘browse’ the site in the same way they might on a desktop. The user expects a different experience as their end goal is different; they want something fast, convenient and contextual while still being relevant.
This infographic from the blog Marketing Tech Blog shows EXACTLY what the cost of this could be to your business and to your site.
With RWD, you cannot easily adjust Titles, Descriptions, and Content for the mobile users and responsive web designs often have poor information architecture. Mobile users use different keywords, more likely to use voice search and for some verticals, there can be significant variation (use Google’s Keyword Tool, which separates mobile searches from the desktop); this creates a barrier for optimisation SEO because your mobile site and your website are using the URL. In addition to this, Google doesn’t rank sites based on the mobile-only content located at the same URLs. If your responsive site targets user-agents to serve certain mobile-only content, it will not be indexed nor used to rank your website.
Responsive Web Design requires compromise – it is a subjective decision by the designer; the desktop design you want will not be optimal on mobile devices… and there goes your design; which now has to be re-jigged to something far simpler in order to be optimal on mobile devices. Your original design has been compromised and is now not quite what you expected.
Customer focus can be lost quite easily when designs are compromised – many mobile users will be left feeling rather frustrated when presented with a different design if they do not feel like they are in control. Mobile visitors often have a very different set of objectives for visiting your site; therefore, simply squashing content to fit on a smaller screen isn’t particularly helpful. Instead, it is important to consider how different contexts change the content that users want. Is the new design going to make the user interaction better or worse? Remember, briefly, the issues we touched on previously about download speeds and the reduced functionality of your website when it has to move from desktop to mobile with all the same content.
Is this compromise greater, or lesser, than the effect of designing and paying for a non-responsive mobile platform of your existing website? Considering that the responsive design may in fact cost more, in both time and money!
The future of your business in the digital world depends on your ability to integrate, and therefore master, the mobile channel. The rapidly growing numbers of mobile users are due to the convenience of remote access, coupled with a new reliance upon the delivery of information where previously there was very little available. When developing your philosophy and approach to engaging customers, both via traditional formats and via mobile, it is essential to ensure your that your strategy takes into account the rising expectations of the consumer has from their mobile device and so their mobile web experience.
So give us a call on 0207 287 7060 or email info@webheads.co.uk, or complete the form below.
We will use your email address to contact you regarding your query. We will not pass this on to any 3rd parties, in accordance with our privacy policy.
