Image SEO: file names, alt text and social images

Membergate Support -

For many membership sites, images are not decoration; they are the content. A quilting club shows finished quilts and step-by-step block photos. A cooking membership shows every stage of a recipe. A fitness program shows how each exercise should look. Yet most of those images go up exactly as they came off the camera or phone: named IMG_4471.jpg, with no description, several times larger than they need to be.

That costs you in three ways. Search engines can’t tell what the image shows, so it won’t turn up in image search. Visitors using screen readers get no idea what they are missing. And when someone shares your page, the preview shows whatever picture the app happens to pick. A few small habits fix all three.

Start with a descriptive file name

The file name is the first clue a search engine has about an image. Rename files before you upload them, using a few lowercase words separated by hyphens that describe what the picture shows.

  • Before: IMG_4471.jpg
  • After: log-cabin-quilt-block-blue-white.jpg
  • Before: final-final-v3.png
  • After: half-square-triangle-pressing-seams.png

Do it before publishing. Once an image is live, renaming it changes its address and breaks anywhere it has been linked or embedded.

Write alt text for people first

Alt text (short for alternative text) is a written description attached to an image. Screen readers read it aloud to people who can’t see the image, browsers display it if the image fails to load, and search engines use it to understand what the image shows. It is one of the most useful accessibility habits you can build, and it belongs alongside the other accessibility basics every site owner should know.

Good alt text describes what matters about the image in its context, usually in a sentence or less:

  • Describe, don’t label. “Four half-square triangles arranged into a pinwheel block” beats “quilt block.”
  • Skip “image of” or “photo of.” Screen readers already announce that it is an image.
  • Include your topic naturally, only when it genuinely describes the picture.
  • Leave decorative images blank. Dividers, background textures and purely decorative flourishes should be marked as decorative, usually by leaving the alt text empty, so screen readers skip them.
  • Summarize charts and diagrams in the alt text, and explain the key point in the page text too.
  • Put important words in the text, not only in images. If a graphic contains instructions, repeat them on the page.

Here is the difference in practice for one tutorial photo:

  • Missing: (no alt text)
  • Stuffed: “quilt quilting quilt block free quilt pattern quilting tutorial”
  • Useful: “Pressing the seam of a half-square triangle toward the darker fabric”

Surround images with helpful context

Search engines don’t judge an image by its file name and alt text alone. They also look at the words around it: the caption, the nearby paragraph and the page’s headings. Place images next to the text they illustrate, write captions where they add information, and make sure the page itself is about the same thing the image shows.

Remember that images inside members-only areas can’t be found in search at all. If you want your work to appear in image results, a public gallery or public tutorial page with good text is where it needs to live.

Size images so pages load quickly

A photo straight from a modern phone can be several megabytes, far more than a web page needs. Heavy images slow pages down, especially on phones with patchy connections, and slow pages lose visitors.

  • Resize images to roughly the largest size they will actually be displayed.
  • Compress them; most image editors and many free tools let you reduce file size with no visible difference.
  • Use modern formats such as WebP where your platform supports them.
  • Load images lazily, meaning images further down the page only load when the reader scrolls toward them. Many platforms do this automatically.

Check how images look on a small screen too; a detailed diagram that works on a desktop may be unreadable on a phone. There is more on that in making your membership site work on every phone.

Control how your pages look when shared

When a page is shared in a message or on social media, most apps build a preview card from special tags in the page’s code: a sharing title, a description and an image. If you don’t set the image, the app guesses, and it often picks your logo, a tiny icon or nothing at all.

For every important public page, choose a social image deliberately:

  • Use a landscape image. Around 1200 by 630 pixels is a widely used size that crops well in most previews.
  • Keep key content away from the edges, since different apps crop differently.
  • If you add text, keep it short and large enough to read on a phone.
  • Use a consistent template so your shared links are recognizable.
  • Test by sending the link to yourself in a private message and looking at the preview.

A worked example: one tutorial, start to finish

The quilting club publishes a public tutorial, “How to sew a pinwheel quilt block,” with eight step photos. Here is its image routine:

  1. Rename files in order: pinwheel-block-step-1-cut-squares.jpg, pinwheel-block-step-2-draw-diagonal.jpg and so on.
  2. Resize each from the camera’s original size down to the width the page actually displays, then compress.
  3. Write alt text for each step, such as “Sewing a quarter inch either side of the drawn diagonal line.”
  4. Add short captions where the photo needs explanation, and place each photo beside the step it shows.
  5. Mark the decorative fabric border at the top of the page as decorative.
  6. Create a social image from the finished block photo with the words “Pinwheel Block Tutorial” in the club’s usual style.

The whole routine adds perhaps fifteen minutes to the post and makes every photo work harder.

Your image checklist

  1. Rename files descriptively before uploading.
  2. Write useful alt text for every meaningful image; mark decorative ones as decorative.
  3. Place images near the text they illustrate, with captions where helpful.
  4. Resize and compress before uploading.
  5. Set a social image for every important public page and test the preview.
  6. Fix your ten most-visited public pages first, then add the routine to your pre-publish checklist.

0 Comments

Comments are reviewed before they appear.