Добро пожаловать на ИТ форум!

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

Регистрация

Разница между разрешением экрана планшета и браузера

Статус
Закрыто для дальнейших ответов.

Erik-lv

Новичок
Регистрация
25.07.2018
Сообщения
1
Возникла проблема при тестировании сайта на планшете. Дизайн, рассчитанный на данное разрешение, не отображается. Планшет Lenovo 8 дюймов 800х1280, все стандартное (Андроид, Хром), со всеми апдейтами.

Проверил разрешение онлайн. Разрешение экрана 800х1280, а разрешение браузера 601х794, т.е. существенно меньше. Вот по этому разрешению и загружается сайт, т.е. версия для смартфонов.

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

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

Я проверил еще с нескольких планшетов, с аналогичным результатом. Например, на 7 дюймовом планшете при вертикальном просмотре ширина экрана 800 пикселей, а разрешение браузера - 536. Соответственно дизайн для 768 пикселей не отображается.

Разбираясь в проблеме, я выяснил, что все браузеры используют авто-масштабирование. Оно зависит от диагонали экрана и тем сильнее, чем диагональ меньше. В Мозиле я даже нашел способ убрать эту функцию, изменив один параметр в конфиге. Только после этого разрешение браузера совпало с физическим и я увидел нужный дизайн. Это по факту значит, что физические разрешения 766 и 1024 неактуальны, так как в браузере они существенно меньше. Разработчик несогласен.

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

Может кто-нибудь объяснить это противоречие между теорией и реальностью?
 

Вложения

BaNru

Пацифизжу
Регистрация
13.11.2010
Сообщения
3 924
Erik-lv сказал(а):
Разработчик утверждает, что все сделал праильно, для самых популярных стандартных разрешений 768х1024, проверил на адаптивных сайтах, все должно работать. Он уверен, что разница в разрешении экрана и браузера - индивидуальная проблема.
Значит плохой у вас разработчик. Адаптивный дизайн на то и адаптивный, чтобы подстраивался под 99% разрешений (в данном случае не экрана, а страницы, то есть браузера). Адаптивные вёрстки подстраиваются под большинство разрешений, начиная с 320px по ширине и до.... оговаривается отдельно и зависит от макета, обычно заканчивается в районе 720p (~1200px), но может быть и до 4K (4096px), если это оговорено отдельно.



Erik-lv сказал(а):
Разбираясь в проблеме, я выяснил, что все браузеры используют авто-масштабирование.
Попробуйте добавить в HEAD вашего файла такую строчку

<meta name="viewport" content="width=device-width, initial-scale=1" />

Erik-lv сказал(а):
Для проверки разрешения использовал сайт
Забудьте про эти сайты, это как корове пятая нога. Как говорит Татьяныч: "нет ничего лучше бразуера для проверок" (не дословно). То есть проверять лучше на настоящих устройствах и браузерах.

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

В Firefox - нажать CTRL+M, в хромоподобных (и вроде в Сафари тоже есть) F12 и там значок в виде телефона (сейчас название кнопки не скажу, только что переустановил ОС на новый HDD, сижу без многих программ ещё), в IE последних версий тоже есть подобное в "Инструментах разработчика" кнопочка похожая. Там можно "играться" разрешениями и некоторыми другими параметрами.
 
Статус
Закрыто для дальнейших ответов.
Верх Низ