Настройка разрешений экранов в Zero Block на Тильде
Теперь в нулевом блоке можно задать разрешение экранов для разных устройств, чтобы добиться идеального расположения всех элементов сайта. Диапазон для контрольных точек варьируется от 320 до 1920px. Вы можете изменить пять базовых экранов, а также добавить новые разрешения или убрать лишние.
Zero block — блок, где можно редактировать каждый элемент и создать свой уникальный дизайн. Вы сами определяете, как будет выглядеть нулевой блок на разных устройствах и адаптируете его вручную. Раньше пользователи могли адаптировать дизайн только для базовых разрешений: 320, 480, 640, 960 и 1200px. Теперь вы можете настраивать эти значения и редактировать дизайн под необходимые размеры экранов.
Когда может пригодиться гибкая настройка разрешений
1. На сайт заходят с устройств с нестандартными расширениями экрана
В таком случае вы можете заменить базовые размеры экранов на собственные и добавить новые, например, контрольную точку 390px для iPhone 12 pro или 1024px для iPad Pro. Максимум можно настроить десять контрольных точек. Также теперь есть возможность удалять базовые разрешения, неактуальные для вашего сайта, например, горизонтальный планшет или телефон.
2. Ваш сайт часто посещают с компьютеров или ноутбуков, имеющих большое разрешение, например, 1920px, и вы хотите для каждого элемента добиться идеального расположения на таком экране
Чтобы управлять размерами и расположением элементов на экране в 1920px, добавьте это разрешение в настройки и доработайте дизайн блока. Вы можете точно указать, где будут находиться текст, шейпы и изображения относительно grid-контейнера — рабочей области. Автоскейл или вёрстку по window-контейнеру в этом случае можно не использовать.
Можно ли теперь не использовать window-контейнер и автоскейл в своих проектах
Благодаря новой функции вы можете верстать сайт с привязкой к grid-контейнеру и не разбираться в особенностях резиновой вёрстки или автоскейла. Но мы рекомендуем изучить все инструменты, чтобы уметь их комбинировать и применять в зависимости от задачи.
Примеры сайтов, где использовали настройку разрешений экранов
https://reforma-lab.com/kurs-mgimo-3month адаптировали дизайн под разрешение 1920px
Уже использовали в своих проектах настройку разрешений экранов в Zero block? Поделитесь впечатлениями в комментариях.
Подписывайтесь на наш телеграм-канал, чтобы первыми узнавать о новых функциях.
Когда разрешение мобильного устройства (>= iphone 13 pro / pro max, например) по горизонтали приближается к разрешениям планшета, то на телефоне в горизонтальном режиме подкидывается вертикальная планшетная версия из Zero Block, как это пофиксить? Стандартными диапазонами в верхней панели, но как? Она только горизонт учитывает, но не пропорцию экрана! Вот если бы разработчики добавили в эти диапазоны еще и пропорции, наверное как-то проще было бы. Пока вижу решение через JavaScript, но это костыль, должно из коробки все работать, это же конструктор. T_T