Automatically reducing image sizes

Design help General
1

Hey guys

Does anyone know if it’s possible to have images automatically resize depending on where they are being located on the site?

For example, on our blog, we have a 1200px wide banner image at the top of every post. It is this image that is then used as the thumbnail image for other blog post suggestions across the site.
These are only 300 or 400px wide, so it slows the site down massively having to unnecessarily load 1200px images for every thumbnail, where on some pages there are a few dozen.

So is there a way to install some sort of code that automatically downsizes these images?

read only: https://preview.webflow.com/preview/dream-big-travel-far?utm_source=dream-big-travel-far&preview=ae94492a4e1e5739839b451433453663

Here is my site Read-Only: LINK
(how to share your site Read-Only link)

2

Idea for wishlist. Really hard to work on large blogs sites without this features (vs wordprees or other blogging systems) - for me the problem is for blog posts (clients upload huge images). In your case Maybe try lazy loading.

1 Like
3

Yeah it’s true! How would I go about installing lazy loading? :slight_smile:

4

May I present to you, the The Complete Guide to Lazy Loading Images on CSS Tricks :sunglasses:

1 Like