Mobile internet usage rose by over 160% worldwide between 2010 and 2012 and it’s estimated that over the next 3 years mobile internet usage could overtake desktop internet usage.
So, what does this mean for your charity website?
Well – if your website isn’t mobile friendly, you could be missing out on a huge chunk of website visitors including your supporters, volunteers and donators.
Up to 50% of your visitors (and even more in the future) will be trying to access your website using a smartphone, tablet or other mobile device. If your website doesn’t display properly, those visitors are likely to just move on.
How do I know if my charity website is mobile friendly (also known as ‘responsive’)?
The easiest way to check your website’s mobile friendly-ness is to simply view it on a mobile device and see how it looks. Preferably, check it on as many different types of device as you can because screen sizes and software vary widely.
If you don’t have any devices to hand, a good substitute to check your charity website is to just zoom in (on your keyboard press Ctrl and + multiple times to enlarge a web page). This simulates the view that users will get when they visit your website on a small screen. (Try it now with this website and you’ll see what we mean!)
When testing your charity website on a mobile device, ask yourself these questions:
- Is the text easily readable?
- Are parts of the page hidden off the sides of the screen?
- Are the navigation menu’s viewable and easy to use?
- Would the site be useable on devices with a small screen?
In many cases the answers to these questions will be no!
If your charity website is built using a free website provider such as webs.com…
Some of the free website providers such as webs.com have updated their website builder software to make it easy to view your website on a mobile device, so if you’re using one of those providers you may be in luck.
How do I make my charity website mobile friendly?
There are a number of ways you can make your website work on a mobile device. You can…
- Create a separate version of your website and set it to automatically load when a mobile device views your site
- Add to your existing website so that different files for the design and layout are loaded when a mobile device views your site
- Edit your existing website so that the same files display on a mobile but display differently depending on the size of the browser window (*this is probably your easiest option)
Usually you will need to get someone with some web design know-how to make your charity website mobile ready. Contact your original designer/developer or hire someone who can help you fix up your website. The cost shouldn’t be too high to convert an existing design. (If you need help feel free to leave us a comment below and we’ll advise as best we can)
Or if you’ve used a web-based website maker (such as webs.com) check the support pages on their website to find out what they’re doing to make your site mobile friendly.
Tip: If you know a little about CSS (cascading style sheets) design, a good place to start is to try making all your ‘width: ***px’ in to ‘max-width: ***px’, that way all the content containers such as the ‘div’s etc. will expand to a maximum width but will also contract when viewed on smaller devices.
For WordPress, Joomla and Drupal users:
Popular software like WordPress, Joomla and Drupal have easy options for making their charity websites ‘mobile ready’ using plugins or extensions:
Also, WordPress’ current default theme ‘Twenty Eleven’ is responsive and mobile friendly, and there’s lots of free responsive themes available to download or install direct from their theme directory:
The moral of this story is that whatever you’re using to create and host your website – being mobile friendly is becoming increasingly important, so don’t let your charity or non-profit organisation lag behind when it comes to your mobile visitors!
Need help working it all out?
Leave us a comment below or get in touch and we’ll do our best to advise you on how you can update your charity website to be mobile friendly and responsive.
Further reading about responsive website design:
– ‘What The Heck Is Responsive Web Design?‘ – Blog post at http://johnpolacek.github.com/scrolldeck.js/decks/responsive/
– About Responsive Web Design at Wikipedia – http://en.wikipedia.org/wiki/Responsive_web_design