Lazy Load images in EverWeb
Responsive WebsiteSoftwareTutorialsWeb Design

It’s Not Lazy to Lazy Load Your Images with EverWeb 4.1!

One of the headline additions to EverWeb 4.1 is the introduction of Lazy Loading images. Basically, what Lazy Loading does is help optimize your page loading times by optimizing the loading of the content of the page, especially its image content, or other page elements, that may take time to load. The idea behind lazy loading is that the page will only load necessary content when it’s needed. So, for example, if you have lots of images on your page, they will not all be loaded when you load the page. Instead, only the images that you see in your browser window will be loaded. Any images further down the page, that are not currently visible, will not be loaded at this time. It’s only when you scroll down the page, that these unseen images will now be needed and so will be loaded ‘on the fly’. This technique, therefore, speeds page loading times and as a consequence, the benefits the user experience.

Lazy loadingIn EverWeb
Setting images to Lazy Loading in EverWeb is easy. First make sure you’re using EverWeb 4.1 or higher. If you’re on a lower version of EverWeb, just use the EverWeb-> Check for Updates… menu option on macOS, or the Help-> Check for Updates.. menu option in Windows to update.

After checking that you’re on EverWeb 4.1 or higher, select the image on the page that you want to Lazy Load. Next, go to the Shape Options tab in the Inspector Window. Check the ‘Lazy Laoding’ checkbox and you’re done! Easy!

Why Use Lazy Loading?
Lazy Loading the images on your pages has the following advantages…

  1. Makes Initial Page Loading Quicker: As only essential page content is initially loaded by lazy loading, the time for the page to load is shorter.
  2. Better Overall Website Performance: The benefit for your website of Lazy Loading here is that data transfer to and. from your website’s server is reduced which also reduces the server’s workload.
  3. Reduced Bandwidth Needs: As Lazy Loading only loads page content when it’s needed this saves on bandwidth. Only content that the visitor interacts with is loaded.
  4. Makes For a Better User Experience: Users get a better experience as the page initially loads faster, so there’s no waiting, then as the user scrolls the page its resources get as needed which provides a better user experience.

When To Use Lazy Loading
Lazy Loading greatly benefits pages that have a large amount of image content, such as photography websites, or on pages that contain embedded video content. Some pages in your site will see negligible benefit e.g. pages such as Contact pages, or blog pages that are text intensive, so remember to only apply Lazy Loading to pages that will see benefit. This will also save you time and effort as well!

Lazy Loading and WebP Format Support
In addition to Lazy Loading, EverWeb 4.1 also introduced support for WebP format. This format will help cut down image loading times, so we recommend using both features in your site!

If you have any questions about this post, please let us know in the Comments section below!

You may also like

Comments

Leave a reply

Your email address will not be published. Required fields are marked *