If you’ve got a website that’s only optimized for desktop, it’s time to relaunch it for the mobile-first experience.
Stats show that more and more internet traffic is coming from mobile devices, which means the time to innovate or fail is now.
Relaunching your website for the mobile revolution isn’t an option – it’s a necessity.
If you’re planning to optimize for mobile as soon as possible, here’s what you need to do:
Table of Contents
Prioritize The User Experience
Site visitors are now used to awesome user experiences. They no longer have to put up with glitches and issues that slow them down and frustrate them.
If your website doesn’t provide a top-notch UX, the end user will head elsewhere.
Key to usability on mobile are things like using larger font to ensure users don’t need to pinch-to-zoom.
You should also keep your whole site vertical (horizontal scrolling is a real pain on mobile devices) and avoid fixed-width, large elements.
Make sure users can expand your product images easily, too. The closer they can get to your products, the better. Indeed, many consumers research online and buy offline, which means it’s important they can see what they might be getting.
The mobile screen is small – like, really small. As such, it’s important that you don’t clog it up with unnecessary elements that distract and even frustrate the end user.
To this end, you should remove sidebar elements so that the user can focus on the copy before them. Let them concentrate on the message without sidebar widgets invading their space.
If you must include anything at the side, perhaps include a link to related articles. But no more.
Break Up Your Text
Mobile users are in a hurry. A lot of the time, they check content out while on the move. Perhaps they’re waiting for a train, dashing from one building to another, or having a quick coffee break at work.
What they want from your content is actionable, concise information that gets to the point.
To this end, how you present the content matters a lot. To increase readability so that users don’t immediately bail out, shorten your paragraphs. On desktop, your paragraphs might ordinarily contain 3-4 sentences. On mobile, they should contain 1-2.
Break your text up with visuals, too, and exploit white space. Use lots of subheadings and get to the core of your message as soon as possible. Don’t make people wait. On desktop, your copy probably has a beginning, middle and an end.
On mobile, consider jumping straight into the middle when possible.
Use a Responsive Framework
There’s no point launching mobile-first website if your website isn’t responsive. When your website is responsive, it automatically adjusts according to the device it’s displayed on. This means no wonky elements, no supersized fonts and no need for pinch-and-zoom.
Fortunately, there’s not a lot you have to do to create a responsive website. You can use a responsive framework such as Bootstrap that does most of the work for you. It will automatically adjust your website according to the device and thus improve the user experience.
Optimize Your Logo
All brands need a logo because it’s a logo that makes the brand recognizable to customers. It helps to create trust and a sense of familiarity.
When it comes to the mobile-first experience, it’s also important that your logo is positioned correctly and acts as a link that takes the end user back to your homepage.
Typically, logo’s are displayed in the top-left on mobile devices. And because users expect to be able to tap a brand’s logo to make their way back to the homepage, you need to turn your logo into a clickable link.
It’s all about subscribing to conventions and creating the user experience that mobile users expect.
If you don’t yet have a logo, you can create a professional-looking one in just a matter of minutes with a free logo maker.
Improve Your Site Speed
Site speed is incredibly important. Mobile sites have traditionally fallen behind desktop sites when it comes to engagement metrics, and it’s largely because of things like slow loading time. If your website takes too long to load, mobile users (who are generally looking for fast, actionable information) will exit.
So, optimize your site speed by:
- Using an image compressor tool to keep image size down
- Go with a hosting provider that boosts server response speeds
- Reduce the size of your logo (see above)
- Implement caching
- Avoid Flash
- Test your site’s performance
Rethink Your Popups
Popups can help to boost conversions – but only if done right. Because mobile users are generally more impatient than desktop users, it’s important that you don’t annoy them with your popups.
Screen space is key on mobile devices, so you need to make your popups as small and non-intrusive as possible. You also need to make sure they’re easy to dismiss and that they contain relevant information only. For example, the popup must be relevant to the page the user is on. If it isn’t, it’s going to cause huge frustration.
The transition from desktop to mobile might not be seamless, and you might find that conversions aren’t what you expected at first. Moreover, you might find that your desktop website outperforms your mobile website.
This is why it’s really important that you perform A/B tests to figure out what’s working and what isn’t on the mobile version of your website.
Here are some things you can test:
- Headlines – Headlines on mobile devices need to be shorter but still compelling. Write new headlines for your existing content and perform tests to see if they still perform as well as they do on the desktop.
- Call to Action – Experiment with buttons and image-based CTAs to see what works best on mobile. Experiment with the positioning too, and whether using a ‘sticky’ CTA that follows the user as they scroll up and down works.
- Images – You don’t want to overwhelm the end user with images in your copy, but you also need to use them to break up the text. A/B test your images to generate as much user engagement as possible.
For many, their mobile device is now their computer. They research online, buy online – they do almost everything online.
And now that Google has launched the mobile-first index, it’s important that you relaunch your website with mobile users at the forefront of everything you do.
Take the tips in this article, implement them and keep measuring and tweaking.