← All guides
Content

Photographs: taking them, sizing them, and the bill your visitor pays

Why a 6 MB photograph is a charge you pass to a stranger on mobile data, how to take usable pictures on a phone, and what size to upload.

5 min read

A photograph straight off a modern phone is somewhere between three and eight megabytes. Put six of them on your homepage and you have built a page that costs roughly thirty megabytes to look at.

Every visitor pays that. On a metered mobile connection they pay it in money, and on a slow one they pay it in a blank screen while they decide whether to wait. Most do not wait.

This is the single most fixable performance problem on small business websites, and it takes about ten minutes to fix for good.

Why the file is so big

Your phone camera is built for printing and cropping, not for web pages. It produces an image several thousand pixels wide, because it does not know what you will do with it.

A photograph on a web page is displayed at maybe 800 to 1,600 pixels wide, even on a large screen. The other several thousand pixels are downloaded in full, then thrown away by the browser before anything is drawn. Your visitor paid for every one of them.

What size to actually use

Used asWidthAim for under
Full-width banner1600–2000 px300 KB
Photograph inside content1000–1200 px150 KB
Card, room, or product tile800 px100 KB
Staff portrait600 px60 KB
LogoIts own size, ideally SVG30 KB

Those are generous limits, not aggressive ones. A well-compressed 1200-pixel photograph at 150 KB is indistinguishable from the 5 MB original on a screen, and it arrives more than thirty times faster.

How to resize without any software

Every phone and computer already does this. You do not need to buy anything.

  • iPhone: share the photo by email or into a messaging app that offers a size choice, and pick “Medium” or “Large” rather than Actual Size.
  • Android: most gallery apps have Edit → Resize, or share at a reduced quality.
  • Windows: right-click → Open with → Photos → Resize.
  • macOS: open in Preview → Tools → Adjust Size, set the width, save.

Do it once, keep the originals somewhere safe, and upload the smaller copies. Many website tools — including this one — also compress on upload, but starting with a sensible file is still faster and gives a better result.

A word on formats

  • JPEG for photographs. Nearly always the right answer.
  • PNG only when you need transparency, such as a logo on a coloured background. A PNG photograph is enormous for no benefit.
  • SVG for logos and simple graphics, if you have one. It is tiny and stays sharp at any size.
  • WebP is smaller again and now supported everywhere. Use it if your tools produce it; do not go out of your way.

Do not upload a HEIC file — the iPhone's default format. Some browsers will not display it. Share or export it as JPEG first.

Taking pictures worth uploading

A well-taken phone photograph beats a badly-taken professional one, and both beat a stock image of somebody else's business.

Light

  • Shoot in daylight. Near a window or outside. Indoor electric light makes everything yellow and grainy.
  • Put the light behind you, falling on the subject — not behind the subject, which turns it into a silhouette.
  • Avoid harsh midday sun for anything outdoors. Early morning and late afternoon are dramatically kinder.
  • Turn the flash off. It flattens everything and makes a room look like evidence.

Framing

  • Get closer than feels right. The most common fault is a subject lost in the middle of a wide, cluttered frame.
  • Tidy first. Two minutes moving a chair, a cable and a cardboard box is the highest-value thing you will do all shoot.
  • Hold it level. A sloping horizon or a leaning building is the fastest way to look amateur. Most phones will show a grid — turn it on.
  • Shoot landscape for banners, portrait for people. A vertical photograph in a wide banner slot gets cropped to somebody's chin.

The pictures you actually need

  1. The outside of your building, from the street, as a stranger approaching would see it. This is the most useful photograph on the entire site and almost nobody takes it. It is how someone knows they have arrived.
  2. The inside, at its best and genuinely tidy.
  3. What you sell, close up, on a plain background.
  4. The people, if they are part of what you offer. Faces, looking at the camera, taken outdoors or by a window.

Be honest with them

A photograph that flatters beyond recognition works exactly once. Someone arrives, finds a smaller and plainer room than the picture, and their disappointment is now attached to your name — and it goes into the review.

Show it accurately, and at its best. Those are compatible. Tidy the room, open the curtains, shoot in good light. Do not shoot the one corner that photographs well and imply the rest.

Describe them

Every image should have alternative text — a short description of what it shows. It is read aloud to people using screen readers, it is displayed when an image fails to load, and search engines use it to understand the page.

Describe the content, plainly: “Dining room with six tables set for breakfast, windows onto the valley.” Not “image1”, and not a list of keywords.

If an image is purely decorative, leave the description empty rather than inventing one — that tells assistive software to skip it, which is the correct behaviour.

Whose picture is it?

Do not take images from search results. They belong to somebody, and using them can cost you an invoice you did not expect.

Use your own photographs — which are better anyway, because they are of your actual business. If you need something you cannot photograph, use a reputable free-licence library and keep a note of where each image came from and under what licence. Future you will want that note.

The ten-minute routine

  1. Pick the photographs you actually need. Fewer, better.
  2. Tidy, then shoot in daylight, level, close.
  3. Export or resize to the widths in the table above.
  4. Check each file is comfortably under its size guide.
  5. Upload, and write one honest sentence of alternative text for each.
  6. Open the page on your phone, on mobile data, and count how long it takes.

That last step is the only one that tells you the truth. Your office wifi will always make the page look fine.