HTML Basic Examples

HTML basic examples show how simple tags are used to create the structure of a web page, including headings, paragraphs, links, and images.

HTML Documents

Every HTML document starts with a document type declaration. This tells the browser what type of document it is:

<!DOCTYPE html>

The main HTML content is enclosed in <html> and </html> tags:

<html>
    
</html>

The part you see in the browser is inside the <body> tags:

<body>
    <h1>Welcome to My Page</h1>
    <p>This text will appear on the webpage.</p>
</body>

Your First Webpage

Now let's put it all together. This is the simplest HTML page that you can create and view in a browser:

HTML

▶ Run it

<!DOCTYPE html>
<html>
<head>
  <title>My First Webpage</title>
</head>
<body>

  <h1>Hello, World!</h1>
  <p>I just created my first HTML page.</p>

</body>
</html>

Headings and Paragraphs

Headings organize your page, from <h1> (largest) to <h6> (smallest). Paragraphs are added using <p>:

<h1>Main Title</h1>
<h2>Subheading</h2>
<p>This is a paragraph of text.</p>

Links

To link to another webpage, use the <a> tag with the href attribute:

<a href="https://google.com">Go to Google</a>

Images

Images are added using the <img> tag. Always include the alt attribute to describe the image:

<img src="picture.jpg" alt="A sample picture">

🚀 Tip: Practice by creating your own HTML file. Start with headings, paragraphs, links, and images. Don’t worry about mistakes — that’s how you learn!

HTML

<!DOCTYPE html>
<html>
<head>
  <title>My First Webpage</title>
</head>
<body>

  <h1>Main Title</h1>
  <h2>Subheading</h2>
  <p>This is a paragraph of text.</p>

  <a href="https://www.google.com/">Go to Google</a>

</body>
</html>

← Previous Next →