Now that the important browsers support loading="lazy" for images, does that now redefine best practices about page length and total number of images?
Is it now OK to make long HTML pages with 20 or more images on one page? If not 20 what about 10?
1 Answers
You can use a color image placeholder. Instead of using a fixed color for the image placeholder, you can find the dominant color from the original image and use that as a placeholder. This technique has been used for quite some time by Google in its image search results and by Pinterest in its grid design.
This might look complex to achieve, but you can accomplish this by scaling down the image down to a 1×1 pixel and then scaling it up to the placeholder's size—a very rough approximation but a simple, no-fuss way to get a single dominant color. Using ImageKit, the dominant color placeholder can be obtained using a chained transform in ImageKit, and then you can use any number of images on your page.
Related