Как верстать адаптив при масштабе >100% (на 2к мониторе)?

Question

[Павел Кизернис]

Собираюсь брать монитор и вот узнал, что на разрешении выше FullHD (т.е. шире 1920px) винда сама выставляет масштаб окон и шрифта в 120-130% для комфортного чтения.

У меня как-то был случай с заказчиком, у которого на буке (возможно мак с ретиной) был масштаб 130% в браузере и он видел планшетную версию сайта, вместо десктопной.

Специально привожу пример. Скажем вот эта страница:
lubus.ru/d/axiom/site/home.html

на 100% масштабе выглядит на ноутбуке с разрешением 1366х768 верно - это десктопная версия


но на 125% масштабе - это уже планшетная версия (на том же ноутбуке с разрешением 1366х768)


Мне интересно - это проблема возникает только на данном разрешении (1366х768), где нет необходимости в 125% масштаба или на 2к мониторе 25' будет тоже самое?

И если да то выходит, что такой монитор не удобен для верстки (как и ретина на макбуке)?

Comments

[xtala zen]

>>винда сама выставляет масштаб окон и шрифта в 120-130% для комфортного чтения.
Причем тут ось? Веб код обрабатывает браузер, а не винда.

[Ankhena]

xtala zen: Если в винде стоят настройки 125% (ну или не важно сколько, больше 100%), то некоторые браузеры эту настройку наследуют. В самом браузере при этом будет стоять 100%, но все будет увеличенное на %, указанный в винде.
По умолчанию увеличенный размер обычно бывает на ноутах с маленьким физическим размером и относительно большим разрешением. Например 11" и 1366 точек или 13" и 1920 точек.

Answer 1

[whoisthere]

Масштабирование это функция браузера. Версткой её никак не исправить. Её отключают если очень нужно (а это вредная привычка). Если такая ситуация случается, нужно объяснить это клиенту. Вы можете под него подстроиться, а всех остальных пользователей, которые пользуются 100% масштабом, отравить.

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

Comments

[Павел Кизернис]

Я же спрашивал не о верстке...
Меня интересует будет ли данная проблема (указанная на скринах) повторяться на 2к мониторе с масштабом в 130%?
Если да - то возможно проще брать full-hd монитор и разработкой заниматься на нем..

[Ankhena]

Павел Кизернис: ну Вы же %%, наверное, умеете считать в обе стороны?

[Павел Кизернис]

Ankhena W: Не понял вас

[whoisthere]

Павел Кизернис: Вообщем проблема будет на любом мониторе повторятся. На 2К мониторе потребуется больше масштаб, чтоб VIEWPORT сработал.

[Ankhena]

Павел Кизернис: расстраиваете
Ладно. Ну например, версия для планшетов должна срабатывать при окне меньше, чем 920 пикселей. Так написано в media. Если в в настройках поставим 125%. Значит сработает она при ширине окна браузера меньше чем 920х1,25 = 1150.

В обратную сторону: если экран 1366 точек по ширине (для простоты опустим наличие полосы прокрутки). А media для планшетов указана также 920 точек. 1366/920 = 1,484782608695652
Значит, если открыть браузер на полный экран при настройке 145% - покажется версия для десктопа.
Если поставить 150% - версия для планшетов.

В вашем случае, 2к монитор, 130% увеличение, будет показывать так, как будто он 2000/1.3 = 1538 точек.

У меня 13' ноут и 1920 разрешение экрана. Смотреть сайты, ярлыки, эксель и прочая деятельность - мелковато. Поэтому в винде стоит масштаб 125%. Но не все браузеры и приложения реагируют на эту настройку. Не обязательно работать и "жить" в одном и том же браузере. Благо у верстальщиков все равно их целая пачка стоит.
Ну и есть DevTools, показывающий как будет выглядеть адаптив на разных размерах вьюпорта.

Answer 2

[Abdula Magomedov]

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

Comments

[Иван Бабий]

Полностью согласен с автором выше. Сам юзаю такой способ проверки, ибо экран 1366х768, а верстку нужно делать адаптивной

[Павел Кизернис]

Естественно я в курсе этого (и использую тоже), но есть случаи, когда эта "опция" неудобна...

Answer 3

[Freeman]

У меня 2K-монитор, брал в том числе для изучения всех граблей с масштабированием. Версткой не занимаюсь, к сожалению. Для меня комфортным оказалось нестандартное масштабирование 111%, в большинстве случаев прибавлющее один пункт (pt) к размерам шрифтов, но не всегда. Бо́льшее масштабирование на 2K не имеет смысла, проще уж брать FullHD.