30 Common HTML Elements for Webpage Structure

<!DOCTYPE html>: Declares the document type and version of HTML being used.
<html>: The root element that contains all other elements on a webpage.
<head>: Contains metadata, links to stylesheets, scripts, and the page title.
<meta>: Provides metadata such as character encoding, viewport settings, or SEO info.
<title>: Sets the title of the webpage that appears in the browser tab.
<link>: Links external resources like stylesheets (CSS) to the page.
<script>: Embeds or links JavaScript for dynamic functionality.
<style>: Allows embedding CSS styles directly inside the document.
<body>: Contains all the content that displays on the webpage.
<header>: Defines introductory content or navigation for a page or section.
<nav>: Represents a section of navigation links.
<main>: Indicates the main content area unique to the page.
<section>: Groups related content into thematic sections.
<article>: Represents independent, self-contained content (e.g., a blog post).
<aside>: Contains tangentially related content, like sidebars or pull quotes.
<footer>: Defines a footer for a document or section, usually with copyright info or links.
<h1>–<h6>: Heading elements, with <h1> as the most important and <h6> as the least.
<p>: Represents a paragraph of text.
<a>: Creates hyperlinks to other pages, sections, or resources.
<img>: Embeds images into the webpage.
<ul>: Defines an unordered (bulleted) list.
<ol>: Defines an ordered (numbered) list.
<li>: Represents a list item within a list.
<table>: Defines a table for organizing data into rows and columns.
<tr>: Represents a table row.
<td>: Represents a table data cell within a row.
<th>: Defines a table header cell, usually bold and centered by default.
<form>: Creates an input form to collect user data.
<input>: Represents various types of input fields (text, checkbox, radio, etc.).
<button>: Defines a clickable button for actions.