Why do my images take an age to load?

All images used for web purposes should be optimised for speedy delivery, it’s an amazingly common mistake to upload huge images as they look nice but forget to consider optimisation.

  1. Limit resolution to most common maximum screen sizes. Currently this is 1920px in width. By having a 4000px wide image you are just using extra bandwidth and slowing down your pages.
  2. Export images as optimised jpg files. For pictures (not including interface assets) you’d nearly always use the jpg file format. If you accidentally export it as a gif file (normally used for animation) you’ll end up with a huge file that’s restricted to 256 colours.
  3. Tweak the image until you find the balance between usable file size and the point where the image starts to visibly degrade.
  4. Don’t have access to Photoshop? Don’t worry, there are plenty of websites that can help you optimise your images, https://tinyjpg.com/ for example.
  5. Careful not to be fooled into thinking your site loads at light speed when you’ve only tested it locally on your computer. Even huge images will load near instantly if served from the local machine or from a cache. Use Google insights to check on load speeds: https://developers.google.com/speed/pagespeed/insights/