How image compression works
A photograph straight from a phone or camera stores far more detail than a screen can show. Compression removes some of that surplus. Lossless methods reorganise the data so the picture is identical when rebuilt, and save less. Lossy methods discard detail the eye is poor at noticing — subtle shifts in colour and texture — and save a great deal more. Almost every photograph on a website is compressed the lossy way.
Two separate savings often get confused. Resizing changes the dimensions, so an image is stored at roughly the size it will actually be displayed rather than at full camera resolution. Compression then reduces the file further at those dimensions. The file format matters as well: modern formats such as WebP and AVIF produce smaller files than the older JPEG and PNG for the same apparent quality, while diagrams, logos and icons are usually better as SVG, which stays sharp at any size.
Why image compression matters
Images are normally the heaviest thing on a page, so they decide how long a visitor stares at nothing. The largest picture near the top is often the very element the browser is waiting on before the page looks ready, which is exactly what page experience measurements watch.
There is a cost dimension too. Most Nepali traffic arrives on a phone, frequently on mobile data that the visitor pays for by the megabyte and on connections that vary through the day. A gallery of untouched camera files asks that person to buy your images before they have decided whether they want your service. Heavy pages also raise bandwidth on your own hosting, and they punish paid traffic twice, because you pay for the click and then lose people while the page assembles.
Common mistakes with image compression
The most common is uploading originals and letting the site scale them down in the browser. The picture looks right and the full file is still downloaded, so nothing is saved. Setting dimensions in the design is not compression.
The opposite error matters commercially: squeezing product photographs, jewellery, food or interiors until edges smear and colours band. On those pages the image is the sales argument, so quality is worth the extra weight. Two more traps are worth knowing. Screenshots and logos saved as photographs pick up ugly artefacts and are usually smaller as PNG or SVG anyway. And images published without stated width and height leave the browser guessing, so the text jumps as each picture arrives — a separate annoyance from file size, fixed at the same time.
How to act on it
Decide the widest an image ever appears in your layout and export to about that size, allowing for high-density screens. Compress on the way in rather than fixing pages later; most content systems can do this automatically on upload, and doing it once at the source beats auditing a library that grows every week.
Serve modern formats where visitors’ browsers support them, always state dimensions, and check the result on a phone rather than on the desktop where you made it. Then look at the heaviest pages you actually promote, because that is where weight costs money. Compression pairs naturally with lazy loading further down the page, and both belong in a wider page speed programme rather than being treated as the whole job.