Статьи с тегом «a11y»
FrontendCSSJavaScripta11y Демонстрация того, как современная веб-платформа может упростить уменьшение движения на старой кодовой базе.FrontendHTMLa11y Узнайте, как HTML элемент <details> может заменить JavaScript аккордеоны и почему он может быть лучше, чем ваше текущее решение.FrontendHTMLa11y HTML-элемент search — это контейнер, представляющий части веб-страницы с функциональностью поиска.FrontendCSSa11y CSS переменные можно использовать, чтобы сделать цвета темнее, когда они отображаются на светлом фоне, и светлее, когда они отображаются на тёмном, что делает их более яркими в обоих случаях.FrontendCSSHTMLJavaScripta11y За последние несколько лет интерфейсы с темным режимом сильно изменились. Все мы знаем традиционный
подход с использованием медиа-запросов, но в этой статье Sara Joy демонстрирует современные CSS-функции, благодаря которым соблюсти предпочтения пользователя в выборе цветовой схемы становится чертовски просто.FrontendHTMLCSSJavaScripta11y Давайте уделим немного времени рассмотрению Dialog API, Popover API и остальных. Рассмотрим, когда лучше использовать каждый из них в зависимости от требований. Модальные или немодальные? JavaScript или чистый HTML/CSS? Не уверены? Не волнуйтесь, мы разберёмся во всём этом.Frontenda11yHTML Мы все бывали там, когда, торопясь уложиться в срок, создавали выпадающее меню или модальное окно, не задумываясь о его доступности. Но что, если внести несколько небольших изменений, которые могли бы значительно улучшить работу с сайтом для широкого круга пользователей? Доступность не должна быть сложной задачей или галочкой в графе соответствие
. Речь идёт о создании продуктов, которыми могут пользоваться все, независимо от их способностей, технической грамотности, операционной системы или устройства.ReactJavaScripta11y Мы считаем, что следует чаще использовать хук useId(). Если вы обнаружили, что не используете его, есть большая вероятность, что ваше приложение или сайт либо недоступны (a11y), либо вы создаёте код, склонный к ошибкам. Позвольте объяснить.Frontenda11y Все знают, что нельзя использовать aria-hidden в интерактивных элементах. Но в чём проблема? Я решил выяснить это, чтобы в следующий раз, когда об этом спросят, я мог лучше объяснить.FrontendCSSa11y Состояние фокуса пользователя совершенно не учитывается веб-разработчиками. Представьте себе навигацию по сайту без чёткого указания того, где вы находитесь и с чем взаимодействуете; это сбивает с толку. Именно здесь на помощь приходят CSS-псевдоклассы, такие, как :focus, :focus-within и :focus-visible. Цель этой статьи — пролить свет на важность состояния фокуса в веб-разработке.FrontendCSSa11y Иногда требуется, чтобы список отображался не вертикально, а в виде горизонтального списка (как в навигационном меню).FrontendCSSa11y Оптимизация и настройка под пользователей, предпочитающих непрозрачный пользовательский интерфейс.FrontendHTMLa11y Если вы новичок в веб-разработке, то, возможно, слышали термин "Семантический HTML" и задавались вопросом, что он означает. Проще говоря, Семантический HTML — это использование разметки HTML для передачи смысла содержимого веб-страницы, а не только её внешнего вида.FrontendCSSa11y Рассмотрим, что такое em и rem, чем они отличаются, когда и как их использовать, и практические примеры использования.