Semantics
HTML Article
Structuring Article Content
HTML article element represents standalone content, like blog posts.
What is the HTML Article Element?
The <article> element in HTML5 is designed to represent a self-contained composition in a document. This element is often used for content that can be distributed and reused independently, such as a blog post, news article, or forum post.
When to Use the Article Element
Use the <article> element when the content can stand alone from the rest of the page and makes sense on its own, even when distributed outside of its original context. Examples include:
- Blog posts
- News articles
- Forum posts
- Individual comments
Basic Structure of an Article
An <article> element can contain various other HTML elements such as headings, paragraphs, images, and more. Here is a basic example of an <article>:
Nesting Articles
In some cases, you might want to nest <article> elements to represent sub-articles within a larger article. For example, a news website might have an article about a specific event with several related stories nested inside the main article.
Best Practices for the Article Element
When using the <article> element, consider the following best practices:
- Ensure the content within the
<article>can stand alone and be understandable on its own. - Use
<article>only for content that is related or relevant to the main topic. - Provide appropriate metadata (like
<header>and<footer>) to enhance accessibility and SEO.
