@hedin83
хочу работать веб-разработчиком

Как должен меняться размер шрифтов при адаптивной верстке?

Есть ли какие-нибудь рекомендации по изменению размера шрифтов при использовании медиа запросов. Т.е. как должен уменьшаться шрифт с уменьшением размера окна браузера. Думаю, что "на глаз" такие дела не делаются, должна соблюдаться читабельность.
  • Вопрос задан
  • 5246 просмотров
Пригласить эксперта
Ответы на вопрос 2
paulradzkov
@paulradzkov
Дизайнер, верстальщик, начальник отдела UI
Правило, которым пользуюсь я:

В настольной версии размер основного шрифта (абзацы) не менее 16px. Заголовки от h4 до h1 растут по с коэфициентом 1.250 (Major Third): h4 - 20px, h3 - 24px, h2 - 32px, h1 - 40px. (округленно)

Для маленьких экранов (<768px) абзацы остаются 16px или уменьшаются до 14px (если много текста). Заголовки h4...h1 пересчитываются от нового размера абзаца с коэффициентом 1.125 (Major Second). В этом случае размеры заголовков растут более плавно: h4 - 18px, h3 - 20px, h2 - 23px, h1 - 26px.

Промежуточных брейкпоинтов для размера шрифта не делаю, чтобы не усложнять.
Ответ написан
vanya_beseda
@vanya_beseda
Front End
Используйте вместо px - em.
Подробнее об em здесь: htmlbook.ru/content/edinitsy-izmereniya
Прочтите также данную книгу: abookapart.com/products/responsive-web-design
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы