alt tags and title tags in HTML

There are two attributes that could be used as descriptive to elements in HTML: alt attribute and title att attribute and title attribute (Doyle, 2008).

alt attribute:

alt attribute is used to describe an element in case the browser didn't show the element such as img, area, input, and applet. Further, alt is not a tag as some might think because a tag is what comes between <  >, while alt comes within the tag (Doyle, 2008).

For example:

alt attribute can be used in the img tag, thus, if the image didn't show for the user the image description will show (W3schools, 2021).

copy-free photo

for instance, if this image was used in a website the following alt attribute can be used:

<img src="img_cookie.jpg" alt="double Chocolate chip cookie" width="500" height="600">

title attribution:

The title attribute adds a description to an element as well, yet it does not work as the alt attribute. The title attribute could provide a better understanding of the element. As title attribute normally appears on the website as a yellow description box when hovering over the photo (Doyle, 2008).

title attribute example (Doyle, 2008)

<img title="A lovely round red apple" .......>

 

The advantages of using alt and title attribute:

Search engines cannot read images themselves. However, the alt and title text in the HTML can be read by the search engines. Thus, it would improve the SEO of the website (Koscova, 2018).

If people find a hard time seeing the image can read the description instead (Koscova, 2018).

reference list:

Doyle, M., 2008. The HTML Alt and Title Attributes. [online] Matt Doyle | Elated Communications. Available at: <https://www.elated.com/html-alt-title-attributes/> [Accessed 18 March 2021].

W3schools.com. 2021. HTML Attributes. [online] Available at: <https://www.w3schools.com/html/html_attributes.asp> [Accessed 18 March 2021].

Koscova, G., 2018. Beginner’s SEO: The difference between ALT text and Title text. [Blog] spotibo, Available at: <https://blog.spotibo.com/difference-between-alt-text-and-title-text/> [Accessed 18 March 2021].