Переосмысливая изменение размера текста в вебе

Усилия Airbnb по улучшению доступности веб-страниц были направлены на то, чтобы обеспечить читаемость текста при увеличении его размера на 200% (Увеличение текста). Увеличение масштаба в браузере, хотя и эффективное на настольных компьютерах, оказалось сложным на мобильных устройствах из-за ограниченного просмотра. Airbnb выбрала масштабирование шрифта, которое изменяет размер текста независимо от общего масштаба страницы. Чтобы поддержать масштабирование шрифта, Airbnb выбрала единицы rem, которые масштабируются пропорционально размеру шрифта на основе корневого элемента. Этот подход обеспечил последовательное масштабирование текста без влияния на другие элементы макета. Чтобы упростить переход на единицы rem, Airbnb автоматизировала процесс преобразования и предоставила инструменты дизайнерам для имитации масштабирования шрифта на этапе проектирования. Управление преобразованием в двух системах CSS-in-JS, React-with-Styles и Linaria, представляло дополнительные проблемы. Airbnb использовала поддержку пользовательских свойств Linaria и плагины post-CSS для преобразования большинства свойств, связанных с шрифтами. Была предоставлена возможность использовать единицы px, когда это необходимо. Реализация этих улучшений доступности значительно сократила количество сообщений об ошибках для функции "Увеличение текста" и улучшила пользовательский опыт для людей с нарушениями зрения. Отдавая приоритет потребностям пользователей и принимая лучшие практики, Airbnb продемонстрировала свою приверженность инклюзивному веб-дизайну.