HTML practice is different from prose typing. A single character can change the markup: < opens a tag, </ starts an end tag, and quoted values belong to attributes in a start tag. The HTML Living Standard defines the syntax; these drills help you type its familiar patterns accurately.
Drill 1: Match the start and end tag
<p>Practice one complete element.</p>
<strong>Check the closing tag.</strong>
Copy the opening tag, content, slash, and closing tag as one unit. Before moving to the next line, check that the element name matches on both sides. If your editor auto-completes tags, notice which characters it supplied and avoid typing them twice.
Drill 2: Quoted attributes
<a href="/lessons">Explore lessons</a>
<button type="button" aria-label="Start typing">Start</button>
Practice =, both quote marks, and the space between attributes. The href value is a path; the aria-label is an accessible name for the button in this drill. MDN's syntax guide shows why quoting attribute values is a useful habit, especially when values contain spaces.
Drill 3: Nest elements without losing a closing tag
<article>
<h2>Typing notes</h2>
<p>Work on <em>accuracy</em> first.</p>
</article>
Read the structure before you type: article contains an h2 and a p; em sits inside the paragraph. Type the inner </em> before </p>, then finish with </article>. Re-type the block with different text while keeping the same nesting.
An <img> element is different: it is a void element and has no end tag in HTML. The HTML Standard lists the void elements. Do not practice an invented </img> ending.
Practice with longer markup
Choose HTML in the code typing test for longer markup samples. The test uses its own snippets rather than these exact drills. For more angle-bracket practice, see the code symbol typing guide. If you want to alternate markup with programming syntax, try the JavaScript arrow-function drills next.