Существует ли стандартная ширина для разработки макетов веб-страниц?

Существует ли стандартный размер для ширины веб-сайта в макете? Что это за размер? Почему?

Комментарии к вопросу (2)
Решение

Я начинаю большинство своих макетов с ширины 1200px, даже если я разрабатываю их для разрешения 1024px. Я устанавливаю направляющие в макете на 1000px. Высота может варьироваться. Причина, по которой я делаю макет шире, заключается в том, чтобы посмотреть, как будет выглядеть дизайн, если вокруг него будет свободное пространство. Большинство людей в наши дни используют разрешение выше 1024px.

Комментарии (2)

Есть ли стандартная ширина для проектирования макетов веб-страницы?

Да, нет, возможно?

Давным-давно (см. ниже) веб-дизайн во многом пытались создать единое мнение, что бы достаточно хорошо подходят для большинства экранов. За последние пять лет, что кардинально изменилась с принятием отзывчивый веб-дизайн (RWD).

Заднеприводный-это принцип создания конструкции таким образом, что позволяет им достаточно хорошо подходят на *любое устройство, независимо от размера устройства.

В веб-разработки, медиа-запросы часто используются для применения различных наборов стилей для веб-страниц в зависимости от ряда факторов. Некоторые общие факторы включают:

  • текущей ширины экрана
  • текущая высота экрана
  • ширина устройства
  • высота устройства
  • ориентация устройства

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

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

С учетом сказанного, веб-индустрии развития органически придумать набор общих точек останова, которые происходят снова и снова.

Типичные точки останова на текущей ширины экрана, и, как правило:

<суб>единиц в ПКС</суб>

  • 320
  • 480
  • 768
  • 1024
  • 1200
  • 1600

Причина эти конкретные цифры довольно приземленные. Оригинальный iPhone имел экран размером 320&ампер;раз;480; оригинальный iPad имеет экран размером 768&ампер;раз;1024;&ампер 1600;времена;1200 общие для больших разрешений экрана.

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

Жидкости-ширину комп, который показывает сложены предметы на 768px по ширине, возможно, придется включить на 900 пикселей, где элементы перешли на две колонки. Если вы обнаружите, что вы должны предоставить много комплектов конструкций для этих промежуточных точек останова, я бы настоятельно рекомендуем проектирования отдельных компонентов и показывает на точки останова, где компонент изменения на уровне компонентной базы, в том числе без остальной страницы в макете.

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


Следующая старая версия этот ответ, который я сохраняю для потомков'ы ради, но он не был актуален в течение некоторого времени

Я'м удивлен, никто не упомянул эту еще:

У Google есть хороший инструмент под названием Развитие

Браузера

Он должен практически ответить на один ваш вопрос.

У меня есть несколько заметок о текущих тенденциях:

В настоящее время подавляющее большинство пользователей имеют разрешением 1024х600 (планшет/нетбук) или больше. Вы должны помнить, чтобы удалить о значение 24px` для полос прокрутки, которая оставляет хороший даже ширина 1000пк. Что касается высоты: веб-пользователи очень хорош в вертикальной прокрутке, как они'вэ вырос привыкший для прокрутки колеса мыши. Первоначальная высота важна в основном для первого впечатления.

Пользователи не очень хорошо в горизонтальной прокрутке, поэтому изготовление макетов шире, чем 1000пк не рекомендуется.

Также многие пользователи с большими экранами не использовать весь экран для своего веб-браузера. Особенно теперь, когда Windows 7 входит простой перетащить-Н-док-функциональность, чтобы удалить окно на половину экрана.

В резюме:

  • избегайте статических ширины более 1000пк
  • убедитесь, что ваше первое впечатление выглядит красиво на 1024х600
  • Дон'т бойся падение содержания под створкой.
Комментарии (2)

Короткий ответ: 775x400 для 800x600, а для 1024x768 используйте 1000x500.

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

Если я не могу показать ее на своем компьютере в нужном размере, я использую свои личные правила (не воспринимайте мои измерения как святые, у каждого они свои):

В качестве безопасного размера хорошо оптимизировать под 800x600 (убрав скроллбар и топбар, я использую 775x400 как "над строкой"). Но сегодня, когда экраны становятся все дешевле и шире, я начал проектировать под 1024x768 (1000x500).

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

ПРИМЕЧАНИЕ: Я использую такую низкую высоту даже на 1000px, потому что люди имеют тенденцию иметь много дополнительных полос прокрутки на основном браузере (как GoogleRank, например, или закладки, и многие-многие другие), поэтому я всегда люблю проектировать для худшей ситуации.

P.s. извините за мой плохой английский :)

Комментарии (1)

У нас есть программа слежения, которая сообщает нам информацию о наших пользователях. Более половины из них при разрешении 1024x768. Поэтому я использую, что как-то "Стандарт" и размер монитора.

Однако, что's не ваш живой уголок для вашего сайта &ампер;mdash; не люди имеют боковые панели, они не'т всегда открываю окно браузера на всю ширину и т. д.

Мне нравится в <а href="и http://960.gs/">системы 960 сетки</а>. Цифры являются гибкими и сайт содержит множество шаблонов для загрузки. Я использую это для моей модели, и все'ы были очень счастливы до сих пор.

Комментарии (2)

Мне пришлось бы искать статистику, подтверждающую мои слова (например, этот пост в блоге SO), но 1024x768 стало или становится стандартным общим знаменателем для разрешения экрана. Я разрабатываю веб-макеты для общей аудитории с шириной 1000 px, чтобы учесть полосы прокрутки и границы окна с разрешением 1024 px. Для более специфической аудитории Pekka'прав в своем комментарии. Выясните, что является нормой для целевой аудитории.

Комментарии (0)

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

Если вы'повторно делать место для сайта, чем большинство компьютеров сегодня (большинство из которых 90% или более) имеют минимальное разрешение 1024. Если вы хотите немного меньше компьютеров, но все равно хороший процент, чем 1200 тоже в этом диапазоне.

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

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

Комментарии (0)

Это полностью зависит от вашего сайта, как правило, я'д, Как правило, не выходить за 1000 для тех клиентов, на старых машинах. Однако исследования сейчас показывают, что при проектировании за 1200, сейчас вполне приемлемо в мире дизайна, поэтому он'ы пищу для размышлений наверняка.

Ваш план должен быть, чтобы поразить наименьшему общему знаменателю, и если это будет Джо динозавр на 800х600 Windows 95 компьютер то, что'ов, которые вы должны удовлетворить.

Также он полностью зависит от дизайна вашего сайта. Я'm В настоящее время разрабатывает веб-сайт для моего агентства и It's будет шириной 800, что для предпочтения, а не чтобы угодить кому-то конкретно.

Комментарии (0)

К сожалению, нет'т любой стандартный размер как веб-страницы теперь доступны в целый ряд проявлений. Хотя, чтобы быть на безопасной стороне, пожалуйста, исследования на наиболее популярных разрешениях (например, 1024х768) и дизайн на основе популярности.

Комментарии (2)

Ответ: Нет, нет 'Стандарт'.

Комментарии (2)

Я рекомендую использовать 960px по ширине шаблона, ведь большинство разрешение экрана 1028px , поэтому полосы прокрутки не появляются, и вы увидите фон, который вы использовали, а также.

Комментарии (0)

Я предлагаю вам использовать экрана 1024px для стандартной ширины. Так, максимальное количество ПК с ЭЛТ-монитора и разрешение монитора-1024*768px по.

Комментарии (0)