Mobile ResponsivenessLast week or a few weeks back we posted a web design post that talked about the number 1 mistake we believe 90% of web designers make. This is essentially listening to clients too much. Also it mentioned that SEO is not integrated into the site from the very start. This makes coming in later so much more difficult. Of course if you have SEO experience you will know this, but the majority of designers actually just start with the design and hence have issues with marketing the site later on.

In this post we are going to talk about another common mistake. Luckily less so nowadays, but one that still deserves its own post. This is building sites for desktops…. And only looking at mobile halfway through the process or even just sticking a responsive theme on that and calling it a day.

Mobile is now the primary search tool for the majority of users.

That’s big news if you didn’t know.

Generally for business related results I think the figure is actually still tipped to desktop but mobile should be looked at first for a number of reasons.

Websites are designed to work on desktops, themes are generally built for desktop and laptop use, text, platforms, images are all pre-optimised to work on a larger screen, and although you might think this is a good thing, I can tell you it is not. It does make designing a website for desktops very easy but it also has a ton of problems when it comes to designing a site for mobile. Most of which can be resolved simply if you just start with mobile design.

Let’s think of a business that get’s exactly half its traffic from desktops and half from mobile or tablet devices. Instantly you think you should put about 50% of your time into designing the mobile site and 50% into the design of the desktop site. But this is not the case the exact reason we mentioned above.

Platforms and plugins are designed to work on desktop meaning it will take you about a tenth of the time to configure a plugin or build a webpage for a desktop, because everything is already there for you do to this. As a result, you want to spend more time thinking about, strategizing and designing the mobile version of the site.

There are very easy ways you can check the current mobile design of your site, I personally just use tools like this one and also a Google chrome plugin that you can install and check the site as you go along. This makes designing a mobile responsive website less painful. So that’s why you SHOULD do it, now let’s take a look at some of the elements you should include. These are the very basic conversion rate optimisation rules that you should implement whether you are a business owner designing your own site, or you are a developer that needs to implement a mobile friendly site for a client. This is the checklist we use during each build on our sites.

CRO Checklist for Mobile Web Design

  1. Mobile site load time – This is relatively straight forward – As you probably already know site’s load a different version on mobile and as a result you should be testing how fast this version loads on mobile and tablet devices. If it is too slow then you need to implement some site speed optimisation or get in touch with us if you have no idea what that is.
  2. Above the fold – The ATF section on mobile is even more important than the ATF on desktops, mainly because if it is too cluttered or doesn’t tell people what you do in 5 seconds people are more likely to bounce back to the search results as they want to find instant answers and have even less patience on mobile devices.
  3. Images – These load even slower on mobiles than laptops and computers, as a result if you have a website that is very image heavy then ensure all of these images are not too big and correctly configured for mobile devices, so they load the correct version and also implement the correct image optimisation. Don’t over optimise, ensure all your images have the correct alt tags in, and make sure they aren’t massive and take days to load!
  4. Clickable number – This is such a tiny CRO elemtent but one that is so important for mobile devices. This let’s people click to call your business when they are on a phone. It also works on desktop but during our testing there aren’t as many direct click to callers from desktop devices (Which makes sense)
  5. Keep it simple & short – People do not want to read 2000 words of text of have to scroll down a massive sales page. This is one of the elements where you really need to decide how your target audience is searching, if it is from desktops then you can have a slightly longer page, if it is from mobile have more emphasis on clicking to call, emailing or just filling out a very SHORT contact form.
  6. Be careful of video – Videos eat data and if you have a 5 minute explainer video on your website, prospects may not want to use all their precious data on watching your video! As a result, make sure you don’t have too much video content on the site, especially on the homepage of the website.
  7. Short contact forms – This is a big one. People can generally type about 10 times faster than they can text. If you have a huge contact form on your homepage or contact page, people will be turned off on filling it out on their mobile devices and might try to remember to do it on desktop. That’s not a risk I’d be willing to take.

And that’s pretty much it.