Проверяет понимание семантических HTML5-тегов и их роли в структурировании веб-страницы для улучшения доступности и SEO.
Семантические теги <header>, <section>, <article> и <footer> были введены в HTML5 для того, чтобы придать структуре веб-страницы осмысленный смысл, а не просто использовать универсальные <div>. Они помогают браузерам, поисковым системам и вспомогательным технологиям (например, скринридерам) правильно интерпретировать содержимое.
<section> должен иметь заголовок (например, <h1>–<h6>). Используется для логических блоков, таких как главы, вкладки или группы новостей.<article> могут быть свои <header> и <footer>.<body>
<header>
<h1>Мой блог</h1>
<nav>...</nav>
</header>
<main>
<article>
<header>
<h2>Заголовок статьи</h2>
<time>2025-01-01</time>
</header>
<section>
<h3>Введение</h3>
<p>Текст введения...</p>
</section>
<section>
<h3>Основная часть</h3>
<p>Подробности...</p>
</section>
<footer>
<p>Автор: Иван</p>
</footer>
</article>
</main>
<footer>
<p>© 2025 Блог</p>
</footer>
</body>Использование семантических тегов делает код более читаемым, улучшает SEO и доступность. Рекомендуется применять их всегда, когда это возможно, вместо безликих <div>, чтобы чётко обозначить назначение каждого блока.
Frontend developer
Ментор по Frontend
Полное сопровождение до оффера — без дорогих курсов, с оплатой после трудоустройства
Записаться на консультациюFrontend developer
Ментор по Frontend
Полное сопровождение до оффера — без дорогих курсов, с оплатой после трудоустройства
Записаться на консультацию