How to prepare images for website uploads
A practical checklist for dimensions, format, transparency and final upload testing.
Reviewed by HSQ Tools ·
Read the upload rules
Find the accepted formats, maximum bytes and required aspect ratio before editing. A square avatar, a wide banner and a product zoom image have different constraints. Do not remove detail needed for one use merely to fit another.
Write down the destination requirements. For a square slot, crop to a square before resizing; forcing a wide photograph into equal width and height distorts it. The crop tool performs that selection in your browser.
Build one final version
Keep an original and work toward the destination dimensions. Resize, then convert if compatibility requires it, then evaluate compression. If an intermediate export is lossy, avoid repeatedly using it as the new original.
Example: a 4000 × 3000 photograph for a 1200 × 900 product slot can retain its 4:3 ratio while reducing dimensions. This dimension example makes no claim about resulting bytes: texture and encoding affect the size.
Test the actual upload
Verify the downloaded extension, dimensions and appearance. Open the file outside the tool and upload it to the real destination. Inspect mobile cropping, background color and any text inside the picture.
HSQ converters and resizing upload files to a server. Crop and background removal run locally in the browser. Check your organization’s rules before uploading confidential imagery, and use Clear results after server processing. Deletion requests and scheduled cleanup can fail, so they are not a guaranteed retention deadline.
Publish and verify a real page
Choose a representative image, confirm the display shape, crop if necessary and resize while preserving the aspect ratio. Export to the format accepted by your CMS and inspect the final upload on a narrow screen and a wider display.
If the image looks stretched, compare its intrinsic ratio with the CSS display box. If it looks blurry, compare intrinsic pixels with the rendered size and device pixel ratio. If it loads slowly, measure transferred bytes and request timing rather than blaming format alone.