Match the image to the layout

The best image size depends on where the image appears. A full-width hero image needs more pixels than a product thumbnail, and a blog inline image needs different dimensions than a social preview.

Start with the visible placement, not the camera file. Export copies for the page, card, and thumbnail sizes you actually need.

Use practical starting dimensions

A blog hero often works well around 1600 pixels wide. Inline blog images often fit between 900 and 1200 pixels wide. Product gallery images commonly need enough detail for zoom while thumbnails should be much smaller.

These are starting points, not universal rules. The best dimensions depend on the theme, grid, and device mix.

Keep file size in the decision

Dimensions and compression work together. If an image is correctly sized but still heavy, convert the format or reduce quality carefully. If the image is compressed but still huge, resize it first.

Prepare multiple versions for key images

Important images often need more than one export. Create a large version for detail views, a medium version for content, and a small version for cards or thumbnails.