On most websites, the images are the heaviest thing on the page. Not the text, not the code, the photographs. A single large photo, uploaded straight from a phone or a camera, can weigh more than everything else on the page combined. Multiply that across a gallery or a long article, and a page that should feel quick instead feels like it is dragging its feet.
The good news is that getting images right is a solved problem, and most of the solution can be handled by the site itself rather than by the person uploading the picture. The aim we work toward is simple: images that look sharp on every screen, load quickly, and ask almost nothing extra of the editor. Upload one good photo, and let the site do the rest.
Here is what that looks like in practice.
Why images carry so much weight
A modern camera, including the one in a phone, produces enormous images. They are far larger than any website needs, often several times wider than the space they will fill and carrying detail that is invisible on a screen. Placed on a page as they are, they force every visitor to download all of that data before the picture appears, and on a phone connection that wait is real.
The fix is not to ask editors to shrink their photos before uploading. That is fiddly, easy to get wrong, and a poor use of anyone's time. The fix is to let the site take one good original and produce exactly the versions it needs. That is work a computer is very good at and a person should not have to think about.
The right size for every screen
A phone, a laptop, and a large desktop monitor all need a different size of the same image. Sending the desktop-sized version to a phone wastes most of what it downloads, and sending a small version to a large screen looks soft and blurry. The answer is to prepare several sizes of each image and let the browser pick the one that fits the screen in front of it.
This is something we set up once, as part of building the site, and it then applies to every image an editor ever uploads. The editor adds one photo. Behind the scenes, the site generates a set of sizes and hands each visitor the one that suits their device. Nobody has to think about it again.
It matters more than it might seem, because the difference is not subtle. A visitor on a phone, often on a slower connection and paying for data, is exactly the person most likely to give up on a page that stalls. Handing them an image sized for their screen, rather than one built for a large desktop monitor, can be the difference between a page that appears at once and one they never wait around to see.
Modern formats without extra homework
Image formats have improved a great deal, and the newer ones store the same picture at a fraction of the size of the older ones, with no visible loss in quality. Using them is one of the most effective ways to make a site feel faster, and it should not cost the editor a moment of effort.
So we let the site convert images into modern formats automatically, while keeping a widely supported version available for the occasional browser that needs it. The editor uploads a normal photo in a normal format. The site quietly serves a lighter version to everyone whose browser can use it. The result is a faster page and an editor who never had to learn what any of these formats are called.
Loading what people actually look at
Most pages contain images that a visitor may never scroll down to see. Loading all of them the instant the page opens means making people wait for pictures that are still far below the fold. Lazy loading solves this by holding off on an image until the visitor is about to reach it, so the top of the page appears quickly and the rest arrives just in time.
Like the other techniques here, this is something the site handles on its own. The visitor gets a page that feels responsive from the first moment, the images further down load as they become relevant, and the editor, once again, has done nothing but upload a photo.
One upload, many outputs
The thread running through all of this is that the job of the editor stays simple. The temptation, when performance matters, is to push the work onto the people adding content: resize this, convert that, compress before you upload. We think that is backwards. The site is the right place for that work, because it can do it consistently, every time, without anyone remembering to.
So the workflow we aim for is the one that is easiest to get right: choose a good photo, write a short description, and publish. The resizing, the formats, the sizes for each screen, the lazy loading, all of it happens automatically. An editor who is good at choosing and placing images does not also need to become an expert in image compression.
There is a quiet reliability benefit here too. When the work is automatic, it happens the same way every time, on every page, whether the editor is having a careful day or a rushed one. Nothing depends on someone remembering the right export setting under deadline. The site holds the standard, so the standard holds even when people are busy, which over a few years is most of the time.
Alt text, the one thing worth typing
There is one piece of image work that genuinely does belong to a person, and it is a small one: the alt text. This is the short written description of an image that a screen reader speaks aloud to someone who cannot see the picture, and that search engines read to understand what the image shows. It is the single most useful thing an editor can add to an image, and it takes a sentence.
Good alt text describes what the image conveys in plain language, as if you were telling someone over the phone what is in the photo and why it is there. It makes a site usable for people relying on assistive technology, and it helps search engines make sense of your images at the same time. We build the prompt for it right into the editing experience, because it is the rare bit of image work where a human sentence beats anything a machine can generate. Get the photo and the alt text right, and the site takes care of everything else.