We love digital

Call 0845 485 1219

We love digital - Call and say hello - Mon - Fri, 9am - 5pm

Designing a Website For Mobiles

John Waghorn

by John Waghorn on 11th June 2012

SmartphoneThe way in which we access the Internet has shifted over the last five years as mobile Internet browsing has increased in popularity. Today more companies are making the transition to mobile compatible websites having witnessed significant changes in user habits (see Mobile Internet Usage on the Up).

It’s important to acknowledge that desktop viewing is still very popular and will continue to be a preferred option for many people for some time to come. Nonetheless, the statistics point towards a huge rise in mobile internet usage, which means it’s now more important than ever to ensure that your company has an optimised mobile website in order to bring in additional traffic. Presenting information in an alternative way that correlates with existing user habits will only be beneficial to your business.

Over time, it’s inevitable that more companies will start to follow this trend and enable mobile sites as people have begun using different methods for ‘searching on the go’. Therefore, by getting a head start on competitors, you may be in a better position to capitalise in both the short and long term. So what do you need to know when designing a website for mobile? This post will look at some of the key factors you need to consider.

Mobile website design can be a complicated process, but you should definitely work with the theory that less is more. First of all you need to consider how you will present your website in mobile format. Essentially you have two options. You can either create a whole new website for the purpose of mobile viewing, or you can enable your main desktop website for usage via mobile devices. Choosing the second option will mean that you to have a site that is compatible for both mobile and desktop, or one that will contain a URL redirect to a mobile website version. However you decide to get your mobile website set up, there are a number of key factors that you should take into account after the initial design stages. Let’s look at these in more detail.

Think about the space available

The websites that make people return to them time and time again are those that are user friendly and provide the best user experience. With this in mind, your site needs to be easy and clear to use. As you won’t have as much space available on the screen compared to a desktop web version, you need to utilise this space in the best way possible. There are so many phones on the market today, Nokia, iPhone, Samsung, and Blackberry to name a few, but it’s no coincidence that most of them are a similar size, and although the screen resolutions may vary this provides a convenient guide for developers and designers.

Present the most important information first

Due to the nature of mobile browsing, users might only stay on your site for a short amount of time, and so the most important information should always be visible above the fold of the page. Think about the type of information you are looking for when you first visit a website and this should help you in terms of layout. If your web address redirects to your Home page then essential information such as company details, brief overview of services and contact details should be prominent on the page. This will vary depending on what it is that you offer, but take time to consider what your users are likely to want to see straight away.

Domino’s Pizza is an example of a great mobile website which gives users the option straight away to ‘Order now from your phone’ by entering your postcode. In addition, there are six other options available to click on: ‘Go to the Domino’s desktop site’, ‘Store Locator’, ‘Contact Us’, ‘Login’, ‘Register’, and ‘Boring Legal Stuff’. It’s reasonable to assume that most visitors go to the site to buy a pizza and so they are given this option before anything else. However, it is equally important that other options are also provided, which is why the additional sections are listed beneath.

From here, users can move on to other pages; once again, this is a clear visual representation for the concept that less is more, as the Home page isn’t cluttered with unnecessary information.

Popular online clothing store Asos also use a simple to operate Home page which gives users the option to ‘Shop by product’ under men and women categories with the inclusion of a more direct search feature in the top right hand corner of the page. In light of this, remember to keep it simple and present key information before anything else.

Links

No one wants to spend five minutes clicking through to the page they require, so keep the number of times users have to do this to reach their desired page to a minimum. Usability is the most important factor to consider, so bear this in mind as an easy-to-use mobile site will encourage the user to return. Also, remember that for a mobile site people will use their finger to click on links, through touchscreen phones, rather than a mouse as they would do on a computer. This doesn’t mean you have to create huge links in bold, but instead keep them a decent size so that they can be accessed with ease.

To improve ‘clickability’, ensure that there is enough whitespace surrounding your links so that users don’t click on other links by mistake; this will only cause your visitors frustration and result in them leaving your site to look elsewhere.

Also, if you’re an ecommerce store with hundreds or even thousands of products, it’s important that navigation is made as simple as possible. As mentioned, Asos employs a clear search function allowing mobile visitors to look for specific products or brands. Therefore you can go straight to the relevant product page, by-passing the categorised sections.

Reduced images, data times and content

Some mobiles won’t be able to cope with downloading excessive amounts of data. The size of images will need to be reduced as a result because page loading times may once again affect usability. Alongside this, reduce the amount of videos and graphics you use and only use them if they are essential. Phones have larger screens these days to accommodate for Internet access, but it’s best to keep it consistent throughout your pages and scale down images to fit on the screen so they are not pixelated.

Another area you can improve your mobile site to make it more user friendly is by reducing the amount of text that is displayed. Unlike your desktop site, you don’t want your users to see as much information, again due to the size of the screen. If people have to scroll through vast amounts of content they will start to lose interest, so do all you can to avoid this happening. Losing customers is one guaranteed way of losing revenue, so ensure your site is of a decent quality.

Create buttons to other profiles

To allow for a steady stream of traffic to other marketing channels, it’s advised to also create icons on your mobile webpage which can link through to your social networks. More importance is being placed on social signals so making the effort to help users find these profiles could serve you well. This will obviously depend on the amount of space that you have available and the kind of business that you run, but if you can fit them in and they don’t affect other on-page elements then use them. If you can make people visit your site and then add you on Facebook or Twitter as a result they will stay engaged with your brand and this is exactly what you want to achieve.

Include the option to go to the main website

Depending on preference, some visitors might want to use the normal website they are familiar with rather than the mobile optimised alternative, so give them the option to revert back to this version. Although this isn’t a major factor for the specific design of your mobile site, it does show that you are giving visitors the option and you are accommodating for their individual preferences.

Create an App

Finally, once you have finished your site, another avenue for you to attract customers is by creating an App. Android and iOS operating systems on Samsung and iPhones, among a host of others, allow for application downloads so this is something you might want to start creating in order to take your company forward to the next stage to coincide with technological advancements.

Apps are a great way for mobile and also tablet users to stay connected and up-to-date with what a brand has to offer and it allows users to connect to the App via their phone menu screen in just a few clicks. This could mean that your customers are a few clicks away from buying your products or getting in touch to find out more information about your services.

Conclusion

Mobile sites need to match the changing habits of your users. People view mobile websites on the go, so you want to do all you can to enable them to find exactly what they want in the quickest time possible. Failing to create a user friendly site that is easy to navigate will only result in a loss of traffic and therefore a loss in revenue, something that all businesses will want to avoid.

There are plenty of factors to take into account when designing a mobile website, some are similar to what you might do on a standard site whilst others are completely different. Of course the design is only the first step; you also have to consider how you are going to market it and ensure you get optimum exposure within mobile search results. If you don’t have a mobile site then start taking the necessary steps to get one in place today so your business can reap the rewards.

Image Source

Modern Smartphone With Application Icons via BigStock

John Waghorn

John Waghorn

John works as a Content Marketing Executive at Koozai. With previous experience in PR, he helps the team by writing a range of client content including press releases, guest blog posts and website copy. He is also a regular contributor to the Koozai blog.

Subscribe To The Koozai Blog