Размер шрифта в мобильной верстке: где интерфейс ломается чаще всего
На мобильном экране ошибка в typography заметна сразу: текст либо давит, либо теряется. Работает не «красивый» размер, а иерархия: заголовок должен читаться первым, основной текст — без усилия, подписи — не спорить с контентом.
Проверь три уровня:
— основной текст: не делай его слишком мелким, иначе пользователю придётся приближать экран;
— заголовки: разница между уровнями должна быть видна с первого взгляда;
— мелкие элементы: кнопки, метки, подсказки нельзя сжимать до декоративного масштаба.
Смотри не только на px, но и на строку: если длина слишком большая, даже нормальный размер выглядит тяжело. Частая ошибка — один и тот же шрифт для всего блока. В итоге всё становится одинаково важным, а интерфейс теряет структуру.
Хорошее правило простое: сначала задавай удобочитаемый базовый текст, потом увеличивай акценты только там, где они действительно помогают сценарию. Тогда экран не перегружается, а смысл читается быстрее.
Мобильная верстка: лучшее
@mobile_first_design_tips_ww
Размер шрифта в мобильной верстке: где интерфейс ломается чаще всего
Этот пост опубликован в Telegram-канале Мобильная верстка: лучшее. Подписаться можно по ссылке: @mobile_first_design_tips_ww.