The <artical> Tag
The <article> tag in HTML is used to define self-contained, reusable content that is intended to be independently distributable or reusable. It is commonly used for blog posts, news articles, forum posts, or any other discrete blocks of content that could be syndicated or republished.
Features of the <article> Tag:
- Self-contained Content: The content within an
<article>tag should make sense on its own and be reusable. - Multiple Instances: Multiple
<article>elements can be used on the same page, like displaying several blog posts or news headlines. - Semantic Meaning: It provides semantic structure, improving accessibility and SEO (search engine optimization).
Syntax
<article>
<h2>Welcome to job binge</h2>
<p>Article content goes here. This could be a blog post, a news item, or any other piece of content.</p>
</article>
Example: Blog Post
htmlCopy code<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>job binge</title>
</head>
<body>
<article>
<h2>Understanding the HTML Article Tag</h2>
<p>The <strong><article></strong> tag in HTML helps structure your content semantically.</p>
<footer>
<p>Written by: Mayank Agarwal</p>
</footer>
</article>
</body>
</html>
Use Cases:
- Blog Posts: Each post in a blog can be wrapped in an
<article>tag. - News Websites: Each news item or story can be enclosed within an
<article>tag. - Forum Discussions: Each discussion thread or topic can use the
<article>tag. - Documentation: Use the
<article>tag for sections of documentation that stand alone.
Attributes:
- Global Attributes: Supports all global attributes like
class,id,style, etc. - Content Model: Can contain flow content, such as headings, paragraphs, images, videos, and other sections.
Accessibility Benefits:
Screen readers and other assistive technologies can easily identify the <article> tag, helping users navigate through content efficiently. It also aids search engines in indexing content effectively.