Section and article in HTML - Cheat Sheet & Quick Revision

Recall & Review

beginner

What is the purpose of the <section> element in HTML?

The <section> element groups related content together, like chapters in a book. It helps organize the page into meaningful parts.

beginner

How does the <article> element differ from <section>?

<article> is for self-contained content that can stand alone, like a blog post or news story. <section> is for grouping related content within a page.

intermediate

Can a <section> contain multiple <article> elements?

Yes, a <section> can contain multiple <article> elements if they are related and grouped together under a common theme.

beginner

Why is using semantic elements like <section> and <article> important?

They improve accessibility, help search engines understand content, and make the code easier to read and maintain.

beginner

Give an example of when to use <article> instead of <section>.

Use <article> for a blog post, news story, or user comment that can be shared or read independently.

Which HTML element is best for grouping related content under a common theme?

A <div>

B <article>

C <section>

D <header>

groups related content under a theme, while

is for independent content.

Which element should you use for a standalone blog post?

A <section>

B <article>

C <footer>

D <nav>

is for self-contained content like blog posts.

Can <article> elements be nested inside a <section>?

A Yes

B No

C Only if they have the same class

D Only inside <div>

elements can be grouped inside a

if related.

Why use semantic elements like <section> and <article> instead of just <div>?

A They improve accessibility and SEO

B They add style automatically

C They make the page load faster

D They are required for all HTML pages

Semantic elements help screen readers and search engines understand the page structure.

Which element is NOT typically used to organize page content semantically?

A <header>

B <article>

C <section>

D <span>

is an inline element used for styling, not for semantic grouping.

Explain the difference between

and

elements and when to use each.

Think about content that can stand alone versus content grouped by theme.

Describe why semantic HTML elements like

and

improve accessibility and SEO.

Consider how machines and people benefit from clear content structure.