Grouping and Structuring Content

Up to this point, you’ve learned how to add text, lists, links, and images. But webpages also need structure. Instead of throwing everything onto the page, we want to group related content together into sections.

Grouping is important because:

• It keeps your code organized and easier to read.

• It makes your page easier to style with CSS later.

• It tells the browser (and search engines) how your content is organized.

Div and Span tags

The two most basic grouping tags are <div> and <span>.

• <div> stands for division. It creates a "box" that groups related content together.

• <span> stands for span of text. It’s for grouping small parts of text inside a paragraph.