HTML-семантика ломает доступность, если теги выбраны «для вида»

HTML-семантика ломает доступность, если теги выбраны «для вида»

Для сайта на WordPress семантика — это не про код ради кода, а про понятную структуру для скринридеров, клавиатуры и поисковых систем. Когда заголовки, списки и кнопки размечены правильно, пользователь быстрее понимает, где меню, где контент, а где форма.

Проверь базу:
— h1 только один и он описывает страницу;
— заголовки идут по иерархии, без прыжков с h2 сразу на h4;
— список делай списком, а не набором div;
— основной контент оборачивай в main, навигацию — в nav, подвал — в footer.

Отдельно следи за интерактивными элементами. Ссылку не подменяй кнопкой через CSS, а кнопку не делай из div с обработчиком клика. Если элемент нажимается, он должен быть доступен с клавиатуры, иметь понятное имя и ожидаемое поведение.

Ещё одна частая ошибка — декоративная разметка вместо смысловой. section не нужен в каждом блоке подряд, а strong и em не заменяют заголовки. Семантика работает тогда, когда структура страницы читается без стилей и без картинок. Это и есть база доступного HTML.