Найти в Дзене

Чистый DOM = проще понять контент и структуру. Что теряют компании с «мусорной» разметкой


Вот что важно понимать: google боты и AI-агенты не «смотрят» на сайт (ладно вру - они иногда могут рендерить страницу, но это требует больше ресурсов поэтому AI агенты делают это редко). Чаще всего они парсят и анализируют DOM. И если внутри все однотипное из <div> и <span> им сильно сложнее понять зачем и что это за секция - это цитата, отзыв клиента, отдельная секция или что то иное.

Googlebot, Perplexity, ChatGPT — все они полагаются на семантические сигналы. <article> говорит «это основной контент», <nav> — «это навигация», <time> — «это дата публикации». Когда вместо этого везде <div class="wrapper-123">, машины вынуждены угадывать. А угадывая — ошибаются.

Полезная ссылка по семантике - www.w3schools.com/...asp (главное не быть ЧСВ и не думать "я в web разработке n+ лет и не буду про базовый html читать", увы если эта мысль тебя посетила - то ты первый кому надо это почитать и вспомнить, иначе твой front усложняет ai агентам и ботам понимать контент твоего сайта)

Где чаще всего накапливается мусор в DOM:
→ CMS-шаблоны и конструкторы — вложенные контейнеры за каждый отступ
→ React/Vue-компоненты — обёртки за обёртками, порталы, фрагменты, которые не схлопываются
→ Плагины чатов, cookie-баннеров (особенно cookiebot добавляет кучу мусора), аналитики — каждый вставляет свой <div> в <body>
→ Ленивые разработчики — <div> вместо <button>, <span> вместо <time>, <div> вместо <ul>
→ Использование SVG изображений как встраиваемые, а не подключенные как удаленный url
→ Использование UI библиотек которые встраивают куча стилей перед контентом сайта

В итоге получается: медленный рендеринг, хуже индексация, пустые сниппеты и почти нулевая видимость в AI ответах.
Рецепт простой: меньше узлов, больше семантики. <main>, <section>, <article> — это не «для красоты», а инструкции для машин. Если ваш фронтенд не может объяснить структуру страницы без 50 вложенных div'ов — проблема не в дизайне, а в архитектуре.
Чистый DOM = проще понять контент и структуру.
1 минута