Master AI & Build your First Coding Portfolio with SkillReactor | Sign Up Now

Lesson 3 - Images And Multimedia

3.1 Adding Images

Images play a crucial role in creating visually appealing webpages. In HTML, you can include images using the <img> tag, which offers several attributes for customization.

The src attribute specifies the source URL or local path to the image file. It's like the address where the browser finds the image.

The alt attribute provides alternative text that describes the image content. This is important for accessibility and search engine optimization.

You can use the width and height attributes to control the size of the image on your webpage. They specify the dimensions in pixels, ensuring the image fits well into your layout.

Let's look at an example:

<img src="https://www.hostinger.com/tutorials/wp-content/uploads/sites/2/2018/11/what-is-html-3.jpg" alt="Introduction to HTML" width="300" height="200">

In this example:

  • src points to the image's online location.
  • alt describes the image briefly for those who can't see it.
  • width and height define its size on the webpage.

By using these attributes correctly, you enhance both the accessibility and visual appeal of your webpage.