Каков типичный размер области просмотра на экране 1024x768?

Question

Я занимаюсь разработкой веб-приложения и хочу знать, какой самый большой размер (x и y) я могу разработать.

По состоянию на январь 2008 года около половины пользователей используют экраны 1024x278, и, вероятно, менее 10% используют экраны меньшего размера. (Пользователи телефонов и карманных компьютеров являются здесь исключением.) Поэтому мы проектируем минимальный размер экрана 1024x768.

Однако , это размер экрана, и когда мы выкладываем наш контент, нам нужно знать размер viewport . Есть свидетельство , что у большинства пользователей развернут браузер, но все равно нужно вычесть пространство для украшений ОС и хрома браузера. Люди настраивают свой хром, поэтому нет единого «правильного» ответа; Я иду на разумную границу, которая будет соответствовать большинству пользователей.

Я вижу множество дизайнеров , которые говорят, что они используют ширину 960 пикселей, потому что она имеет много факторов и может быть равномерно разделена - но прежде чем принять решение об этом, я хочу узнать максимальный размер , с которым я могу справиться, тогда я мог бы использовать несколько меньше. Я видел максимальную ширину 960, 974 или даже 990 в кавычках ... мои собственные эксперименты, кажется, показывают ширину 1000 работ. ОК.

Высоты еще труднее найти: я считаю, что могу подойти к вертикальной области просмотра, высотой 595 пикселей, в браузерах, которые я пробовал, со стандартными настройками ОС и хрома по умолчанию. Но я не очень много пробовал, и я бы предпочел увидеть более авторитетный источник. Конечно, кто-то еще сделал это исследование и сделал это лучше меня.

Итак, мой настоящий вопрос заключается в следующем: какой самый большой размер области просмотра я могу проектировать и ожидать, что он будет соответствовать без полос прокрутки для 80-90% всех пользователей?

Answer 1

Сегодня я только что наткнулся на сайт, который НАСТОЯТЕЛЬНО относится к этому моему старому вопросу. Очевидно, Google готов поделиться своими знаниями о размерах окон браузера. Их новый сервис - http://browsersize.googlelabs.com/, и он в основном просто показывает вам их данные о типичных размерах портала браузера.

Примечание : Размер браузера Google Labs сейчас очень устарел (изображение называется 2009-11-18-day_google_com_100_donate_example.png), и скоро будет закрыто . Google предлагает использовать Google Analytics для определения размера браузера для вашего собственного сайта: http://analytics.blogspot.ca/2012/06/new-feature-conduct-browser-size.html

Answer 2

Подавляющее большинство пользователей смотрят на Интернет в IE7 в развернутом окне на экране 1024x768 и не модифицировали свой браузер. Поэтому я нашел морскую свинку и сделал снимок экрана. Я предположил, что панель задач была одной строкой и видимой - опять же поведение по умолчанию - и получил размер окна 1003 x 589 . Я бы использовал живую область 960 x 560, лично.

Answer 3

Убедитесь, что ваш сайт будет отображаться с разрешением 800x600, но увеличьте его до размера, который имеет пользователь.

Нет ничего более раздражающего, чем серфинг в разрешении 1600x1200 или больше, только для того, чтобы наткнуться на тупой участок, который не растянется на ширину 700-800 пикселей.

Посмотрите на человека в синем, чтобы показать, как справиться с изменениями размера страницы ... http://themaninblue.com/experiment/ResolutionLayout/

Обновление: Я нашел хороший сайт, который использовал некоторые статистические данные, чтобы определить, какой процент пользователей может видеть экраны какого размера: http://www.methodologie.com/webcanvas/

Answer 4

Для всех пользователей XP IE7 с шириной боковой панели по умолчанию, открытой в полноэкранном режиме XGA, ширина области просмотра составляет 862 пикселей. Высоты не так важны, как мы ожидаем прокрутки по вертикали, но необходимость прокрутки по горизонтали также является смертью.

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

(Что это такое, переполнение стека? Правда? Шокирующее, цв.)

Answer 5

Я сейчас на нетбуке Acer с разрешением экрана 1024х600. Помните, что мы растущий сегмент рынка! (или, по крайней мере, постарайтесь, чтобы ваша вертикальная недвижимость принимала 768 как минимальную высоту экрана)

Answer 6

Это, кажется, недавно, подумал, что я упомянул это, нашел это, прочесывая сети ...

http://www.nealgrosskopf.com/tech/thread.php?pid=43

Answer 7

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

Теперь нам нужно признать растущее число смартфонов с различными размерами экрана, нетбуков, iMac с широкими экранами, сетчатки, (Android / Mac) планшетов и т. Д. И т. Д.

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

Теперь нам нужно device-specific style with a tap-based UI for handheld devices with fixed browser sizes и fluid-responsive style with mouse-hover effects etc. for desktop computers.

Это должно быть в центре внимания сегодня.

В этом смысле ответ на ориг. вопрос не может быть легко дан больше. Очень распространенный экран 1024x768 вполне может быть iPad - или уменьшенным окном браузера.

Answer 8

1007px - это абсолютный максимум, с которым вы можете работать в Internet Explorer ( детали ) без горизонтальных полос прокрутки. Но, тем не менее, я думаю, что вы не должны идти на максимум, если вам не нужно. Скорее полагайтесь на предположение, что браузеры многих людей не максимизированы.

Google's Размер браузера - отличный инструмент.

Answer 9

Просто подумал, что добавлю, что приложение Mint stats Шона Инмана имеет плагин , который отслеживает размер окна, а не разрешение экрана, и учитывает наихудший браузер Chrome. Затем он группирует результаты, так как x% посетителей имеют ширину окна> y% или> z% высоты, что может быть очень полезно для принятия обоснованных решений о конкретном сайте, и выводит некоторые из предположений из процесса.

Answer 10

Я нахожусь на экране ноутбука WUXGA от Sony (1920x1200).

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

Я просто хотел бы, чтобы stackoverflow обнаружил мой широкий экран и показал мне предварительный просмотр ответа в правом столбце.