Перейти к содержимому



Какая ширина сайта оптимальна?

#1 Olenka
Olenka
  • Неактивные
  • 23 сообщений
  • Репутация: 0
0

Отправлено 27 Октябрь 2012 - 12:13

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

 

 

  • 0

#2 sae
sae
  • Неактивные
  • 269 сообщений
  • Репутация: 80

Отправлено 27 Октябрь 2012 - 15:47

Olenka, существует на мой взгляд 2 основных подхода определения ширины сайта:

1. Фиксированная верстка.

пример: Вконтакте

Ширина задается в определенном количестве пикселей, чуть меньше горизонтального показателя самого популярного разрешения. Как правило от 900 до 1000 пикселей, чтобы все уместилось на пятнашках и нетбуках (1024x768 и 1024x600), а также на семнашках и ноутбуках среднего класса (1366x768).


2. Адаптивная верстка

пример: Газета.ру

Ширина всех или части элементов задается в процентах, чтобы сайт заполнял все пространство монитора/дисплея смартфона или планшета. Такой вариант подходит, на мой взгляд, только для сайтов с большим количеством контента и различных блоков информации. Иначе все вытянется в длинную узкую соплю на 1920 пикселей ^_^.

Есть конечно и варианты, когда стили сайта устанавливаются для каждого разрешения разные через javascript. Или когда задается минимальная и максимальная ширина (допустим от 1000 до 1600 пикселей). Тогда сайт растягивается в пределах данных показателей.
  • 0

#3 Mosha
Mosha
  • Неактивные
  • 21 сообщений
  • Репутация: 2

Отправлено 27 Октябрь 2012 - 16:59

Насколько мне известно нормальная ширина от 960 до 1000 пикселей. А, с другой стороны оптимальный размер для каждого пользователя разный, но лучше ориентироваться на большинство, я так думаю. Поэтому ориентир делать надо на разрешение экрана 1024*768
  • 1

#4 ivanovna
ivanovna
  • Неактивные
  • 21 сообщений
  • Репутация: 0

Отправлено 28 Октябрь 2012 - 14:19

А если сайт уже готов, то как-то можно выяснить ширину, с которой он сделан? А то может быть у меня неправильная, мне о ей, вообще, ничего не говорили.
  • 0

#5 sae
sae
  • Неактивные
  • 269 сообщений
  • Репутация: 80

Отправлено 28 Октябрь 2012 - 15:07

ivanovna, существует два варианта ^_^:

1. Вы даете ссылку на ваш сайт, и здесь вам скажут, какая у вас ширина и тип верстки.

2. Кликните по основному блоку с информацией на вашем сайте правой кнопкой и выберите Просмотр кода элемента или Проинспектировать элемент или Исследовать элемент в зависимости от браузера. Внизу откроется окошко с текстом верстки. Поводите по её элементам курсором мыши, и когда будет подсвечен основной блок )ширину которого надо узнать), то в правом верхнем углу блока должен быть и его размер (ширина - это первый показатель).
  • 0

#6 ssabbass
ssabbass
  • Неактивные
  • 280 сообщений
  • Репутация: 33

Отправлено 14 Октябрь 2013 - 01:16

А то может быть у меня неправильная, мне о ей, вообще, ничего не говорили.

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

#7 Diablero
Diablero
  • Неактивные
  • 36 сообщений
  • Репутация: 6

Отправлено 21 Октябрь 2013 - 12:56

Насколько мне известно нормальная ширина от 960 до 1000 пикселей. А, с другой стороны оптимальный размер для каждого пользователя разный, но лучше ориентироваться на большинство, я так думаю. Поэтому ориентир делать надо на разрешение экрана 1024*768


Полностью поддерживаю Mosha. Я обычно при создании сайтов брал ширину 1100 пикселей (считая минимальную ширину современных мониторов 1280). Не так давно я четко и ясно осознал, что поторопился с мыслями о том, что у большинства уже минимум 1280, так что лучше брать максимальную ширину не адаптивной верстки 1000 пикселей.
  • 0

#8 narolskay
narolskay
  • Пользователь
  • 773 сообщений
  • Репутация: 35

Отправлено 21 Октябрь 2013 - 14:50

Сайты на мой взгляд по ширине 900 пикселей смотрятся старомодно, да и грех не воспользоваться лишними пикселями в пользу своего сайта.
  • 0

Ищете хостинг?  Beget.ru - месяц бесплатного тестирования, бесплатный перенос сайта!

 



#9 ssabbass
ssabbass
  • Неактивные
  • 280 сообщений
  • Репутация: 33

Отправлено 21 Октябрь 2013 - 19:10

Сайты на мой взгляд по ширине 900 пикселей смотрятся старомодно, да и грех не воспользоваться лишними пикселями в пользу своего сайта.

900 можно и расширить до 1000, но НЕ более. 1000 (ширина сайта) + 24 (вертикальная прокрутка браузера) = 1024 пикселя - оптимальная ширина! Ведь мониторы 1024х768 еще стабильно используются. Например, у меня такой :)
  • 0

#10 WhiteIce
WhiteIce
  • Неактивные
  • 30 сообщений
  • Репутация: 2

Отправлено 21 Октябрь 2013 - 23:49

Для фиксированных дизайнов не более 1000px, например есть стандарты 990 или 960 (чтобы удобно было делать колонки кратные / 2,3,4,6,12).
Мне нравится вариант с резиновой шириной, (если нет никаких противоречий с концепцией дизайна=), от 1000 до 1400px, потому что на мониторах >21" ширина 1000px уже выглядит не очень - на широкоформатном мониторе посредине сайт и по бокам пустое пространство почти такого же размера
  • 0

#11 ssabbass
ssabbass
  • Неактивные
  • 280 сообщений
  • Репутация: 33

Отправлено 22 Октябрь 2013 - 04:11

Моя статистика по расширениям экрана за октябрь - на скриншоте.

Как видно, минимальное значение ширины, на которое стоит ориентироваться, - 1024 (т.е. та же самая 1000 + прокрутка). При этом данная ширина занимает в общем рейтинге 3-ю позицию и лишь немногим уступает 2-му месту (примерно 15% и 14%).

Прикрепленные изображения

  • Безымянный.JPG

  • 0

#12 ugo7
ugo7
  • Неактивные
  • 5 сообщений
  • Репутация: 0

Отправлено 12 Ноябрь 2013 - 15:48

Сколько шаблоном со статическим дизайном сайта не перебрал, на всех стоит ширина по умолчанию от 900 до 1000, в основном 960 пикселей. Я люблю десятичные круглые числа, поэтому всегда беру 1000.))
  • 0

#13 ssabbass
ssabbass
  • Неактивные
  • 280 сообщений
  • Репутация: 33

Отправлено 14 Ноябрь 2013 - 01:57

А даже если вам 960 не по душе, то кто мешает в нужном месте изменить цифру "960" на "1000"? И можете брать любой шаблон! :)
  • 0

#14 fedornabilkin
fedornabilkin
  • Модератор
  • 1 181 сообщений
  • Репутация: 203

Отправлено 14 Ноябрь 2013 - 06:39

Я хотел бы уточнить, что адаптивная верстка - это не когда размеры указываются в процентах.
Размеры в процентах - это вариант резинового дизайна, а адаптивный дизайн/верстка подразумевает изменение положения основных блоков сайта, в зависимости от разрешения.
  • 0

Надо обсудить предложение. А тут знакосчиталка считает знаки. Про Yii2 написано.



#15 web_driver
web_driver
  • Неактивные
  • 4 сообщений
  • Репутация: 1

Отправлено 14 Ноябрь 2013 - 11:56

На первое время можно сделать и в 900 пикселей шириной. Потом по статистике посещений посмотрите с какими мониторами именно к вам будут чаще заходить и выберете наиболее подходящий для себя и своей тематики вариант. Если у вас сайт например содержит много фото и широкоформатных изображений, то какой тогда смысл делать его ширину слишком ужатой? А так... адаптивный дизайн, как было упомянуто ранее может быть оптимальным решением.
  • 0

#16 uselect
uselect
  • Неактивные
  • 2 сообщений
  • Репутация: 0

Отправлено 19 Декабрь 2013 - 18:43

оптимальная ширина - от 500 до 2000 пикселей. На все типы мониторов.
  • 0

#17 temp-market
temp-market
  • Неактивные
  • 45 сообщений
  • Репутация: -3

Отправлено 07 Февраль 2014 - 22:51

больше 1000px не нужно
  • 0

robot
robot
  • Пользователь PRO
  • 2 652 сообщений
  • Репутация: 85


Похожие темы
  Название темы Автор Статистика Последнее сообщение

Пользователь месяца
BLIK BLIK 1-й за Ноябрь
Очков активности: 672 0 тем, 32 сообщения, 14 баллов репутации
ТОП самых активных за этот месяц
  • Фотография Totti
    #1

    Totti
    Очков активности: 105 0 тем, 14 сообщений, 5 баллов репутации

  • Фотография BLIK
    #2

    BLIK
    Очков активности: 63 Вне конкурса за определение пользователя месяца

  • Фотография Victim
    #3

    Victim
    Очков активности: 60 0 тем, 8 сообщений, 5 баллов репутации

  • Фотография akmid81
    #4

    akmid81 (biznessystem.ru)
    Очков активности: 57 3 темы, 10 сообщений, 2 балла репутации

  • Фотография Vmir
    #5

    Vmir
    Очков активности: 51 1 тема, 14 сообщений, 2 балла репутации

  • Фотография MattCutts
    #6

    MattCutts (dmitrylee.ru)
    Очков активности: 30 Вне конкурса за определение пользователя месяца

  • Фотография FIvYUr
    #7

    FIvYUr (moy-evroopt.ru)
    Очков активности: 25.5 0 тем, 17 сообщений, 1 балл репутации

  • Фотография TimurR
    #8

    TimurR
    Очков активности: 21 3 темы, 5 сообщений, 1 балл репутации

  • Фотография Rodiola
    #9

    Rodiola (rukodelkovo.ru)
    Очков активности: 16.5 Вне конкурса за определение пользователя месяца

  • Фотография kolver
    #10

    kolver
    Очков активности: 15 1 тема, 7 сообщений, 1 балл репутации

  • Показать весь ТОП 10
Поддержите форум! =)
Апдейты
  • Яндекс ИКС: 29.11.2019
  • Яндекс выдача: 15.12.2019
Топ 5 участников по репутации

Оформление форума – IPBSkins.ru