Почему размер телефонов на 2 раза больше, чем размеры мониторов, и что следует учитывать веб-дизайнеру при этом?

5 Answers

1. 0 Votes 0 Votes  0 Votes

   Почему плотность точек на площади поверхности экрана смартфона выше, чем на аналогичной по площади поверхности монитора — это решение, которое было принято производителями. Например, на нетбуке с диагональю 10-13″ разрешение экрана составляет 1366х768, а на смартфоне с диагональю 5-6″ – 2140х1080 (конечно, условно). Можно тратить много времени на обсуждение экранов Retina. И да, это создает проблемы для веб- и других проектов, связанных с экранами, если мы исходим из пиксельной вёрстки.

   Однако в дизайне и вёрстке (в CSS в частности) существуют относительные размеры. Они могут быть выражены в процентах или, например, в em (если мне память не изменяет). Лично я уже давно не занимаюсь вёрсткой, поэтому шрифты устанавливаются в em и всё тестируется.

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

   Однако лучше всего на этот вопрос сможет ответить практикующий веб-дизайнер или верстальщик. Работа в команде сильно расширяет понимание того, как всё устроено!

   - Окт 30, 2023 | Ответить

2. 0 Votes 0 Votes  0 Votes

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

   - Ноя 30, 2023 | Ответить

3. 0 Votes 0 Votes  0 Votes

   Основной приоритет веб-дизайнера — это мобильные пользователи, которых сейчас большинство. В любом случае, для верстки необходимо использовать изображение с высоким разрешением, если не векторное. Вопрос того, как правильно вывести изображение в браузер, нужного формата и размера, является вопросом верстки и настроек сервера. В настоящее время наилучшим решением является использование автоматизированных способов вывода изображений, при которых сервер самостоятельно генерирует набор различных размеров в зависимости от DPR и размера экрана и предоставляет WEBP в тех браузерах, которые его поддерживают. Затем, в зависимости от размера экрана, DPI и Pixel ratio, будет загружено правильное изображение в любом браузере.
   Следовательно, задача дизайнера — предоставить верстальщику изображение максимального качества.

   - Дек 24, 2023 | Ответить

4. 0 Votes 0 Votes  0 Votes

   Какое конкретное расширение вы имеете в виду? Если речь идет о расширении какой-либо части телефона, то оно может быть как выше, так и ниже по сравнению с мониторами. У разных телефонов и мониторов разные характеристики в этом отношении.

   - Янв 12, 2024 | Ответить

5. 0 Votes 0 Votes  0 Votes

   Это утверждение не совсем верно, разрешение практически одинаковое. Однако, плотность пикселей на экране (ppi, пикселей на дюйм) на телефонах значительно выше.
   Если бы плотность пикселей была ниже, то размеры пикселей были бы больше и они выглядели бы огромными, учитывая близкое расстояние до мобильного экрана.

   - Фев 10, 2024 | Ответить