06:44
1,0×
00:00/06:44
28,8 тыс смотрели · 3 года назад
3 месяца назад
Любите ARIA? Нет, Кипелов тут не причем ARIA (Accessible Rich Internet Applications) — это набор атрибутов, разработанный для того, чтобы улучшить доступность веб-приложений для людей с ограниченными возможностями. Он помогает разработчикам создавать интерфейсы, которые могут быть более легко интерпретированы вспомогательными технологиями, такими как экранные читалки. Это особенно важно для людей с ограниченным зрением или моторикой. Основные атрибуты ARIA: 1. aria-label: используется для предоставления текста этикетки для элемента. <button aria-label="Закрыть">X</button> 2. aria-hidden: указывает, что элемент и его дочерние элементы недоступны для вспомогательных технологий. <div aria-hidden="true">Этот текст будет игнорироваться.</div> 3. aria-live: сообщает экранному чтецу об изменениях в содержимом, которые происходят динамически. <div aria-live="polite">Контент будет прочитан экранным чтецом при изменении.</div> 4. aria-expanded: указывает состояние раскрытия или сворачивания элементов интерфейса (например, аккордеоны, выпадающие списки). <button aria-expanded="false">Меню</button> 5. role: Определяет роль элемента интерфейса, помогая вспомогательным технологиям понять его назначение. <div role="alert">Это важное сообщение!</div> Преимущества использования ARIA: — лучшая доступность: делает ваше приложение доступным для большего круга пользователей; — социальная ответственность: помогает соблюдать стандарты доступности и поддерживать инклюзивность; — улучшение SEO: иногда улучшает видимость вашего контента для поисковых систем. Использование ARIA атрибутов поможет вам создать более доступные и понятные веб-приложения для всех пользователей. Почитать подробнее можно в этой статье: https://doka.guide/a11y/aria-intro/ #урок #html Учитесь фронтенду с нами — подпишитесь 💻
3 года назад
Интерфейсы с вкладками без JavaScript
Источник: Nuances of Programming Все больше и больше хитрых интерфейсных функций опираются на JavaScript, из-за чего создают проблемы доступности. Даже с учетом того, что на сегодняшний день JS им больше не требуется. CSS3 принес нам, как разработчикам, много интересных возможностей, позволив реализовать модальные диалоги, мобильные меню “гамбургеры” и даже интерфейсы с вкладками без единой строчки JavaScript-кода. Что плохого в JavaScript? Ничего само по себе, если это не единственное ваше средство обеспечения удобства или функциональности на странице...