На сегодня - большая и глубокая статья о семантическом HTML. Автор рассказывает о разных аспектах и объясняет, почему семантика важна и почему плохо городить страницу из сплошных div. Краткие тезисы:
- Семантический HTML выражает смысл, а не только структуру.
Теги вроде
<article>, <nav>, <header> говорят браузерам и агентам, что это за контент.- Бессмысленная разметка вредит доступности.
Скринридеры и голосовые интерфейсы не могут правильно интерпретировать пирамиду из
<div>.- Семантика улучшает производительность.
Четкая структура DOM ускоряет рендеринг и упрощает работу с анимациями.
- Большие и сложные DOM-деревья замедляют страницу.
Чем больше узлов — тем дольше браузер обрабатывает layout, style и paint.
- Утилитарные классы увеличивают дублирование CSS.
Это замедляет перерасчёт стилей и увеличивает размер файлов.
- Случайные имена классов мешают кэшированию и тестированию.
Например,
.jsx-392hf или .tw-abc123 затрудняют анализ и повторное использование.- Семантика помогает AI-агентам и поисковым системам.
Четкая разметка упрощает извлечение данных и индексацию.
- Семантический HTML — основа надежности.
Даже при сбое JS или стилей, он обеспечивает минимальную функциональность.
- Это не "чистый код" — это инфраструктура.
Семантический HTML — базовый элемент современного веба.
Статья: https://www.jonoalderson.com/conjecture/why-semantic-html-still-matters/
