A Basic HTML Structure
A basic HTML structure is the skeleton of any webpage. It provides the foundation that browsers need to render content correctly. Here’s the simplest form:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>My First Page</title>
</head>
<body>
<h1>Hello, World!</h1>
<p>This is my first webpage.</p>
</body>
</html>
Explanation of Each Part:
1. <!DOCTYPE html>
Tells the browser this is an HTML5 document.
2. <html lang="en"> ... </html>
The root element. The lang attribute specifies the language (here: English).
3. <head> ... </head>
Contains metadata about the document (not shown directly on the page). Inside the head:
<meta charset="UTF-8">→ ensures the page supports all characters.<meta name="viewport" content="width=device-width, initial-scale=1.0">→ makes the page responsive on mobile devices.<title>My First Page</title>→ the text shown on the browser tab.
4. <body> ... </body>
Contains everything visible on the webpage: text, images, links, buttons, etc. Example:
<h1>→ heading<p>→ paragraph
👉 With this structure, you can start adding more elements like images (<img>), links (<a>), lists (<ul>, <ol>), and so on.