Оптимальная ширина элементов сайта

grid (сетка) и все само масштабируется. это самый простой вариант.

Media queries. Пишешь CSS правило для обычных размеров, а для случая, когда места слишком мало, выводишь не колонками, а вертикально.

Почему бы не использовать какой-нибудь responsive framework?

Лень и страх перед всем новым в целом.
И отсутствие конкретных рекомендаций по фреймворкам от тебя в частности.

Media queries

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

для случая, когда места слишком мало

Я вот еще думаю, насколько будет допустимо разъехаться, если места наоборот слишком много.

И отсутствие конкретных рекомендаций по фреймворкам от тебя в частности.

Я бы порекомендовал тебе Bootstrap, если бы использовал его responsive-фичи, а не только сетку и стили. Ещё про Foundation хорошее слышал.

любой responsive фреймворк, обычно разрешения абстрагируются до неких классов .phone .tablet .pc .no-phone .no-tablet .only-phone и т.д. и т.п.

Да ладно лень, что там писать то. Что-нибудь в духе

.sidebar { float: right; width: 100500px; }
.content { margin-right: 100508px; }

@media all and (max-width: 300px) {
  .sidebar { float: none; width: 100%; }
  .content { margin-right: 0; }
}

Что касается сжатия — min-width на html?

Я вот еще думаю, насколько будет допустимо разъехаться, если места наоборот слишком много.

Ну, скролл то есть. Неприятно, конечно, но что делать.

Есть не мода, но некоторая тенденция вместо px использовать em

«Сеточный» дизайн (точнее layout) с уклоном в резиновый, расположение группы элементов через html-списки.

Как ни извращайся, но альбомная и портретная ориентация отображающих устройств это постоянные спутники (хотя большинство использует альбом и собственно весь вопрос в масштабах устройства) + широкоформатные мониторы. С этим более менее могут справиться «резиновые дизайны» и возможности zoom + наверное адаптивная подстройка размеров на клиенте (js, css) + разумный минимализм.

Да вопрос не в том, каким инструментом нужно пользоваться, чтобы сделать правильно. Вопрос больше в поиске конкретных чисел, т.е. значений ширины блоков. Например «если экран 96dpi имеет ширину 1920px, то не нужно размазывать основной текст шире, чем на 900px, ибо у юзера разбегаются глаза и его тошнит».

Я и сам стараюсь где можно указывать размеры в em и pt, наплевав на пиксельную идентичность отображения сайта в разных браузерах. Но «моды» на это никогда не замечал, поэтому у меня всегда было ощущение, что я что-то делаю не так.

вместо px использовать em

Это те самые, которые сначала делают html { font-size: 80% }? Если они, то расстрелять.

«если экран 96dpi имеет ширину 1920px, то не нужно размазывать основной текст шире, чем на 900px, ибо у юзера разбегаются глаза и его тошнит»

4.2 Я вот читаю ЛОР во всю ширину и у меня всё нормально. Прекращаем решать за пользователя что ему нужно. А уж в дизайне с колонками и подавно. Сайт это не газета и не книга.

Вы как товарищ Сталин:3

У меня просто плохое зрение и эти (неразборчиво) мешают мне спокойно жить. Понапишут микроскопические тексты, а потом тяфкают про 80 символов в ширину.

Прекращаем решать за пользователя что ему нужно.

Злой ты. И не очень умный, все-таки. Был бы поумнее - понял бы, что на ЛОРе за тебя решили насчет размера шрифта как минимум.
А я пошел курить забытый WCAG.

На ЛОРе размер шрифта зависит от дефолтного размера шрифта в браузере. Инжой ё бухурт. Also, у меня Stylish.

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

Можешь в браузере указать минимальный размер, однако ж большинство поплывёт.

Я в курсе. Предпочитаю Stylish, т.к. могу. Но эта проблема, которую создали идиоты.

угу, потестируй ЛОР в диагоналях 32-55-60 на FullHD, так весело, что <table></table> покажется самой вменяемой версткой.

Теперь мне очень интересно узнать, как ум зависит от того

Ум, чувак, не «зависит от того», но, например, проявляется в уместности употребления словечек наподобие «тяфкают» и «идиоты» и «бухурт».

дефолтный шрифт (medium) как раз такой, каким должен быть основной текст

А каким «должен быть основной текст» это, стало быть, пришло к нам с небес, а не «идиоты решили за пользователей», да.
Я-то наивно думал, что ты только в толксах такой, ммм, _особенный_. Если тебя не затруднит, покинь, пожалуйста, тему.

Что «угу»? При чем здесь ЛОР?

Каким «должен быть основной текст» это настроено пользователем в браузере.

Т.е. по теме ты ничего не понимаешь, но виноват кто-то другой? И этот человек мне говорит про особенности, лол.

я думаю привязываться к конкретной ширине это немного моветон

Каким «должен быть основной текст» это настроено пользователем в браузере.

Бугогагага.

по теме ты ничего не понимаешь

Не меньше тебя, чувак. А ты склоняешь меня к мнению, что больше.

Хорошо, согласен, хрен с ними с пикселями. А если ширина задается в относительных единицах, то почему нет, кмк.
Тогда топик имеет целью поиск тех самых типографских заповедей на тему «строка длиннее 80 символов читается с трудом». которые нанесли травму одному персонажу, которого я имел неосторожность скастовать.
Может, встречал где-нибудь такие заповеди, заточенные под веб?

Собственно, вопрос: какие нынче модно делать размеры и пропорции у двух- или трехколоночных страниц, чтобы они отобржались на всем этот

Как правильно сказали, модно делать media queries. Вопрос скорее в том, на каком этапе сгонять всё в одну колонку, и так далее. То есть какие граничные размеры для этих media queries использовать.

Можно подсмотреть в бутстрапе, например. Если не ошибаюсь, максимальную ширину они делают около 1200px, затем, если экран меньше, 1000px, затем 800, а после выводят всё в одну колонку и разрешают ей сжиматься по-максимуму. В принципе, решение вполне разумное, правда в некоторых случаях, имхо, можно оставлять колонки и для более мелких размеров экрана, но это от дизайна зависит.

Я обычно ориентируюсь на то, чтобы на примерно 400px оно смотрелось более-менее юзабельно, и без горизонтального скролла (абстрактный смартфон с портретной ориентацией), затем где-то на 600-800 возвращаю колонки, а дальше только меняю максимальные размеры. В этом случае нужно один раз прикинуть, как оно будет в одну колонку, и один раз - в несколько, так меньше стилей перекручивать. Если сайт с каким-нибудь извращённым расположением колонок, то можно придумать что-нибудь вроде «сначала 1, затем 2, затем 3», но это если не лень.

Самую максимальную ширину контента выбираю на глаз по своему 23" монитору с 1920x, на пользователей с большими экранами мне пока наплевать:)

Как правильно сказали, модно делать media queries.

Это, кстати, сказал чувак, который оказался неспособен понять, что уточнение «желательно, без допиливания стилей под каждую железку» - оно именно об этом.

Вопрос скорее в том, на каком этапе сгонять всё в одну колонку, и так далее. То есть какие граничные размеры для этих media queries использовать.

Вот-вот-вот, уже ближе. Попробую сориентироваться на твои числа. Спасибо.

Если для тебя media queries это «допиливание стилей под каждую железку», то ты ничего не понимаешь в веб-девелопменте. Вон из профессии.

http://www.artlebedev.ru/kovodstvo/sections/177/

я очень невнимательно читаю топик, но что под ширину что под пропорцию адаптировать один хрен, ты что под каждый девайс его делать собрался?

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

Вон из профессии.

Это хобби, чувак. Расслабься уже.

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

Ты сперва дождись, чтобы тебя отпустило, а потом я внимательно выслушаю все твои намеки.
А то сперва советуешь мне media queries для заточки сайта под железки с разными размерами экранов, а потом оказывается, что за такое надо «вон из профессии», причем «вон» надо не тебя, а почему-то меня.
Очень ты ценный кадр. Вопрос: «как избежать заточки сайта под разные экраны?» Ответ «используй media queries, чтобы заточить сайт под разные экраны».
Это я здесь упоролся, да.

Ты лучше почитай про media queries. Там не нужно под _каждое разрешение_ делать. Думай ещё.

Там не нужно под _каждое разрешение_ делать.

Первооткрыватель америк снова въезжает в тред на изобретенном им велосипеде.

Да да Оптимальная ширина элементов сайта (комментарий)

все должно уместиться в 800х640