Posted By Emily Nicholls Wednesday, December 12, 2012. No Comments
Guest Blog from bemoko client Andy Nash -Macmillan Cancer Support
Firstly, we need to appreciate what the mobile evolution is. Nokia phones in the 1990’s connected people and became the mass-appeal, must-have personal gadget for a generation. In the mid-2000’s smart phones were accessing the internet, allowing people to download applications and interact on social media in an immediate way. For most people their mobile device has become the primary multi-purpose, multi-functional device they have with them 24 hours a day. And that is the evolution – mobiles are the turn-to device and sometimes the only device people now use because in one hand-held device that they have with them all the time, they can carry out actions they would have needed several devices for in the past, not all of which were portable.
Secondly, we need to understand how people use mobile devices and what makes this a challenge that is much more than just putting our desktop sites onto mobile devices. There are three considerations here that we need to keep front-of-mind:
• Time spent looking at information on mobile devices
People think of a question, turn to their mobile device for an answer, get it and that’s often the end of the journey. Reading at length and going off at tangents following related links is often not as commonplace as when sat comfortably in front of a desktop machine.
• Levels of distraction
Because the mobile device is with people all the time, people use their devices essentially throughout the entire span of the day. In most cases, they are distracted by other things: getting ready for work; walking; other commuters on public transport; eating; or the TV, for example.
• User expectations
People expect mobile to enable them to get answers, provide those answers in a rich way and make the absolute most of the capabilities of the device – not just serve up text in a web page
We need to guard against seeing mobile as another delivery platform for desktop experiences. Or worse – a cut down version of the desktop website. Yes, mobile devices have smaller screens, limitations in terms of connection speeds and network coverage. But the limitations of desktop machines are vast in comparison, because the mobile is such a multi-functional device. They can’t make calls, send texts, precisely geo-locate, take pictures, or interact in any significant way with the real world. Each of these functions can be tapped into to enhance what would previously have been done on a desktop website. People no longer need to be told “Pick up the phone and call us!” – they can just tap the telephone number on screen. They no longer need to print out a map from a website, they can use the in-built navigation function of the mobile device that is able to be geo-located through its GPS. No longer does a poster have to have a memorable URL printed on it for the causal passer-by to try to remember when they get home. A QR code alternative will enable smart phone users to scan it and go straight to the page whilst still in front of the poster.
The mobile device is already becoming the device of choice for most people. As such, the way organisations are embracing and exploiting the multi-functions available on mobile devices is only set to grow.
So what does this mean for charities? Well we in the charity world have to be careful to spend money donated to us wisely and add value to our services with it. We also have to find ways to show those that donate to us what a huge impact they are making on our behalf. And we have to encourage our supporters to continue to support our worthy causes. The mobile evolution enables us to do all these things and link them all up in a way that we simply could never do via desktop websites alone.
• Provision of information and services can be more easily personalised.
• Fundraising and campaigning can be made much more immediate.
• Enabling supporters to get involved can be much more localised.
But, when commissioning work, we need to have a good understanding of how embracing mobile is not just an editorial challenge, but a technical one as well and that the two are inextricably linked.
• Developing for mobile is not easy.
• There are lots of buzz words and phrases in use that mean different things to different people (mobile first, responsive design, device detection, progressive enhancement, graceful degradation for example).
• Mobile should not just be a cut-down view of a desktop site. Neither should it be the whole desktop site reproduced for the smaller screen.
• Organisations should concentrate on what the core information is that they want to communicate across all their devices. Then look at each individual device type (by grouping similar devices together – for example, feature phones, smart phones, tablets, desktops) and work out how that device type can enhance the core content and provide extra device-specific content.
• Do server-side device detection and use that to determine what to send to the device you’ve detected. Don’t be lazy and send everything to every device and expect the device to sort out what to display (why send a device on 3G any more data than it needs to display.
• Beware full-service agencies that have mobile as a bolt-on to their core business.
Guest Blog by Andy Nash,-Digital Project Manager – Mobile Macmillan Cancer Support
“Andy has worked in the digital arena for 18 years, including both public sector and charity. He moved from desktop web to mobile in 2010 and now evangelises daily on the need for everyone else to join him. He is passionate about user centered design and build”
If you are in charge of delivering your company mobile strategy, you are more than likely receiving multiple differing views on the subject from many different people. Should you go responsive, should you use a separate mobile site, should you use a platform to deliver mobile sites or should you write a separate site for each device (ok, so that last one is extreme, but I’ve seen it done) – there are a huge variety of different options, all with their pros and cons.
All of the different approaches are essentially a compromise, they can all deliver a workable solution but there is always a compromise on some aspects of the delivery. You need to choose which compromise to take and pick your route accordingly. One problem we have seen in RFP situations is that you can’t compare quotes on a like for like basis. They are all taking a different approach – some approaches cost more upfront but deliver cost benefits in the long term whilst some look initially attractive and it’s only when you are a year down the road that it becomes prohibitively expensive. Essentially, you need to be a mobile expert to decipher the RFP responses for the mobile experts you are trying to hire.
There is a solution that covers all the different techniques in one place – we’ll come on to that later. First I’d like to go through each of the main techniques and list the pros and cons.
Responsive (or adaptive) Design
This technique is getting a lot of mention recently and is viewed by some as the holy grail and answer to all their problems. Sorry to disappoint, but I’m afraid it’s a compromise. Responsive seems to make perfect sense and the idea that you can have your site respond to different devices (primarily based on screen width) and only need to develop one site sounds like a better than sliced bread moment. It’s when you stand back and think about the context of mobile where you find the compromise. Yes, it’s great writing one site and delivering to all screen widths, but is that really understanding mobile context? A mobile user with a touch interface has different needs to a PC/desktop user with a keyboard and a mouse. The navigation of the site should be different for these contexts. I’ve seen examples of responsive sites (this example is an insurance comparison site) where, on the desktop, the calls to action are clearly displayed on the homepage – this site owner really wants people to click on home, car or health insurance. When viewed on a smaller screen, the responsive elements kick in and very nicely changes the layout of the page for a smaller screen. In this case, however, it means that all the calls to action scroll off the page and aren’t easily visible. You are trying to fit a layout designed for a large screen into a small screen without accounting for the context. A better solution would be to make all the call to action buttons different so they appear on the front page for mobiles. This could be done with responsive, but it’s now getting more complicated to manage the site to cater for many different devices.
Another big issue is page size. Typically the responsive site delivers everything to the mobile and then the device ignores half of it. A great example of this is the Channel 4 news site which delivers an astonishing 2.5MB of information to the device, most of which is not used. Given that a long page load time deters users, my average download time of over a minute for this page is not encouraging.
Responsive design seems attractive initially. There are no license costs for software or middleware platforms and everything is done using standard web languages. Managing and enhancing a responsive site becomes increasingly expensive and risky as more and more diverse devices need to be supported and the stylesheets get more complicated. Your very talented web developer who knows how it all hangs together may leave, giving you a real headache managing the site.
Having said all this, responsive design is perfect for certain sites – news (aside from the aforementioned Channel 4) and content sites are particularly suited to this technique, but transactional site not necessarily so. The technique can simplify site creation with all the business logic in one place and you don’t have to manage 2 sites. You also get a single URL with no need to redirect to a mobile specific site and all the SEO benefits that has.
A mobile specific site
If you understand that mobile requires a different context to desktop, you typically end up here with a mobile specific site which gives you all the flexibility you need to cater for your mobile based users. Here you can design specific, optimised pages and manage the user journey. Your analytics will relate specifically to mobile users and you can adjust the journey accordingly to get the best from your site. Your PC site will automatically redirect to the mobile site and it will be available on an m. URL so searchability and access to the site will not hinder your users and they will get the best experience for the device they are using (with, of course, the option to view the PC site on a mobile if they want to).
All the above gives maximum flexibility, but it’s still a compromise. You have to manage 2 sites and they aren’t served from the same URL (the redirect works, but from an SEO point of view it could be viewed as a separate site). Although the separate site should not duplicate content, some of the business logic may need to be different and there is inevitably some duplication. Managing a separate mobile site without the benefit of a platform (see below) can become expensive.
Creating a different mobile site for different groups of devices
This is a handy one as it can make your life easier. If someone is suggesting this approach you can discard their response immediately.
Using a platform
There are a number of device independent platforms that deliver all the benefits of having a separate mobile site along with the added benefits of making it easy to manage the multitude of devices and ensure that the site is future proofed against new device developments. A platform will deliver cost savings on maintenance and site enhancements going forward and you will not be in the sticky situation of rushing to make the site work on a new device – the platform should manage that for you.
It’s true that there may be more upfront cost for a platform as you might have to pay for licenses to use it. But think of the platform as less than the cost of a developer for a year – it will keep the site in a manageable format that anyone can edit and it’s not suddenly going to leave. Well worth the money in my opinion.
To summarise the above, there are many different options available for delivering your mobile site and they all have compromises. In an ideal world you would like to:
- Deliver the site from one URL without redirection
- Respond to different devices from one code base
- Have the flexibility to deliver mobile optimised content that may be different to the PC content.
- Reduce code duplication and back end business logic integration effort.
- Group devices based on a better granularity than just screen size.
- Not just rely on complex style-sheets to deliver a different layout
- Ensure you are delivering only the content the device needs and not extra content that will get ignored.
- Not relying on talented, expensive developers to deliver complex responsive based solutions.
All the solutions discussed above deliver some of this wish list, but none can deliver all.
There is one solution which can deliver all of the above. The bemoko development platform can deliver sites to any device, including PC and desktop and allows for comprehensive device grouping so that markup can be targeted to specific devices. Full support for HTML5 and CSS3 means that responsive design can be used where it is beneficial. Markup is automatically optimised for each device meaning the end of the 2.5MB page size.
Because the platform manages all the devices, there is one code base and one URL – there is no redirection required. The user experience for mobile/tablet/phone/TV and anything in the future can be changed to deliver the perfect experience for the device being used and not a compromised PC layout delivered to a small screen. The layout can be changed using a mixture of style-sheets and HTML code which simplifies site build and maintenance. The backend code integration can be done once for both desktop and mobile.
If you really want to deliver the best user experience for your users whilst reducing development costs on support and maintenance, the bemoko platform can help you achieve your goals and increase customer engagement by providing the best user experience for, however they interact with your site.
By Mat Diss – Managing Director of bemoko