HTMLmarkup~15 mins

What is an HTML element - Hands-On Activity

Choose your learning style9 modes available

Learn Why Deep Render Try Challenge Project Recall Perf

Understanding an HTML Element

📖 Scenario: You want to create a simple webpage that shows a greeting message.

🎯 Goal: Build a basic HTML page with a single heading element that displays the text "Hello, friend!".

📋 What You'll Learn

Create an HTML document with the correct structure

Add a <h1> element inside the <body>

Set the text inside the <h1> element to exactly "Hello, friend!"

💡 Why This Matters

🌍 Real World

Every webpage you visit is made of HTML elements like headings, paragraphs, and images.

💼 Career

Knowing how to create and structure HTML elements is the first step to becoming a web developer.

Progress0 / 4 steps

Create the basic HTML structure

Write the basic HTML skeleton including <!DOCTYPE html>, <html lang="en">, <head> with <meta charset="UTF-8"> and <title> "Greeting Page", and an empty <body>.

HTML




    
    Greeting Page

Need a hint?

Start by typing the basic HTML tags that every page needs.

Add a heading element

Inside the <body> tag, add an <h1> element.

HTML




    
    Greeting Page

Need a hint?

Use the <h1> tag to create a big heading.

Add text inside the heading

Write the exact text Hello, friend! inside the <h1> element.

HTML




    
    Greeting Page

Need a hint?

Put the greeting text exactly between the opening and closing <h1> tags.

Add a language attribute and meta viewport

Make sure the <html> tag has lang="en" and add a <meta name="viewport" content="width=device-width, initial-scale=1.0"> inside the <head> for mobile-friendly design.

HTML




    
    Greeting Page
    


    Hello, friend!

Need a hint?

This helps browsers know the page language and make it look good on phones.