Hacks to make your website mobile friendly

British audiences are turning to the small screen for entertainment. The mobile phone, omnipresent in our pockets, is getting a lot of airtime. This device racks up nearly 50% of the UK’s online traffic.

The statistics support revamping charity websites to accommodate mobile access. Our top tips to enhance mobile browsing are as follows.

Differentiate between mobile and desktop sites

Overall, a strategic tactic is to separate out the mobile versus desktop site. Mobile sites can have simpler features, less complex design and content. This is your ‘minimalist’ site.

The desktop site is the opposite. Use it to allow audiences to explore everything you have to offer. Here, you can use rich content and video in addition to the basics.

Make your website mobile responsive

One of the biggest pet peeves for mobile users is sizing. Sites never seem to shrink down to the proportion of the mobile screen. Developers call this automatic sizing feature ‘responsive web design’. Smashing Magazine puts it simply.

The approach is: “design and development should respond to the user’s behaviour and environment based on screen size, platform and orientation.” From this perspective, sites should automatically reformat to the device that’s being used.

Disable pop-ups

Annoying pop-ups that obstruct what you’re trying to look at are the worst offenders. From blocking text to difficulty closing, pop-ups make it challenging for most devices to navigate websites. Disable them to make your site mobile friendly in a flash.

Test on actual devices

Easy and coming in at no cost, test, and test again. To make sure that your site changes are actually mobile friendly, access it from a range of gadgets. Our top tip here is to check out the site from different screen sizes to make sure all the details are right.

The faster the better

When you’ve only got a few minutes, there’s nothing worse than waiting for a website to load. Hobo, an SEO consultancy, says that the average site takes between one to two seconds to come up. Any longer than three seconds and 53% of users will abandon their mission.

To retain your audiences, test how fast your site runs on mobile devices. There are tools that help analyse speed. Think with Google is the top runner here. Charities input their URLs and get useful feedback for mobile optimisation.

Design without clutter

Images, lots of text, complicated designs, and small fonts make websites hard to read on mobile. These design aspects slow the load speed. Stick with simple layouts and uncomplicated backgrounds.

Lots of images or those that are too large make it difficult for small screen users. Resize them specifically for mobile. Use 640x320 resolution for smaller screens.

It’s also helpful to space out your links. Links often become too close together to be distinguishable on mobile phones. To help your audiences navigate, make sure all the links are spaced appropriately apart. Remember, there’s no fine point mouse on a smart phone.

And broadly reduce the number of clicks users have to make. On mobile, less is more. When you’re accepting donations ask your supporters only for what you need to process the payment. For mobile phone users, the fidgety inputs can make a person lose patience so make sure you skip to the giving part as quickly as possible.

Use content sparingly but wisely

Campaign Monitor offers one of the best tips. They say that to get your point across, use keywords, associated keywords and tags within your site. That ensures that the site comes to the top of the search. Readers will also find the text relevant, since there are mentions of all the topics of interest.

Use large buttons

When shrunken down into the pocket, buttons tend to disappear. Create large buttons for navigation and menu options. Bear in mind that most devices are touch screens, so each button needs to be big enough to ‘fit’ a finger and not hit any other buttons close by.

Turn-off auto-correct on forms

When collecting information make sure that the auto-fill is turned off. There’s nothing more annoying that typing in an address, and having it autocorrected to something else. Hostgator offers advice on how to change charity form settings. In the HTML script simply type in “autocorrect=off”.