Very much a work in progress
your thumbnails are using 1920x1280 size lol, what did you expect?
set the size in the image settings
automatic optimization is based on the viewport size, but you are using thumbnails, so you need to adjust to some size that is reasonably small, not necessaily same size as thumbnails, but around that number
Oh yeah so I definitely didn't optimize that 😮
I'll get to that as soon as I can
Would I need to just set the image size for the thumbnails? Or do I need to create a new thumbnail image at that size and upload it?
like I said above just set the size in image settings
So Webstudio does not create (many) versions of images, based on actual browser size? Image transformation services typically send sizes, based on the container size in the rendered page / the pixel-density of the requesting device. They try to avoid browser scaling altogether.
In such a scenario the image you upload is only used to render variations from. You don't need to set image dimensions.
It knows breakpoints. But if you are on main breakpoint, it's basically the entire viewport
Hmm, I changed the image size on the main breakpoint...but load time doesn't seem to be improving
my dropdown nav let's me scroll pay the last option.
if you read carefully, the width and hight you need to set is in settings panel, not in style panel
styles only effect visual part, not actual width/height that resizer would use
to check for yourself, open dev tools and see what attributes are being used and how big the images are, currently each 400kb+
I'm sorry, I don't see anywhere in the settings panel to adjust size. Unless we are referring to the properties and attributes portion?
you need to select the Image instance
I mean, wow! Just came to this looking for best advice for serving thumbnail images, and again I'm blown away by how smartly the team approaches designing functionalities in Webstudio. Abso-freakin-amazing 🙌
