Essential storage keeps sign-in and learning features working. Google Analytics measures visits; Microsoft Clarity records interactions to help us improve usability. Both are optional and stay off until you choose. Read our privacy policy.
Study the question, then follow the complete answer and its reasoning.
Turn visually emphasized text into a logical heading hierarchy for a city cycling guide. The outline should make sense even when read without the paragraphs.
Use one h1 for the page, h2 for major topics, and h3 for subsections within a major topic.
<main>
<h1>City cycling guide</h1>
<section>
<h2>Choose a bicycle</h2>
<h3>Commuter bikes</h3>
<p>Comfortable for everyday journeys.</p>
<h3>Folding bikes</h3>
<p>Compact for mixed-mode travel.</p>
</section>
<section>
<h2>Plan a safe route</h2>
<p>Prefer calm streets and protected lanes.</p>
</section>
</main>The h1 names the page. Each h2 begins a major section, and each h3 names a subsection inside the first h2. Strong indicates importance within prose; it does not create a navigable section or heading in the document outline.
Headings form a navigable outline of a page. Readers scan them visually, and screen-reader users can jump through them as a list. When bold text merely looks like a heading, that structure disappears; when levels are chosen only for size, the resulting outline describes the wrong relationships.
This beginner HTML exercise focuses on Choose heading levels by hierarchy, Create a scannable page outline, Avoid presentational heading substitutes. Its requirements define the exact behavior to implement before you write code.
Start with the displayed example input and expected output, then test a boundary case suggested by the requirements. Edit the HTML, inspect the live preview, then run the checks before comparing your structure with the complete answer.
Attempt Repair a heading outline first. Then open the read-only solution file to compare the contract, edge-case handling, and implementation choices—not simply to copy the final code.