4.1 Semantic HTML5 Elements Flashcards
(19 cards)
What is semantic HTML?
Semantic HTML uses meaningful tags that clearly describe their purpose (e.g, <article>, <nav>), improving structure, accessibility, & SEO.
Why is semantic HTML important for SEO?
It helps search engines better understand your page structure & content relevance.
Why is semantic HTML important for accessibility?
It helps screen readers & assistive tech interpret the page meaning correctly.
Why is semantic HTML important for developers?
It improves code readability & maintainability, making it easier to collaborate.
What is the <header> tag used for?
Defines introductory content or heading of a page or section (e.g, logo, nav).
Can multiple <header> element be used in one HTML document?
Yes, one for the page & others for individual sections or articles.
What is the <nav> tag used for?
Contains navigation links for the site or section.
What is the <main> element used for?
Wraps the main content of a page, unique & central to the document.
How many <main> tag should be on a page?
Only one, as it represents the dominant content.
What is <article> tag used for?
Contains independent, self-contained content like blog posts or news items.
What is the <section> tag used for?
Groups related content within a page, often with a heading.
What is the difference between <article> & <section>?
<article> is for standalone content, <section> is for thematic grouping.
</section></article>
What is the <aside> tag used for?
Contains secondary content like sidebars, callouts, or related links.
What is the <figure>element for?</figure>
Encapsulates media content (image, Chart) & its caption.
What does <figcaption> do?
Provides a caption or description for the content inside<figure>.</figure>
Can <figcaption> appear before or after the media in <figure>?</figure>
Yes, it can be placed before or after the media in <figure> block.</figure>
What is the <time> element used for?</time>
Represents a specific time or date, optionally with datetime for machine-readable format.
How do you use <time>Today</time>?
The datetime attribute provides a machie-readable timestamp.
Why use <time> instead of a regular <span> for dates?</span></time>
Improves semantic structure & enables features like calendar tools & search engines.