Blog

The Digital Agency for International Development

3 things web editors can do to optimise for the global south

By Jay Alvarez on 11 November 2013

The challenge of every web editor is to publish content as quickly and easily as possible so that it reaches its intended audience

Here's 3 small things you can do to have a BIG impact by helping users in the Global South read your content. It's not about elegant copy or search engine optimisation (although they help a lot) - it's about images and scripts.

Making it easy

If your job is to put updates on your website, you'll know how odious this process can be, and you have a million other things to do. It's bad enough that you have to do all the pre-publishing checks and sign-offs on content and images, copyright issues and formatting quibbles. Every web system has its own quirks and you avoid making requests to technical staff (if you're lucky enough to have some). Due to fear of rebuttal you avoid asking for help or suggesting something that could be changed to make your life easier or the site better for users.

So I'm going to give you a big slice of sympathy pie... I hear you.

Now we're going to spend a little time considering the second part of the initial challenge - the bit about reaching your intended audience. Ask yourself these questions:

  1. How do you know if your intended audience is visiting?
  2. If you knew your intended audience was not visiting would that worry you?
  3. If you thought that YOU could do something to increase visitor numbers, would you?

We're going to focus on 3 small changes you can make to your workflow that will help your web content reach its intended audience wherever they are in the world. This will feel a bit like being asked to not eat chocolate or walk up stairs but if you remember the reason for doing it you might feel inspired to keep going. At least try once a week.

1. Measure it - how are you doing right now?

Keep an eye on your web page size and speed and check your site's Analytics to see if changes you make have an impact on visitor numbers

a) Look at who's visiting your site: Setup Google Analytics
b) Check your homepage size and speed: Check homepage size and speed

a) Web Analytics

Just being aware of how big your website is and knowing how many users might not be able to see your site might motivate you to do things a little bit differently. Having access to google analytic statistics on your site and monitoring how small changes you make increase visitor numbers from the global south will reward your efforts. Many blog platforms and content management systems such as Wordpress come with plugins to show you web analytics in a dashboard - this is a really easy way to keep a check on visitors. Setting up an account with Google Analytics: www.google.com/analytics

b) Performance - size and speed

Weigh your page as you would yourself, if you planned to lose a little weight.

Pingdom website speed test  lets you get a snapshot of your homepage (or any other page) and breaks down areas that are troublesome. You should aim to have your page load within 10 seconds and ideally your site would be less than 100k. Given that the average website page in 2013 is closer to 1500kb this is a tall order but worth a try.

How does your site load in rural Zambia?

At aptivate we exploring ways to make the point about big websites loading slowly in the global south: http://www.aptivate.org/loband-zambia

2. Optimise your images

Scale images and use easy online services to optimise your images before uploading them in both jpg and png

  1. Scale your images to fit your sitewww.picresize.com
  2. Compress your jpg or png images:

Images make up a BIG chunk of websites these days. It's no surprise because they are so easy to make and so easy to share online. But they are like the candy of websites. They add a lot of weight to a page and are addictive - you'll want to put them everywhere. You can save up to 80% of image sizes on your website just by optimising them - and even more if you remove a few or make them smaller.

a) Scale your images

An image that appears small on a page should be cropped to that size. Although web browsers can squeeze a big image into a small space, the result is not only a bit crunchy but the fact is that it is still a big file and your user is downloading the whole thing. Find out how big your image needs to be by right-clicking on a similar image somewhere else on your site and selecting the 'view image info' link on the menu. You will then see the pixel dimension of it.

If your site is responsive and uses clever scaling depending on whether you are on mobile or desktop view, then it's worth making a guess about the maximum width it needs to be and using that as a guide. An image width of 640px should be enough in most cases but a bit of trial and error might be needed.

Use picresize.com free online service to scale your image before compressing it, or your own preferred image editor. 

b) Compress your images

There are two types of images that we work with generally. Photographic images and graphic images. A photo or complex illustration would be best saved as a jpg and compressed up to 75% or 'better' quality. A logo or illustration would work well as a png image. Both types can be optimised to reduce the filesize without loosing much visible quality if any. 80% of image size can be saved by simply optimising it. This takes a few minutes for each image.

  1. Save the image to your computer
  2. Compress images
  3. Upload to your website

3. Reduce your scripts

Insert images of videos or maps instead of copying and pasting the embed code. Avoid standard social share code - encourage your developer to add lighter solutions to sharing

They are invisible and magical. They make things appear and disappear, are easy to install or embed and bring great power to our websites. But what do you actually know about scripts apart from the effect they have? usually not that much - especially how big they can actually be!

Scripts are bits of programming code that take up file space on your server, just like images. The main scripts I find when looking at big websites are for showing images and videos or for sharing content via social networking sites like Facebook, Twitter or Pinterest to name but a few.

Reduce scripts to minimum on most important pages

Homepage, landing pages and other frequently viewed pages can be optimised by removing or reducing to a minimum the scripts on them. If you can - only enable social sharing on individual posts and pages.

Insert images of videos or maps instead of copying and pasting the embed code

Make a small screenshot/save thumbnail image of the video, optimise it and add that instead to your important pages. Once a user has decided if they want to watch it, they can be pointed to a page where you can embed the video or map. If you have a map or video in a sidebar, don't embed the code, as it could add up to 400kb on each page. 

Avoid standard social share code - encourage your developer to add lighter solutions to sharing

They may look like tiny buttons - but a Facebook like button can be more than 150k big. The same goes for other buttons like Twitter or Pinterest. Popular 'share' plugins which enable you to share your content in over 20 places are great, but can also be big. If you can, shop around for a small / lightweight one that combines the key ones you want into a single script under 20k, or use something like Simple social share buttons which don't use any scripts and are super lightweight. There is a Wordpress plugin that uses this approach.