Start with the image’s job
A web export is a copy made for a particular use, not a replacement for your original photograph. Keep a full-resolution master with your completed edits, then create smaller versions for the places the image will appear. A photograph used across the width of a story page needs a different export from a small thumbnail in an index.
Before exporting, find out how the website displays the image. Note the largest space it may occupy, whether the layout changes on smaller screens, and whether the publishing system creates its own resized copies. Cropping matters too: a wide banner and a portrait-oriented story image may need separate crops rather than one file forced into both shapes. Make these decisions before sharpening or compressing the final copy.
Choose pixel dimensions for the display
Pixel dimensions describe the actual width and height of an image file. For web display, they matter more than a resolution label such as pixels per inch. A label of 72 or 300 pixels per inch does not, by itself, change how many pixels the file contains or how large a webpage displays it.
Start with the image’s largest intended display size and allow enough pixels for screens that render images at a higher pixel density. For example, an image displayed at 800 CSS pixels wide may benefit from a file around 1600 pixels wide on a higher-density screen. That is a planning example, not a rule: the best size depends on the site’s layout, its responsive-image setup and the detail the photograph needs to show. Sending an enormous original file for a small display usually adds unnecessary download weight.
If the site supports responsive images, provide or let the publishing system generate several sizes so the browser can choose an appropriate file. Preserve the intended aspect ratio when resizing. Check important edges after any crop, especially when a subject, caption-relevant detail or visual context sits near the frame boundary.
Balance format, compression and visible detail
Photographs are commonly exported as JPEG, WebP or AVIF. JPEG has broad compatibility and is a sensible fallback. WebP and AVIF can often make smaller photographic files at comparable visible quality, though results vary by image and encoder settings. PNG is useful when lossless detail or transparency is required, but it is usually a heavier choice for an ordinary photograph. Check what formats your publishing platform accepts before building a workflow around one of them.
With lossy formats, compression trades some image information for a smaller file. A quality slider is not a universal measurement: the same number can produce different results in different applications. Export a candidate, view it at its actual display size, and inspect areas that tend to reveal damage: fine hair, foliage, text within the scene, smooth skies and subtle gradients. If you see blockiness, smearing or bands of color, try a higher-quality setting or a different format.
Compare file size alongside appearance rather than chasing the smallest number. Apply output sharpening, if needed, after resizing, and keep it restrained. Excess sharpening can make edges look harsh and may become more conspicuous after compression. Reopen the exported file instead of judging only the editing application’s preview.
Make color predictable with sRGB
Many editing workflows use a color space wider than sRGB. For a general-purpose web export, converting the finished image to sRGB is a dependable choice. Conversion translates its colors into the destination space; merely assigning an sRGB profile changes how existing numbers are interpreted and can produce an unintended appearance. If your export dialog offers both options, choose conversion.
Embed the sRGB profile when the workflow allows it. Modern color-managed browsers can use an embedded profile, but photographs may still look different across displays because screens, brightness settings and viewing conditions vary. Inspect the exported file in a browser as well as your editor, and avoid trying to correct a color shift based on a single uncalibrated screen. If vivid colors lose some intensity during conversion, review the result and make any necessary adjustments to the export copy.
Finish with a repeatable pre-publication check
Before uploading, confirm the crop, pixel dimensions, format, file size and color profile. View the image at the size readers will see, then inspect a larger view if the site offers one. Test a narrow-screen layout when possible: an image that works on a desktop may hide an important detail on a phone. Keep the page’s surrounding text and caption accurate; exporting should not quietly change what the photograph appears to show.
Review metadata as part of the same check. Camera files can contain location and other information you may not want to publish. Removing private metadata can be prudent, but do not assume every platform preserves or removes it in the same way. Keep your master and a record of your export settings so you can make a new size or format later. A consistent process makes it easier to deliver images that load efficiently while retaining the detail and color your story needs.
