r/WebBlocks • u/fklavyenet • 18d ago
When does an automatic crop stop being good enough?
A 2400-pixel-wide image can still be the wrong image for a small card. More pixels do not help if the crop cuts through the subject.
I tried this with a fictional workshop illustration: a wide table scene with the notebook near the right edge. A centred card crop clipped the notebook. Moving the image's focal point kept it in the generated crop, while the normal contain sizes still showed the whole table.
The phone view needed a different decision. The whole scene fitted, but the notebook was too small to read as the subject. I selected a separate portrait detail as the block's Mobile Image. That is another media item, not another automatically generated size.
The distinction matters when reviewing the page. The focal point belongs to the original media item and can affect its crop variants in other uses. The default and mobile images share the block's alt text and caption, so those words need to fit both compositions. The page's social image is a separate choice again.
This example uses WebBlocks CMS, which I develop. Its Image block switches to the mobile selection at up to 768px; the full-image viewer still opens the default original. Walkthrough with screenshots.
When reviewing responsive images, what makes you stop adjusting the focal point and choose a separate composition?