Prepare an image for a web page
Page images are the single biggest cause of slow loading. The goal is the smallest file that still looks sharp at the size it is displayed.
- 1Image cropperCrop to the ratio the layout uses, so nothing is cut off by CSS later.
- 2Image resizerResize to roughly twice the CSS display width for high-density screens.
- 3Image converterConvert to WebP at quality 78–82.
Result: A full-width hero typically lands between 120 KB and 300 KB instead of several megabytes.