Best Practice for Images

Image download speed is very important indeed. Doubly so when your visitor is out and about, or using their own mobile or tablet to access your course. It is therefore a really good idea to spend some time optimising your images to make them fast to download.

An image should help you to tell your story

A good image should help you to explain your point, and keep your learner more interested and engaged. Don’t just choose an image because you feel you should – use it to illustrate your point – thinking about your images a little makes an enormous difference to your learners’ success.

Make your image the right size

Ideally, you should crop your image to the right size for the page you are uploading it to. Most image areas in Elucidat have images sizes displayed, in pixels. For instance, 500 x 600 px means that you should make your image 500 pixels wide, by 600 pixels high. To do this, you should use some image editing software. There are some very good options for this, either cheap or free. You can also use online software if you are unable to install something on your computer.

Photoshop Elements (or Photoshop)
The grandaddy of photo editing – brilliant, but expensive, so go for the ‘Elements’ version, as it does everything you need.

The online photo editing market is changing quite rapidly, but our favourite at the moment is:

Aviary
Think Photoshop – free, and online. Lots of good features, and with phone versions too.

Optimise your images

Whichever image editor you use, you should still optimise your images. In Photoshop, use ‘Save for Web’ instead of ‘Save’ to create a smaller version of your image.

Even if you can’t use photoshop there are plenty of free programs out there that help you to make your images smaller. Our favourite is ImageOptim.

Take advantage of Elucidat’s responsive features to have different images for different screen sizes

Elucidat has amazing responsive features that allow you to customise the layout for different screen sizes. That includes images, so if mobile performance is paramount, why not upload smaller versions of your images for mobiles?

As a guideline, if you uploaded a background image for your site, screen widths for different devices would be:

  • Desktop: 1200px wide
  • Landscape Tablet: 768px wide
  • Portrait tablet: 480 – 550px wide
  • Mobile: 320px wide

So a screen background for mobile could be 16x smaller than a desktop, and load 16x faster as a result.

Make sure you own the copyright

This should go without saying, but make sure you own the rights to use the image online. That means no copying random images from Google image searches – you should have bought the image from a reputable source, or taken it yourself. Our clearly state that you are responsible for any content you upload to Elucidat.

comments powered by Disqus

Start delivering more successful elearning, at scale.

people in 219 countries are already benefiting from learning created with Elucidat.

Sign Up Free Contact Us