Как адаптировать фуллскрин?

Question

[Palpebral]

Часто встречаю в макетах лендингов полноэкранные секции. Обычно, чтобы адаптировать контент в другом месте сайта, достаточно написать media screen and (max-width: ...), но с фуллскринами так сделать не выйдет, ведь контент напрямую зависит от высоты. Так вот, на мобильном разрешении чаще всего оставляется высота/ширина на весь экран, или же на определенной точке, допустим, в 768px, делать такой блок по высоте контента, а не на всю высоту экрана?
Интересно послушать знающих людей, потому что не хочу делать постоянно через какие-то костыли и надеяться что на различных устройствах это будет отображаться одинаково хорошо. Потому что лично у меня трудности с адаптацией, ведь нужно учитывать размеры не только ширины, но и высоты, и соотношение высоты к ширине, и т.п.
Спасибо!

Comments

[Lord_Dantes]

Приведите пример того что вы указали в тексте, что-то плохо понятно что вы имеете ввиду.

[Вадим]

Lord_Dantes, автор про hero-экраны. Мол если у них высота 100vh, то как их адаптировать. Оставлять ли их на всю высоту на мобилках и тд..

[Вадим]

Mashush, не совсем понятно в чём проблема? Нарисовал дизайнер как должно быть на мобилке? Делаете так, как нарисовал.
Не нарисовал? Уменьшаете размеры шрифта, отступы, может что-то придётся скрыть и тд.
Считаете что сделать нормально и сохранить весь контент не получится и дизайнер не нарисовал как должно быть и нет возможности спросить у дизайнера? Делайте как считаете будет ок.
Костыль это не про эту тему. Верстать нужно так, как будет удобно пользователю и устроит заказчика. Вёрстка одного и того же макета разным заказчикам может дать разный результат.

Ну а ещё не забывать в таких случаях про min-height.

[Ankhena]

различных устройствах это будет отображаться одинаково хорошо.

Одинаково хорошо и на всех - это сомнительно.

Как именно поступать - зависит от конкретного макета или конкретного экрана и его содержимого.
Пользователь должен увидеть информацию в читаемом виде. Это важнее, чем уместить всё в один экран.
Например, если на небольшой мобилке буковки получаются в 1мм или все слиплось, потому что убраны почти все отступы, то, очевидно, нужно перестать лепить в экран.

Можно убирать ограничение по высоте, можно уменьшать, можно скрывать ненужные детали, можно разбивать на 2 или 3 экрана и т.д.
Универсального рецепта нет.

Потому что лично у меня трудности с адаптацией, ведь нужно учитывать размеры не только ширины, но и высоты, и соотношение высоты к ширине, и т.п.

Да, с плохо продуманными макетами сложности не только у вас.

[Palpebral]

Вадим, благодарю, примерно такое я и хотел услышать)