Используете ли вы fluid typography в вёрстке сайтов?

Question

[Islam Ibakaev]

я набросал пример, где три параграфа меняют font-size при 480px и 600px.
.title1 - самый простой способ, когда ты обращаешься непосредственно к элементу в медиа запросе
.title2 - более продвинутый способ, когда ты ставишь элемент в зависимость от html или body(определяя стили элемента в em и rem), а в медиа запросе просто меняешь font-size html(body) и всё подстраивается.
.title3 - плавно меняет font-size, посмотрел здесь

Я знаю, что второй способ достаточно популярен, а что насчёт третьего?
используете ли вы его в вёрстке?
есть ли какие-нибудь недостатки использования третьего способа?
если вы его используете, то для того чтобы задать плавное изменение только font-size или есть другие "use cases"?

p.s. в консоли отслеживается изменения font-size элементов

Comments

[Ankhena]

Использую в редких случаях, когда важны пропорции фона и текста, нельзя, чтобы текст переносился на другую строку и подобных.

Answer 1

[Андрей Гончаров]

@media screen and (min-width: 25em){
    html { font-size: calc( 16px + (24 - 16) * (100vw - 400px) / (800 - 400) ); }
  }

Не стоит так усложнять жизнь, я считаю)) Это из предложенной статьи. Утрировано конечно. Есть в статье годные идеи.

Comments

[Islam Ibakaev]

вы бы стали использовать эту технику in real case?

[Андрей Гончаров]

Я использую иногда vw для font-size, это часто бывает в баннерах каких-нибудь, когда надо соблюсти жесткие пропорции текста от изображения сзади. Если это считать fluid - то да бывают такие моменты.

[Андрей Гончаров]

Но тянуть вот эту всю математику с calc я бы не стал, конечно.