Media

  • Images
  • Audio
  • Video

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