Популярный гайд по входу во фронтенд последнее время выглядит так: берем React, попутно учим базовый синтаксис JS, сверху накатываем готовую UI-библиотеку — профит, вы великолепны и готовы к оферу. HTML на этом празднике жизни кажется древней разметкой, на которую не стоит тратить время. Никто сейчас не скажет: «Я сверстал страницу для сайта» - выглядит как-то дешево. Все говорят: «Я разработал модуль на Реакте для нашего веб-приложения» — сразу звучит солидно и дорого.

Но что мы получаем на практике в реальных, не шаблонных проектах?

- «Дивовый» рай: Весь сайт собран исключительно на <div> и <span>. - Клик-мания: Любое интерактивное действие, будь то ссылка, отправка формы или раскрывашка, вешается через onClick на тот же самый див. - Теговый хаос: Кнопки, вложенные внутрь ссылок, заголовки <h1> в роли обертки для карточки товара и полная каша в структуре.

«Ну и что? Пользователь-то видит красивую картинку, библиотека всё сглаживает "кнопки" кликаются, "ссылки" открываются!» — скажет такой разработчик.

А вот что происходит на самом деле: 1. SEO улетает на дно. Роботы Яндекса и Google — парни консервативные. Они не гадают, что у вас лежит внутри <div>. Если там нет нормальных тегов заголовков, статей и навигации (<header>, <main>, <article>), сайт для поисковика превращается в нечитаемую простыню текста. Итог — потеря бесплатного трафика.

2. Инвалидность интерфейса (A11y). Люди с нарушениями зрения используют скринридеры. Скринридер умеет прыгать по кнопкам и ссылкам. Но он понятия не имеет, что ваш <div> с фиолетовым фоном — это на самом деле главная кнопка "Купить". Сайт становится для таких пользователей недоступным. Да, доля таких пользователей небольшая, но мы осознанно отсеиваем их для нашего продукта.

3. Ломается базовая эргономика. Настоящую ссылку можно открыть в новой вкладке колесиком мыши или скопировать адрес в один клик. По нативным кнопкам можно перемещаться с клавиатуры через Tab и активировать их пробелом. «Дивовые» аналоги лишают интерфейс этих привычных мелочей, и проект начинает тихо бесить пользователей.

Фронтенд — это не только про сложные стейт-менеджеры и архитектуру компонентов. Это прежде всего про доставку интерфейса человеку. И если фундамент этого интерфейса (HTML) сделан из кривых кирпичей, никакие реактивные хуки его не спасут.

Признавайтесь, как часто находите в чужом (или своем) коде кнопку внутри ссылки? Что вас больше всего триггерит в "современной" верстке? А может, не стоит на это обращать внимания, в конце концов, оно ведь как-то работает?