How To Optimize Your Images For Blazing Fast Event Websites

 
header 2.png

[Updated September 2019]

This article will give you some super useful tips on how to make your event website faster.

How?

Well, by showing you some helpful tips on how to optimize your images.

I still don't get it?!

What do images have to do with website speed & loading times, Swoogo?

While there are many things you can do wrong with your event website design, images and visuals are among the worst culprits when it comes to slow page load times.

I know you love your images & visuals, but no one wants to wait 10.3 seconds for any site to

load. Event website speed is crucial.

Let me tell you why.

A one-second delay in page load times yields, according to Moz, 11% fewer page views, as well as a 16% decrease in customer satisfaction and a 7% loss in registrations

Fast event websites matter, and here’s why**

Fast-loading event sites perform better on all fronts: better user experience, higher conversions, more engagement, and higher search rankings.

And site speed matters even more on mobile devices; no one wants to download a 5MB website on their smartphone, right?

But what does that have to do with images?

Easy— images are one of the few site speed factors you can actually control.

While most of the event site speed depends on factors that you can’t influence, you can take action to make your images a little more snack-able for everybody’s bandwidth.

Plus, they’re super easy to optimize.

What image file types should I use to make my event website faster

When considering images for your event website you basically have three options:

  • JPG
  • PNG
  • GIF

Each file format comes with their own advantages and disadvantages, so it’s very important to keep these in mind when using images on your event website.

JPGs for your event site

JPGs (also known as JPEGs) are among the most popular file types for the web.

They are perfect for photographs and complex images containing loads of colors, shadows and gradients. JPGs can be saved in low or high quality or anywhere in between.

Use Case for Event Professionals: JPEGs are the most popular file format and are great for Homepage hero banners & event pictures.

PNGs for your event site

PNGs are also very popular on the web. Although, they can handle transparency, they have a very limited color palette of 265 colors which make the image smaller.

Use Case for Event Professionals: PNGs are usually best for event logo because they are high quality and can handle transparency. And typically, your logo won’t require as many colors as event pictures.

GIFs for your event site

GIFs were popular many years ago. They are still an option for small image sizes where you only need a few colors. They are also restricted to 256 colors so should never be used for pictures.

Use Case for Event Professionals: Gifs can be used for logos, but aren’t as popular as PNGs and should never be used for event pictures.

How to best optimize images for fast event websites

As mentioned above, large images take longer to load. When I say large, I’m referring to the file size rather than the image size (although the latter is equally important).

According to a report from Kissmetrics, 40% of people abandon a website that takes more than 3 seconds to load.

You can see how important it is to keep your images small to ensure a speedy event site.

TIP #1: SAVE THE RIGHT DIMENSIONS

When viewing or editing the image in Photoshop, Gimp, or Sketch, make sure you always view the image at 100%. This allows you to view the image at the exact size it will be displayed on the computer monitor when you save the image for the web.

TIP #2: COMPRESS IMAGES FOR THE WEB

Image compression apps are the easiest way to reduce file sizes of images. The tools typically remove hidden metadata (like geolocation of where the image was taken) and color profiles.

When using compression tools online, you’ll come across a variety of compression levels. So before we jump in, here is everything you need to know about it:

Lossy, Glossy, Lossless - what does that all mean?

Lossy compression is the best option for most. Images processed with Lossy algorithms result in the smallest optimized images you can get which is crucial for fast site speeds.

Glossy compression is the best choice if you still care about sight speed but you believe that a slight decrease in page speed is acceptable for a slightly higher quality image.

Lossless compression are pixel-by-pixel identical with the originals. They offer only a limited size reduction compared to Glossy or Lossy. If you want your images to remain untouched, select this option.

What image compression tools should I use

There are a variety of different (often free) tools & services available online that can perform image compression for you:

ImageOptim

Available for Mac (free) or as web service here

Fast Event Websites - ImageOptim.png

SHORT PIXEL

www.shortpixel.com

Fast Event Websites - Short Pixel.png
Fast Event Websites - Tiny PNG

Kraken.io

www.kraken.io

Fast Event Websites - Kraken.png

ImageOptimizer

www.imageoptimizer.com

Fast Event Websites - Image Optimizer.png

Conclusion

  • Website speed matters. If you can decrease the page load time of your event website, you might be able to increase registrations

  • Pay special attention to large files like images or videos as they can add up in file size and prevent the website from loading fast

  • Work with event website builders like Swoogo that are already optimized for page speed & performance

  • Use the free tools mentionen above to optimize your imagery before uploading them to your event website

Fill out the form below to be updated when we publish more good ish.