5. Семантическая разметка статьи

Легко
html5semanticarticle

Создайте семантически правильную HTML-разметку для статьи блога с заголовком, автором, содержимым и навигацией.

Каждый способ должен быть реализован независимо в своём контейнере:

  1. Использовать тег <header> для шапки сайта
  2. Использовать тег <nav> для навигации
  3. Использовать тег <article> для статьи
  4. Использовать тег <time> с атрибутом datetime
  5. Использовать тег <aside> для боковой панели
  6. Использовать тег <footer> для подвала
  7. Использовать тег <main> для основного содержимого

Создайте страницу статьи блога с использованием семантических HTML5 тегов. Структура должна включать: - Навигацию сайта (header + nav) - Статью с заголовком, датой публикации, автором и текстом - Боковую панель с ссылками на похожие статьи - Подвал сайта Используйте теги: header, nav, main, article, aside, footer, time, figure, figcaption.

Примеры

Пример 6
Вход:
HTML-код страницы статьи
Ожидаемый результат:

Разметка содержит все необходимые семантические теги: header, nav, main, article, time, aside, footer

Подсказка:

Семантические теги улучшают доступность и SEO страницы

Ограничения

  • Использовать только семантические теги HTML5
  • Не использовать <div> для структурных блоков
0% принято
0 решений