Media
Images
Images are defined in HTML with the <img>
tag. This tag is another example of empty tag, which means that it doesn’t have an end tag.
Inside the <img>
tag we have the src
and alt
attributes.
Thus an image tag will look like:
<img src = "html/images/nameofimage.jpg" alt = "Alternative text">
src
defines the url
of the image. Usually we save images in a separate folder to which we give the name images
. Thus a typical expression of the src
will be : src = "html/images/nameofimage.jpg"
alt
stands for alternative text and it is required for the page to validate correctly.
Inside the alt
attribute we put a short description of our image. This text will be displayed if for some reason the image cannot be loaded (slow connection, wrong url) or if the user uses a screen reader.
Another useful attribute that we can add inside the <img>
tag, is the title
. The value of this attribute is shown when we hover over the image as you can see in the example.
<img src = "html/images/nameofimage.jpg" alt = "Alternative text" title = "The title" >
For more information: https://www.w3schools.com/html/html_images.asp