Какой ширины я должен придерживаться при создании веб-сайта? [дубликат]

Размер экрана

Более высокие разрешения экрана в конечном итоге делают все меньше.

Очень небольшой процент интернет-пользователей все еще использует более старые разрешения, такие как когда-то популярные 800×600.

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

| Website                 | Max-Width |
|-------------------------+-----------|
| Stack Exchange Websites | 980px     |
| facebook.com            | 980px     |
| yahoo.com               | 990px     |
| msn.com                 | 970px     |
| wikipedia.com           | 100%      |
| walmart.com             | 720px     |
| bestbuy.com             | 790px     |
| apple.com               | 985px     |

Хотя важно учитывать новейшие устройства, я считаю, что оптимальная ширина веб-сайта по-прежнему составляет 960 пикселей. Эта ширина подходит для большинства устройств и позволяет вашему сайту хорошо вписываться в широкие экраны как 1024px, так и 1366px.

960 делится на 2, 3, 4, 5, 6, 8, 10, 12 и 15. Это мечта для создания идеального сайта сетки. Это приводит к популярному ресурсу под названием «Система сетки 960».

Читабельность

Блог, новостной сайт или любой другой тип сайта, ориентированного на контент, учитывают читабельность.

«Идеальная длина строки для макета текста основана на физиологии человеческого глаза. На нормальном расстоянии чтения дуга поля зрения составляет всего несколько дюймов — примерно ширина хорошо оформленного столбца текста или около 12 слов в строке».

Скорость чтения и удержание снижаются по мере увеличения ширины столбца. Широкую страницу читать гораздо труднее, чем небольшую колонку текста. Для веб-дизайнера учитывайте размер шрифта и разрешение. В большинстве случаев безопасная ширина столбца для чтения составляет от 400 до 700 пикселей, и выбор правильного размера шрифта очень поможет вашим читателям.

Настоящий вопрос заключается не в том, «какой размер документа?» но "какая ширина документа?".

Я бы порекомендовал дизайн с размером 1440 x 900 пикселей, таким образом, вы находитесь в среднем размере браузера (поместите некоторые направляющие в 1000 пикселей для небольших браузеров и iPad).

Не останавливайте свой дизайн на 1000 пикселей, остановите свой контент на 1000 пикселей.

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

Вы должны использовать сетку в своем дизайне, это не обязательно, но поможет вам в нескольких вещах:

• Имейте одинаковую ширину столбца между каждым разделом, одинаковый зазор
• Было бы проще преобразовать его в css, если вы планируете использовать систему сетки.

(Вы можете установить плагин Photoshop для создания сетки или скачать .psd со всеми руководствами)

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

Обычно пользователи теперь пользуются браузером с разрешением 1024 x 768 или больше. Обычно допустимо использовать 1000 пикселей в качестве максимальной ширины.

Я в основном использую мокапы шириной 1100 пикселей, даже если я проектирую для разрешения 1024 пикселей. Я настроил направляющие в макете на 1000 пикселей. Поскольку весь контент поставляется со мной, высота может варьироваться.

как только вы проверите http://960.gs/