Блог

Для веб-сайтов, отображаемых в Chrome в Windows 10 v1909, всегда изменяется ли ширина окна просмотра веб-сайта в зависимости от значения параметра масштабирования и макета Windows 10 (см. Настройки> Дисплей> Масштабирование и макет), когда для width значения мета-тега viewport установлено значение device-width ?

Я только что купил новый монитор сверхвысокой четкости (UHD) 3840 x 2160 4K, думая, что веб-сайты, которые я разрабатываю, будут отображаться с шириной 3840 пикселей. Но когда я проверил элементы заголовка с помощью инструментов разработчика Chrome, ширина окна просмотра уменьшается по мере увеличения масштаба Windows 10. И поскольку я не могу прочитать текст для всего, что отображается на этом мониторе 4K UHD с разрешением 3840 пикселей в ширину (что происходит, когда масштабирование Windows 10 установлено на 100%), я увеличил масштабирование Windows 10 до 175%, чтобы я мог удобно читать текст . Но когда я увеличиваю масштабирование Windows 10, ширина окна просмотра моего браузера уменьшается в размере (например, при 175% масштабировании Windows 10 ширина окна просмотра моего браузера составляет 2195 пикселей). Я провел некоторые эксперименты, и вот ширина окна просмотра браузера, которая связана с конкретными значениями масштабирования Windows 10:

• 100% масштабирование … ширина окна просмотра 3840
• Масштабирование 125% … ширина окна просмотра 3072
• масштабирование 150% … ширина окна просмотра 2560
• масштабирование 175% … ширина окна просмотра 2195
• Масштабирование на 200% … ширина окна просмотра 1920

Причина, по которой я опубликовал этот вопрос, заключается в том, чтобы я мог понять, какой размер мне нужен для создания изображений при настройке веб-сайтов 4K. Я использую тему Avada WordPress для разработки всех моих клиентских веб-сайтов. Их рекомендации по настройке веб-сайтов 4K таковы:

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

Глядя на таблицу масштабирования Windows 10 и значений окна просмотра браузера, перечисленных выше, выясняется, что рекомендации Avada по ширине изображения применимы к мониторам 4K UHD ТОЛЬКО, когда Windows 10 масштабируется на 175% или выше (с небольшим увеличением дискретизации изображения, происходящим при масштабировании на 175%).). Поскольку масштабирование Windows 10 на мониторе 4K UHD на 150% является «сомнительным» с точки зрения возможности удобного чтения текста, а любое масштабирование менее 150% практически нечитаемо, похоже, что общее эмпирическое правило для ширины изображения на мониторах 4K UHD составляет 2600 пикселей. Эта ширина изображения будет покрывать масштабирование Windows 10 на 150% и выше.

При масштабировании Windows менее 150% изображение с разрешением 2600 пикселей будет увеличено, чтобы заполнить ширину окна просмотра. Однако мне кажется, что большинство людей будут масштабировать Windows 10 на мониторе 4K UHD как минимум на 150%, чтобы текст был читаемым (это большое предположение, которое, как я полагаю, определяет, насколько широкими должны быть мои изображения). Поскольку ширина окна просмотра, связанная с масштабированием Windows 10 на 150%, составляет 2560 пикселей, изображения, созданные с шириной 2600 пикселей, будут заполнять окно просмотра браузера без увеличения дискретизации (и возможной потери качества).

Правильно ли я понимаю взаимосвязь между масштабированием Windows 10 и шириной окна просмотра браузера? Правильно ли мое заключение о размерах всех изображений для дизайна веб-сайта 4K при ширине 2600 пикселей?