Document Structure Tags

Tag Usage Where Used Extra Notes
<html> Root of HTML document Whole page Wraps entire HTML
<head> Metadata container Top of document Not visible
<title> Page title Browser tab SEO important
<meta> Metadata Head Charset, viewport
<link> Link external files Head CSS, icons
<style> Internal CSS Head Small styles
<script> JavaScript Head / Body Can be async
<body> Visible content Main page Everything user sees
Tag Usage Where Used Extra Notes
<a> Create hyperlinks Navigation, links Uses href attribute
<img> Display images Web pages, galleries Uses src and alt
<audio> Play audio Music, podcasts Supports mp3, wav
<video> Play video Media content Supports mp4, webm
<source> Media source file Inside audio/video Allows multiple formats
<iframe> Embed another page YouTube, Maps Loads external content

🧾 Forms & Inputs

Tag Usage Where Used Extra Notes
<form> Form container User input pages Uses action and method
<input> Input field Forms Many types (text, radio, number)
<label> Label for input Forms Improves accessibility
<textarea> Multi-line input Forms Used for messages
<button> Clickable button Forms / UI Submit or normal button
<select> Dropdown menu Forms Contains option tags
<option> Dropdown option Inside select Defines values
<fieldset> Group inputs Forms Visual grouping
<legend> Group title Inside fieldset Heading for inputs

🧱 Layout & Semantic Tags

Tag Usage Where Used Extra Notes
<div> Block-level container Layout structure No semantic meaning
<span> Inline container Text styling No semantic meaning
<header> Header section Top of page Logo, title, nav
<nav> Navigation links Menus Should contain links only
<main> Main content Page body Only one per page
<section> Content section Grouped content Logical grouping
<article> Independent content Blogs, posts Reusable & standalone
<aside> Side content Sidebar Ads, notes, extra info
<footer> Footer section Bottom of page Copyright, links