WikiHow to set Image Alt Text

How to set Image Alt Text

May 17, 2023

Images are powerful tools for grabbing attention and enhancing your website content. But what if someone can’t see them? This is where alt text (alternative text) comes in. Alt text optimization can boost your SEO (Search Engine Optimization) and let Google know what your image is about. 

Let’s explore what alt text is and how to add it to your images, making your website more accessible and search-engine friendly.

What is Alt Text?

Alt text, also known as alt tags and alt descriptions, is the text that shows up on a webpage in place of an image if the user’s screen cannot load the picture. This content makes your website easier for search engines to crawl and rank, and it helps screen-reading software in providing visually challenged users with descriptions of photos.

Here’s why alt text is essential for your website:

  • Accessibility Champion: Alt text ensures everyone can understand the content of your images, promoting image optimization, website accessibility, and inclusivity.
  • SEO Booster: Search engines consider alt text when ranking websites. Descriptive alt text helps search engines understand your images and their relevance to your content, potentially improving your search ranking.
  • Engagement Enhancer: Clear and concise alt text can pique visitor interest and encourage them to explore your images further.

A Step-by-Step Guide to Adding Alt Text

Now that you know the benefits of alt text optimization, let’s learn how to add it to your images. The specific steps might vary slightly depending on the platform you use to build your website. 

Here’s a general guide for Content Management Systems (CMS):

  1. Uploading Your Image: Start by uploading the image you want to add alt text to your website. This typically involves navigating to the page where you want to add the image and using an “Upload Image” or “Insert Image” function.
  2. Finding the Alt Text Option: After image optimization and uploading it, most platforms will display a menu or options bar related to the image. Look for an option labeled “Alt Text,” “Alternative Text,” or something similar.
  3. Writing Your Alt Text: Here comes the magic! Craft a clear and concise description of your image using the alt text field. 

Here’s a general guide for HTML:

In HTML, you can set the alt text attribute for an image using the alt attribute within the IMG tag. For example:

<img src=”image.jpg” alt=”Descriptive alt text here”>

Replace “Descriptive alt text here” with a clear and concise description. Ideally, the alt text should convey the image’s purpose or the information it conveys.

Tips for writing effective alt text

  1. Be Descriptive: Describe the main subject of the image in a few words.  For example, instead of “image1.jpg,” use “Smiling woman holding a bouquet of red roses.”
  2. Consider Context: After resizing images for mobile view, think about the context in which the image appears on your website.  For example, if the image is part of a blog post about healthy recipes, you could use “A bowl of fresh green salad with sliced tomatoes and cucumbers.” 
  3. Target Keywords: While not essential for every image, you can strategically include relevant keywords related to your content in the alt text.  However, avoid keyword stuffing (unnatural use of keywords), as it can negatively impact SEO.
  4. Keep it Concise: Aim for alt text between 125-250 characters. Search engines tend to give more weight to shorter alt-text descriptions.
  5. Save and Publish: Once you’ve written your alt text, save the changes to your image and publish your web page to make the live on your website.

Bonus Tips

  • Unique Descriptions: Give each image a unique description. Avoid using generic descriptions like “picture” or “image” for multiple images for the best alt-text optimization.
  • Accuracy Matters: Ensure your alt text accurately reflects the content of the image. Don’t mislead visitors or search engines.
  • Maintain a Natural Voice: Write your naturally and descriptively, avoiding robotic-sounding language.
  • Image with Text: If your image includes text, consider incorporating that text into your description as well.
  • Decorative Images: For purely decorative images that don’t add significant content, you can leave the blank or use an empty alt text tag (“”). However, use this sparingly to avoid confusing screen readers.

By incorporating alt text into your website’s images, you’re creating a more accessible and SEO-friendly online experience. It’s a win-win situation for everyone – visually impaired visitors can understand your content, search engines can better index your website, and your website’s overall user experience is enhanced.

Remember, alt text is a small yet mighty tool that can make a big difference. So, the next time you upload an image, don’t forget to add descriptive alt text!


Virtual Assistant Service

Get in touch

    Virtual Assistant Service
    WhatsApp Image