Writing alt text for your website photos
Alt text is a short written description attached to a photo on your website. Screen readers read it out loud to visitors who cannot see the image, browsers show it if the photo fails to load, and Google uses it to understand what the picture shows. Good alt text is plain and specific: one sentence that says what the photo shows and why it is on the page. "Finished cedar privacy fence along a backyard in Plano" is good alt text. "Fence fence Plano fence company best fence" is not.
Who alt text is for
People who use screen readers. Visitors who are blind or have low vision often use software that reads the page aloud. When it reaches a photo, it reads the alt text. Without it, they hear nothing, or a file name like "IMG_4021.jpg". With it, they get the same information everyone else does.
People on slow connections, or whose browser blocks images. They see the alt text in place of the photo.
Google. Google cannot look at a photo the way a person does, and relies partly on the words around it, including alt text, to understand it. That helps your photos appear in image search for what they actually show. It does not guarantee anything, and stuffing alt text with keywords does not help.
Accessibility is also something more small businesses are being asked about. Alt text is one of the simplest parts of it. Website accessibility for small businesses: where to start covers the other basics.
How to write good alt text
Ask yourself: if I were describing this photo to a customer on the phone, what would I say in one sentence?
- Say what is in the photo. "A groomed golden retriever with a short summer cut."
- Add the detail that makes it useful. Where, what kind, what stage. "Kitchen after remodel, with white shaker cabinets and a quartz island."
- Keep it short. One sentence, often under fifteen words. Screen readers read every word.
- Do not start with "Image of" or "Photo of". Screen readers already announce that it is an image.
- Write it the way you speak. Plain words, no lists of keywords.
- Include text that appears in the image. If a photo shows your sign or a price list, the alt text should include what it says.
Examples by trade
- Roofer: "New architectural shingle roof on a two-story colonial home."
- Bakery: "Three-tier wedding cake with white buttercream and fresh roses."
- Auto repair: "Mechanic checking brake pads on a lifted pickup truck."
- Salon: "Shoulder-length balayage in warm caramel tones, seen from behind."
- Landscaper: "Before: overgrown front yard with bare patches in the lawn." Then "After: the same yard with new sod, mulched beds and edged walkway."
- Dentist: "Dr. Patel talking with a patient in a bright treatment room."
- Restaurant: "Plate of shrimp and grits with green onions and a lemon wedge."
Notice how each one would help someone who cannot see the photo understand why it is there.
Photos that need alt text and photos that do not
Need it:
- Photos of your work, products, food, team and place.
- Before-and-after photos. Describe each one, and say which is before and which is after.
- Your logo, if it links to the home page. The alt text should be your business name, such as "Hartley Plumbing home".
- Images with words in them, like a flyer or a menu photo. Better still, put that text on the page as real text and keep the photo as decoration.
- Buttons or icons that are images and do something when tapped. Describe what they do: "Call us", "Our Facebook page".
Do not need it:
- Purely decorative images: background textures, lines, abstract shapes, a blurred stock photo behind a heading.
For decorative images, leave the alt text empty so screen readers skip them. Most website editors have a setting such as "decorative image" or simply let you leave the field blank. Leaving it empty on purpose is different from forgetting it on a photo that matters.
Where to type alt text
Every common website editor has a place for it, though the name varies:
- In many builders, click the image, then look for Alt text, Image description or What's in the image? in the image settings.
- In WordPress, select the image in the editor or in the Media Library and fill in Alternative text.
- In some editors it is under an Accessibility or SEO tab for the image.
If you cannot find it, search your builder's help pages for "alt text". If your editor has no way to add it at all, that is a sign the site was not built with accessibility in mind.
The W3C, the group that writes web standards, has a plain guide with examples on w3.org if you want more detail.
File names help a little too
Before you upload a photo, rename the file from "IMG_4021.jpg" to something descriptive like "cedar-fence-plano.jpg". It is a small extra signal for Google and makes your own photo library easier to manage. Images and Google: file names, sizes and alt text covers this along with photo size.
Common mistakes
- Keyword stuffing. "Plumber plumbing Austin plumber emergency plumber". It reads badly to screen-reader users and does nothing useful.
- The same alt text on every photo. "Our work" twenty times tells nobody anything.
- Leaving file names as alt text. Some editors fill the field with the file name automatically. Check and replace it.
- Describing what you want, not what is there. "Best roofer in town" is not what the photo shows.
- Very long descriptions. A paragraph per photo is tiring to listen to. Save the detail for the text on the page.
- Missing alt text on the logo that links home. Screen-reader users hear only "link" with no idea where it goes.
Checking your site
A quick way to see which photos are missing alt text is to run a free accessibility checker, which lists them for you. Google's free PageSpeed tool at pagespeed.web.dev includes an accessibility section that flags images without it.
What to do this week
- Run your home page through an accessibility checker and note images missing alt text.
- Write one plain sentence for each important photo on your home page and service pages.
- Mark decorative images as decorative, or leave their alt text deliberately empty.
- Add alt text to your logo: your business name.
- From now on, rename photo files and write the alt text as you upload them.
If your current site makes alt text hard to add, or was built with none, you can see your site rebuilt first with descriptions on the photos and an editor that lets you change them.