HTML Image ALT Attribute

• Introduction
• What is image tag
• What is html image alt attribute and how to add it
• Benefits of using an image alt attribute
• Alt vs title attribute
• Conclusion

Introduction

  Hello Guys, In this article I am going to discuss about how to add image in html and what is image alt attribute. Images are very important for a website, so read this article in its entirety to create it. The important image attributes are src, alt, width, height, title. Let us also look at these important properties.

What is image tag

  It is used to add images to web page and it is a unpaid tag. It is an inline tag , it is not a block level tag that also we should remember. You are write general or basic syntax of HTML in any text editor. And you are going to write <IMG> tag in the body section of HTML. If you save and see, you know nothing because we just wrote the tag only.

<img src =”picture.jpg height=” 400px” title=”Image1″>

 You have to tell to the system which image it should display, for that you are going to use an attribute called as SRC. SRC stands for Source. I write SRC attribute in the <img> tag,<IMG SRC=” “>. Between these SRC quotation I should give the image name to be displayed or full path of the image and image name. I have a picture on the desktop, the name of the picture is picture.jpg, so I am going to write “Picture.jpg” in SRC attribute. If you save the file and got to browser you can see that image got displayed in the browser window. You can also specify the width and height for images using the width and height attribute.

  HTML image alt attribute is very important for SEO.  You can use width and height attribute to suit your image. Also we have few more attributes that we can use with the <IMG> tag. IMG tag has an attribute called as title. If you using title attribute when a person moves the mouse cursor over the image you know the title. Next there is one more attribute I discussed, which is called Alt.

What is HTML image alt attribute and how to add it

<img src=”picture.jpg” alt=”IMAGE ERROR”.>

  Alt stands for alternative text. HTML image alt attribute specifies an alternate text for an image, if the image cannot be displayed. Screen readers can be read the alt attribute. So here I am going to mention alt=”IMAGE ERROR”. Alternative text is used when the image is not available in that place. HTML image alt attribute is also helps in (SEO) Search Engine Optimization. You do not have to use it in the case of pictures for decoration. If you changed the path of the image or the name of the image in the src attribute, do not know the picture only then will we know the text of this alt attribute.

  So now what happens we are using in all these tags we are using picture.jpg as the source file. If you created the image incorrectly without using the alt attribute, there is an icon that says no to pictures. If image is not available at that time if you want to display some text in that place the name of the image then, you can display by using the alt attribute and it is very useful.

Benefits of using HTML image alt attribute

1. Internet access begins with the use of an alternative(Alt) text attribute for images
2. An image is cannot loaded or the network is too slow, the alternative text will be displayed on it.
3. HTML image alt attribute provides search engine crawlers with a better image and helping that allows them to index images.
4. Adding alt text to your images. that helps Google better understand your whole webpage.
5. If you use the alt text attribute you are more likely to display your images in the search engine.

Difference between Alt & Title attribute

Conclusion

  These is use of image and alt attribute. It is very useful, if you create a image in HTML. So, I hope this information is helpful to you.