m.css icon indicating copy to clipboard operation
m.css copied to clipboard

generating smaller copies of images

Open jelmer opened this issue 6 years ago • 1 comments

It would be great if there was a way to automatically generate smaller photos for use in e.g. image grids.

When including high-resolution images, a page with an image grid with a dozen photos can become quite bulky (and slow to load over some connections).

jelmer avatar May 26 '18 16:05 jelmer

Hi, this was on my roadmap from the very beginning -- hooking into Pelican output generation, intercepting copies of static files and generating thumbnails for all images. However, with todays responsive web design, huge range of resolutions, screen sizes and pixel densities, it's hard to define how big a thumbnail should be. This is how I think it could be done:

  • [ ] First introducing a config option, M_IMAGES_MAX_SIZE, for a static non-responsive image downscaling of all images referenced by the .. image::, .. figure:: or ..imagegrid:: directives (so if you have images that are 6000x4000, it would resize the t to a reasonable size defined by this option, let's say 1536x1536 max). This could be extended to include only particular images, have a customizable JPEG compression quality etc.
  • [ ] Second having a config option affecting the thumbnail size, M_IMAGES_THUMBNAIL_SIZE (and maybe a separate one for the grid, because grids tend to be larger), that would (again non-responsively) add thumbnail copies of all images, (for example, sized to 512x512 max)
  • [ ] Third being able to generate a some sort of mipmap, a sequence of images where every is just a quarter of the previous, together with generating a corresponding <img srcset=""> HTML code. That would be the most involved option, but also the one that looks best in all cases. (Disclaimer: I just saw srcset a couple of times, never actually used it, so I hope it works for this purpose.)

I think first and/or second option could be done rather quickly, the third taking a bit of time. Unfortunately I managed to get myself quite a lot of work for the next month, so I can't give you any estimate when this can land. (Contributions welcome, of course ;))

mosra avatar May 29 '18 15:05 mosra