HireWebDeveloper.net

Problem × WooCommerce

WooCommerce product images blurry

good photos going soft on the way to the browser

Why it happens

Source too small for the slot. The theme renders a 800px-wide image area; the uploaded source was 700px. The browser upscales: soft, fuzzy, worse on retina screens which need 2x. The photo was fine; the upload was under-sized.

Aggressive compression somewhere in the chain. An image-optimization plugin recompressing on upload (quality 40), a CDN resizer (some compress hard by default), or theme-generated thumbnails at low quality, each stage piles artifacts on the last.

The wrong size delivered. The full 2000px original being shown scaled-down in a 400px slot (wasted bytes) is the opposite problem, but the fix chain is the same: the store must generate and serve the right size per slot.

Zoom reveals the truth. The gallery thumbnail looks fine and the zoom looks terrible: that is a source-resolution problem, full stop, no setting rescues a 700px source in a zoom that shows 1200px.

Triage

Check one failing product’s actual file: right-click, open image, note its real pixel width vs the slot it renders in. Under-sized? Re-upload from the original at 2x the slot. Right-sized but ugly? The compression stage is guilty: audit the optimization plugin quality setting and the CDN image settings. Standard product sources: 1600-2000px on the long edge, WebP delivery, quality 80+.

When to bring us in

A catalogue with thousands of wrong-sized images needs a pipeline fix, not manual re-uploads: we set the correct sizes end to end (upload spec, generated sizes, CDN delivery), bulk-regenerate, and verify a sample across device classes. Part of a normal WooCommerce maintenance or store performance engagement.