Alt Text: Effect and Importance of Alt Tag

1
(No Transcript)
2
What is alt text?
This text is a little snippet of detailed
information about what an image shows, and it is
also called an alt attribute, an alt description,
or an alt tag. It was developed to assist the
blind and visually impaired with understanding
what an image represents when they receive the
text excerpt from a screen reader, thus enhancing
their web browsing experience. Beyond that, alt
text is very important for enabling search
engines to accurately recognize and appreciate
your websites images when they analyze your
content in response to a search.
3
Lets see some statistics on ALT text

• The Google search engine results page shows
  images in 38 of cases.
• If more than four images appear in your content,
  then youll only receive a green bullet if more
  than 30 of the images use the keyphrase in the
  alt text.
• In order to prevent you from keyword stuffing,
  you will see an orange bullet when the keyphrase
  appears in over 70 of your images.
• Besides describing the content of an image, alt
  text also explains the context of the image.
• Alt text is often confused for alt tag. Alt text
  is part of the HTML code. Alt text is the
  description of the image, in the HTML code, which
  is mentioned in the Alt tag.
• Alternative text refers to text that is not
  visible when images are not loaded properly, and
  you have probably encountered it before. This is
  a written copy that replaces images that cannot
  be displayed.

4
Image Alt Text Best Practices

• It is imperative that the alt text for images be
  specific and also reflect the subject matter of
  the website it supports. Does that make sense?
  The following are some vital tips for optimizing
  image alt text
• Be specific when describing the image. Make sure
  to consider both the subject and context of the
  image.
• The context should be related to the topic of the
  page. Add contextual information based on the
  content of the page if the image doesnt show an
  identifiable place or person. For example, alt
  text for a picture of a woman eating out could be
  Woman eating alone in a restaurant or Woman
  enjoys food, depending on the topic of the
  webpage.
• Do not exceed 125 characters in your alt text.
  Normally, screen-reading software stops reading
  alt text here, which leaves the visually impaired
  frustrated while trying to explain long-winded
  alt text.
• Rather than starting your alt text with
  picture or image, start your description
  right away. The HTML source code will identify
  the image as an image for screen-reading tools
  (and Google, for that matter).

5

• Dont overuse your keywords. If the target
  keyword of your article can be easily included in
  the alt text, do so. Instead, you may want to
  construct a longtail keyword that just contains
  terms that matter most.
• Keep your alt text short dont stuff it with
  keywords for every single image. Include your
  keyword in at least one of the images in your
  blog post if it contains a series of body images.
  Select the image that best represents your topic,
  and assign your keyword to it. Make sure your
  media surrounds your image with aesthetic
  descriptions.
• Make sure there are no spelling errors. If you
  misspell words in your image alt text, users
  might have a bad experience or search engines may
  get confused. Make sure that alt text matches the
  content on your website.
• Every image does not need an alt text. For SEO,
  user experience, and accessibility, alt text
  should be included in most images on a page. It
  is best to leave the alt attribute empty for
  images that are simply decorative or that are
  described in surrounding text.
• Form buttons shouldnt be overlooked. Provide an
  alt attribute to an image that appears as the
  submit button on your website. It is a good
  idea to provide alt attributes for image buttons
  describing what the buttons will do, such as
  search, apply now, sign up, etc.

6
The Effects of Alt Text on SEO
Using computer vision algorithms, alt text is
combined with contents of a page and computer
vision algorithms to decode the subject matter of
images, according to Google. By adding alt text
to the images, Google can work out what the whole
page is about, not just the images themselves.
Adding alt text to your images will increase
their chances of appearing in image
searches. Take into consideration how your
audience might like to find answers to questions
about a topic when creating content on that
topic. Many Google searches want the image
itself, embedded within your webpage, instead of
the classic blue, hyperlinked search
result. Those visiting a page to find out how to
remove duplicate entries in Excel might prefer a
screenshot so they can understand how to do it
instantly.
7
Why is image alt text important?
The importance of image alt text has already been
mentioned in terms of accessibility, user
experience, and traffic to images. You can write
an image alt text that is as descriptive and
impactful as possible, by understanding these
reasons. We will examine the most important
reasons behind the images alt text below.
Accessibility
Web Content Accessibility Guidelines 1.0 were
published by W3C in 1999 in an attempt to explain
how better accessibility for users with
disabilities could be achieved. Provide
alternative auditory and visual content, such as
videos, sounds, applets, or other equivalent
information. This meant that any website
including images (or movies, sounds, applets,
etc.) should include the equivalent material.
UI/UX
Alt text is present to provide users a better
experience especially for users with
disabilities. Considering this, it provides a
better user experience to all users.
8
Visual Traffic
Images can be turned into hyperlinked search
results in both Google Images and as individual
images via the alt text in the image. Image
packs are search results that are special. They
are displayed in a horizontal row with links in
any organic search results. Visitors can also
find you organically via images in Google Images
and in image packs. A lot more visitors could be
generated in this way at least in HubSpots
case. HubSpot Blog began focusing on
optimization of image alt text aggressively in
2018 due to a new SEO strategy implemented. The
blogs traffic increased from 160,000 organic
views to 779 in less than a year as a result of
this strategy.
Adding Image Alt Text to Your Website
The big question is, how do you begin to create
alt text when writing blog posts and webpages? If
you are unsure where alt text could be used for
previously untagged pictures, consider performing
a basic audit on your existing content.
9
Alt Text FAQ
We hear the following questions a lot when
working with alt tags/text
Where Can I Find an Alt Tag on a Page?
Is it Possible to Read Alt Text from HTML Code?
Select Inspect from the menu when you
right-click anywhere on the page. On the right
side of the screen, you can view the code of the
page. Click on the first icon on the left of the
HTML code panel, then find the image on the page
whose alt tag you wish to see and click on that
too. This will highlight all the attributes of
the image along with the HTML code for that
element.
In the panel displaying the pages source code,
you must find the appropriate HTML tag once you
click on Inspect. An alt text tag precedes the
alt text description with alt.
How Do I Know if an Image Has Alt Text?
The alt text of an image is empty if only two
quotation marks follow alt in the source code,
i.e., if no text appears between the quotation
marks in the alt tag.
10
When putting alt text, can you use periods and
commas?
The answer is yes, and you should. A better user
experience can be delivered by screen readers
when alt text includes proper punctuation. When
an image does not load correctly, alt text is
displayed. User experience can be improved by
using high-quality alt text.
Is there a proper length for Alt Tags?
Screen readers generally accept alt text up to
125 characters in length.
Image Alt Text and Its Importance
You should keep alt tags in mind as you optimize
your images for search engine optimization and
user accessibility. The alt text you write helps
users and search engines understand the images
you have on your site. If you follow the steps
above, youll have no problems creating
user-friendly and search engine-friendly pages.
11
(No Transcript)