Your First Webpage - HTML for Absolute Beginners

Last updated February 11, 2022 by Jacob Paris

Add an <img> tag to your <body> just after the heading

htmlpage.html
<body>
<h1>Cheeto</h1>
<img
src="https://placekitten.com/200/200"
alt="cat"
width="200"
height="200"
/>
</body>

PlaceKitten is one of many placeholder image services. You can use any link to any image here.

The img tag

This <img> tag has two attributes, one named src and one named alt.

src
The source of the image, usually written as a URL.
alt
The alternative text to display if the image cannot load or if the user is viewing your site in a way that doesn't support images, like old mobile browsers, poor internet connections, screen readers, Siri type assistants, and so on. The alt attribute is mandatory, and should be left blank (alt="") for decorative images.
width/height
The width and height of the image, in display pixels. Before the image loads, the page will reserve this much space for it, so the layout doesn't jitter around as the images load.

Attributes

Attributes are a way of supplying additional information to an element. Almost everyone writes them with double quotes, but single is also valid. I recommend sticking to double quotes, if only to avoid having to listen to loud incorrect people tell you you're wrong.

<span class='icon' id="close"> X </span>

To tell the browser that your website is in English, which helps assistive software make assumptions and helps search results rank you for English searches (both good things), add the lang attribute to your <html> tag.

htmlpage.html
1<!DOCTYPE html>
2<html lang="en">
3 <head>
4 <title>Cheeto</title>
5

Page 3 Page 5