Mobile devices generate over half of all website traffic, so it’s essential to have an easy to use, mobile-friendly site. Otherwise, visitors are going to quickly move on to other sites that offer a better experience.
Outlined below are some of the key starting points for building a mobile site that people love:
Responsive or adaptive? Decide how to design it
Before you start building a mobile site, there are some important choices to make about the design.
Responsive web design uses an adaptable layout so that your website will appear pretty much the same on a desktop, tablet, or mobile device. What’s displayed will adapt to the user’s device automatically.
An adaptive design has a unique layout for each different type of device so users may have a noticeably different experience on the website if they view it on their computer or on a phone. Adaptive design means you could effectively end up with several different websites to maintain.
Responsive design can be more complicated to implement, but it’s generally preferable because it is easier to maintain and offers a more consistent experience for users.
It ultimately depends on your individual website as to which kind of design will create a better mobile site. Either way, you should take a mobile-first approach to the design. Plan how your site will be used on a mobile phone whether it’s purely informational, or it’s sharing details about your product or service, or it’s an ecommerce site that visitors are going to be making purchases on.
This will help you prioritize the content and functionality that’s available on your mobile site. You may even end up optimizing the content of your desktop site if you find you’re including unnecessary details or pages.
Invest in building your site
If you’re hoping to build a mobile site that people love, then you need to be prepared to spend some money on it. As with most things in life, you get what you pay for — and you need to do your research to ensure that you are getting your money’s worth.
Decide whether you want to build the site yourself; this might be the cheapest option, and there are a number of different website builders that can help you. Popular content management systems such as WordPress, Drupal, or Joomla, will have extensions or plugins that can make your existing website mobile-friendly.
For more advanced functionality or design you might end needing a bespoke website, and then you’ll have to turn to a website designer or an agency.
Best practice for mobile site design
When you’ve decided how you’re going to build your site then these are some of the essential best practice guidelines for ensuring that it’s easy to use:
Increase the font size
Use at least 16px for the standard font size on your site so that users don’t have to zoom in to read the text.
Larger buttons and links
Any call to action buttons or links need to be big enough that someone can easily click them on a mobile device. Also try making them descriptive, so that it’s really clear what they are clicking through to and they don’t end up on the wrong page.
Minimise the navigation bar
An extensive menu for navigating all the different pages of your website might work on a desktop site, but it’ll be hard to use and take up valuable space on a phone screen.
Avoid pop-ups
Wherever possible avoid using popups on your mobile site. They can be annoying but effective on a full website, but on a mobile they often take up the whole screen and they’re hard to close.
Use fewer images and videos
Large images and videos will make a page take longer to load, and they often take up a lot of space. Be really selective about which images are essential to the page.
Streamline the content
Cut down on large amounts of text, and make sure your content is as direct as possible with the most important information at the top. Visitors don’t want to spend too much time scrolling through your site to find the details they’re looking for.
Bigger forms
Increase the size of your forms so they’re easier to complete and take out some of the unnecessary fields.
Test out your ideas
You can do all your research about mobile website design, follow all the best practice advice, and still your mobile site might not be quite up to scratch. The most important thing to do is test out your design ideas and concepts before you invest time in developing them.
Use a prototyping tool to produce an interactive mockup of your mobile site, so that you can test out your ideas and identify usability issues. This is an essential step in building your mobile site, as it gives you a chance to review and adjust your design before you’ve spent a lot of time and money on it.
That’s not to say it’ll be perfect when you’ve finished building your site. You should always make sure that you test your site on a variety of different browsers and devices before you go live with it.
Mobile web design can take a bit of research, planning and testing, but by following these steps you should be able to build a mobile site that’s easy to use and people love.
Related:
