Как сделать Респонсивный текст во всем проекте?

Я использую для размера текста единицу vw. Тогда при уменьшении/увеличении окна браузера размер текста изменяется плавно.

Так себе решение... Особенно представляю какая жесть происходит на экранах 2800 и выше)

Сергей Горячев, согласен. Но много ли проектов вообще рассчитывается для такой ширины окна. Кроме того, всегда есть возможность ограничить размер шрифта медиазапросом.

Владимир,

Но много ли проектов вообще рассчитывается для такой ширины окна.

При чем тут много или мало проектов? Суть в том, что жесть будет твориться у всех пользователей широких мониторов, так как ты предлагаешь указывать шрифт в зависимости именно от нее.

Вы существуете? Я понимаю, когда нужно добиться эффекта вёрстки для печати, когда контент полной страницы нужно уместить на размер экрана любого устройства, но для обычного сайта по типу Toster…

Это не адаптивность, это безумие.

P. S. Зачем менять значения в каждом теге? Достаточно прописать всё в rem и менять в теге body.

Ну или к примеру, как вы думаете, почему ни один крупный сайт не использует vw для шрифтов? Да, правильно.

Будем считать, что убедили ))) Но еще ни один мой заказчик ни на этапе бета-, ни на этапе альфа-тестирования, ни в эксплуатации, не возражал против такого подхода.

Владимир, просто это малоконтроллируемая единица, когда дело доходит до таких вещей, что может сыграть злую шутку, если вы не предусмотрели нужные брекйпоинты и т. п.

Лучше сразу предусмотреть возможные проблемы и придерживаться общемировых практик. Я, к примеру, тоже не понимал до поры до времени сути использования rem/em для шрифтов. Не понимал, почему крупные проекты стремятся перейти к ним.

SmthTo, em/rem я как раз понимаю. Просто проблема использования фиксированных единиц вкупе с брейкпойнтами в том, что изменение размера шрифта происходит скачкообразно на брейкпойнте. В действительности, это не имеет большого значения при скурпулезном подходе к выбору размера родительского шрифта для медиа составляющей. Т.е., например, у Вас есть стандартные брейкпойнты на 1200, 960 и 550рх (ну, или другие - не имеет значения). Тогда для каждого диапазона шрифты должны быть подобраны так, чтобы быть читабельными на любой ширине экрана из диапазона. Кстати, проблема сверхшироких экранов, о которой говорил Сергей Горячев, здесь тоже остается, только в профиль)))
С другой стороны, производители экранов, что для мобайлов, что для десктопов, сейчас уже потихоньку приходят к унификации размеров. Поэтому идея брейкпойнтов не только жива, но и очень перспективна.

Владимир, я не могу понять, зачем всё же делать на vw даже на простом примере: iPhone 5, 7 и XS Max.

Если использовать px, em, rem, то высота шрифта будет одинаковой и комфортной на всех этих устройствах и текст будет занимать всё пространство планомерно.

Если я задам его в vw, то текст будет иметь разные размеры везде, занимая одинаковое пространство по ширине (т. е. на одной строке будет всегда одинаковое количество текста).

Тем самым мы теряем все плюсы увеличения экрана по ширине. Как бы текста должно помещаться больше, т. к. экран шире, но нет.

А брекйпоинты и не уходят никуда :))

SmthTo, простите, не совсем Вас понял...
Если исходить из глобальных принципов типографики, весь контент должен занимать на странице 10-12% от общего пространства (правда, это принцип справедлив, в основном, для печатных изданий). Вот и представьте, что Вы используете респонсивные изображения, используя, скажем, в Bootstrap4, класс img-fluid. В этом случае, хоть с брейкпойнтами, хоть без, размер картинки будет изменяться плавно, а шрифт - нет. Попробуйте - увидите сами, я экспериментировал...
А то что Вы видите, как недостаток: "Как бы текста должно помещаться больше, т. к. экран шире, но нет.", на мой взгляд является преимуществом: количество строк и символов в строке становится одинаковым для всех экранов и не нужно заморачиваться с наложением блоков или, наоборот, с появлением между ними неоправданно больших паддингов.
Мне очень нравится эта дискуссия с Вами - она для меня очень информативна. Искренне благодарю.

Владимир, как вы правильно заметили, это печатный принцип. И в печати он оправдан. И в вэбе он оправдан, когда нужно уместить одинаковое количество информации на все экраны, но это редкий случай.

Смотрите, такой вопрос: какой смысл в большом экране, если на него умещается столько же контента, как на маленьком?

SmthTo, большой экран, он ведь большой не только по ширине, но и по высоте))) Так что информации уместится по любому больше)))
Но это уже юмор...
В реальности же Вы правы. Широкий экран хорош, например, при работе с большими таблицами Excel - видно больше столбцов без горизонтального скроллинга. Но и здесь есть обнадеживающий (меня!) момент: мало кто из владельцев больших экранов открывает браузер на всю ширину экрана. Кроме того, и это главное - решение обсуждаемой нами проблемы зависит на 100% от поставленной задачи. Если задача сформулирована так, что пользователь должен видеть на экране максимум информации, то правы Вы. Если главное в задаче - привлекательный и одинаковый дизайн для устройств с любым разрешением, то прав я.
Думаю, что и Ваш, и мой подход имеют право на существование. Все зависит от видения заказчика того, как должно ВЫГЛЯДЕТЬ решение поставленной задачи. Ну, и немного от того, как разработчик презентовал заказчику СВОЕ решение)))

Владимир, я один странный принцип выработал: я смотрю на примеры популярных сайтов. Там не используют vw для шрифтов, и я понимаю — почему :))

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

SmthTo, ну вот видите: и Вы используете! )))
И подскажите ламеру, как Вы видите использование или не использование vw, px, em/rem на сайте? По реакции окна браузера на изменение размера? Нет, правда, как можно добраться до сути класса в коде страницы в браузере?

Владимир, я прошу прощения, не могли бы ли вы более подробно описать вопрос? Не совсем его понял.

<@SmthTo,

я смотрю на примеры из популярных сайтов...

Как Вы их смотрите, понимая, что

Там не используют vw для шрифтов...

Более подробно вряд ли смогу)))

Владимир, открываете консоль, заходите на любой сайт: Google (+ сервисы и т. п.), Rambler, Mail, Facebook, VK, AliExpress, Stripe, Wikipedia, Habr, TJournal и т. д.

И изучаете типографику :))

SmthTo, последовал Вашему совету на Яндексе и Рамблере. Удивился: эти сайты вообще не заточены под принудительное изменение размера окна браузера)))
Вот, к примеру, скрин из Firefox для habr.ru:

Полагаю, что сайт определяет устройство пользователя и выдает ему соответствующую устройству верстку.

Владимир, да, большинство сложных (и не очень) сайтов, у которых древняя история разработки, обладают мобильной версией. Сделано это для скорости отображения, чтобы не грузить лишние скрипты и стили.