<article>: The HTML Article Element

1 Description

The <article> element is used to hold some type of self contained unit of content.

Articles should (ideally) be independently re-distributable.

A website with multiple blog posts should put each blog post into it's own <article> element. A website with multiple recipes should put each recipe into it's own <article> element. A website with multiple news stories should put each news story into it's own <article> element.

2 Examples

<!DOCTYPE html>
<html>
    <head>
        <title>Example Page</title>
    </head>
    <body>
        <h1>Article Example Page</h1>
        <main>
            <p>These are some recipes.</p>
            <article>
                <h2>Recipe for Chocolate Chip Cookies</h2>
                <p>This is a recipe for chocolate chip cookies.</p>
            </article>
            <article>
                <h2>Recipe for Meatloaf</h2>
                <p>This is a recipe for meatloaf.</p>
            </article>
            <article>
                <h2>Recipe for Caesar Salad</h2>
                <p>This is a recipe for caesar salad.</p>
            </article>
        </main>
    </body>
</html>

This document was last updated: