An HTML cheat sheet is a one-page map of the tags, attributes, and document structure you need to mark up a web page. Use it when you forget a tag name, an input type, or how to write a valid HTML5 skeleton.
This HTML cheat sheet is written for people searching for a fast, accurate reference: students, junior developers, and teams shipping production software. Pin it, copy the snippets, and come back when syntax slips.
Quick reference
- Doctype: Start every page with
<!DOCTYPE html>so browsers use standards mode. - Root:
<html lang="en">sets the language for accessibility and SEO. - Head: Put charset, viewport, title, and meta description in
<head>. - Charset:
<meta charset="UTF-8">belongs as the first head child. - Viewport:
<meta name="viewport" content="width=device-width, initial-scale=1">is required for mobile. - Headings: One
<h1>per page, then<h2>–<h6>in order. Do not skip levels for styling. - Links:
<a href="/about">for internal paths; addrel="noopener"ontarget="_blank". - Images:
<img src="" alt="">— empty alt only when the image is decorative. - Lists:
<ul>unordered,<ol>ordered,<dl>for term/definition pairs. - Comments:
<!-- note -->never ships secrets; comments are visible in view-source.
Copy-paste examples
Valid HTML5 skeleton
Use this as the start of every static page or PHP view.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Page title</title>
</head>
<body>
<header><a href="/">ArpaNeuro</a></header>
<main>
<h1>Heading</h1>
<p>Content.</p>
</main>
</body>
</html>Semantic article layout
Search engines and screen readers prefer landmarks over nested divs.
<article>
<header>
<p>Cheat Sheets</p>
<h1>HTML Cheat Sheet</h1>
<time datetime="2026-09-07">September 7, 2026</time>
</header>
<p>Lead paragraph.</p>
<section>
<h2>Tags</h2>
<p>Details.</p>
</section>
</article>Common mistakes
- Using
<div>for everything instead ofmain,nav,article, andsection. - Multiple
<h1>tags used as visual style instead of one page title. - Missing
alton informative images, or stuffing keywords into alt text. - Putting CSS and huge scripts in
<head>withoutdefer— blocks first paint. - Invalid nesting such as a
<p>wrapping a<div>or an<a>wrapping another<a>.
FAQ
- Is HTML a programming language? No. HTML is a markup language. It describes structure. CSS styles it. JavaScript adds behavior. Job posts that say “HTML programming” still mean frontend markup skill.
- Do I still need XHTML-style closing slashes? No. In HTML5
<img>and<input>are void tags.<img />works but is not required.
- What is the most important HTML tag for SEO?
<title>and a single clear<h1>plus a unique meta description. Semantic headings help crawlers outline the page.
- Should I learn HTML before CSS and JavaScript? Yes. You cannot style or script structure you do not understand. Spend a day on tags, forms, and accessibility basics first.
Related HTML cheat sheets
Build with this stack
When a cheat sheet is not enough — you need a production app, a student FYP, or a custom dashboard — ArpaNeuro builds custom web development and also sells ready-made source code. Request a quote and tell us the stack.
Browse software development services or the source code marketplace if you want a working codebase instead of starting from a blank file.