- PVSM.RU - https://www.pvsm.ru -
Всем доброго времени суток и с наступившим.
Долго не решался написать. Не было подходящей темы, да и читая опубликованные статьи понимал, что сам не смог бы написать развернутый текст (Халк не уметь много писать).
Но прошло время и пришло понимание, что нужно поделиться всем тем, что копошится в голове. А именно: адаптивный шрифт текста, который изменялся бы пропорционально, отображался красиво не только на разных устройствах, но и при разных размерах экрана.
На данный момент мне известно несколько способов адаптации текста:
Все бы ничего, но каждый из перечисленных способов имеет свои узкие места — ловушки, попав в которые ты повисаешь как на…
… удавке. Ярким примером можно выделить «адаптивное» меню bootstrap, которое превращается в мобильное при достижении определенной ширины браузера. Но бывают такие моменты, когда меню или наезжает на логотип, или переходит во вторую строку, что не очень красиво. Приходится дописывать css, указывая минимальный размер ширины меню.
Итак, о минусах также по порядку.
Спасибо всем, кто осилил и дочитал все, что я выше изложил. Весь выше изложенный текст был написан для того того, чтобы задать самый простой вопрос: как сделать так, чтобы текст был комфортно читаемым при любом разрешении. Именно комфортно, ни большой, ни маленький; минимум прокрутки, максимум видимого текста. Ну, вы поняли.
Есть же стандарты текста, выверенные маркетологами и умными людьми (разделил их специально). Есть же W3C — стандарт разметки страницы, почему нет стандартов стилей страницы: «Вот минимальный шрифт должен быть такой, а уж с цветом определись сам».
Как я борюсь с адаптивностью текста.
1. На моем сайте-одностраничнике идет разделение тематических блоков заголовком в одну строку, например, «О компании», «Наши работы» и т.д. Для них я использую BigText. Заголовок располагается только на одной строке и изменяется адаптивно (как VW), но вот если ширина родительского блока изменяется с 50% на 100%, размер шрифта заголовка меняется вслед за ним.
2. Размер шрифта текста внутри одного блока беспроцентно высчитываю относительно заголовка. На load и resize вешаю функцию пересчета дочерних шрифтов относительно главного.
Добился аккуратной адаптивности размера шрифта при любом разрешении, но все крутится на js, что сильно загружает браузер и пагубно влияет на скорость загрузки. Но это все кастомно и уникально для каждого блока, не говоря уже разных страницах сайта.
Может зря поднимаю такие вопросы, может ну его, выехал блок, да и черт с ним, главное — текст читается. Но (syndrome of God ON) может и W3C стал результатом таких же первых мыслей и неробких шагов в направлении стандартизации разметки, чем сейчас займемся и мы? (syndrome of God OFF).
Или уже есть такие правила?
Сайт-источник PVSM.RU: https://www.pvsm.ru
Путь до страницы источника: https://www.pvsm.ru/pesochnitsa/79460
Нажмите здесь для печати.