Адаптивность. Нужна помощь с нюансами

Всем привет!

Раньше рисовала только макеты 320, 768 и 1440px. Разработчик забирал и сам с ними что-то делал
На последней работе узнала про брейкпоинты и адаптивность шрифтов
взяв за пример вот эту и эту статьи, принялась делать кит и полностью запуталась.
вопросы:

  1. надо ли учитывать размеры мониторов больше 1920px - 2560, 3840px?

  2. нет представления, как должна меняться сетка при изменении ширины экрана. буквально - что происходит с сеткой, когда экран увеличивается на 10, 11, 12px? какого размера становятся колонки, гаттер и поля в процессе?

  3. как объяснить эти изменения сетки разработчикам в динамике?

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

  5. есть ли методы быстрее работать над адаптивностью? и не сойти с ума при этом)))

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

инонигегме3

5 симпатий

Я для 2к мониторов просто отрисовываю размеры и состояния блоков, которые растянуты на весь экран (баннеры, например).
Остальной контент не трогаю: кнопки, шрифты — оставляю как для фулл хд.

1 симпатия

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

https://clippings.com/ как видишь в примере макс разрешение 1440 (не берем главную картинку на вылет), три брейкпоинта и две шрифтовые системы и то меняются только заголовки, кнопки и базовый текст остается неизменным.

Вообще дальше 1920 смотреть нет смысла, а мониторов 3840 нет. Вернее такое физически разрешение есть, но на самом деле это и есть ретина 3840/2=1920.

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

2 симпатии