Как стать автором
Обновить

Комментарии 45

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

Такие фразы как например "пользователи с разрешением 640х480 пикселей" приводят в легкое недоумение. Я уже давно не вижу этих цифр, ни в глобальной статистике, ни в крупных проектах, которые делал/имею доступ.

Для мобильных устройств подключаются свои стили. Это совсем отдельная тема.

Недавно я писал на Хабре и у себя, что убежден в том, что пора уже ориентироваться больше на посетителей с резолюцией 1024х768 и выше, так как если верить цифре - более 20% посетителей сайтов имеют резолюцию выше 1024х768, и менее 10% посетителей все еще пользуются мониторами с резолюцией 800х600. Но это мое, частное мнение, которое начинает приживаться в моем агенстве (моими стараниями :) ).

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

Гибче надо быть, и не зацикливаться :)

Спасибо за перевод. Хорошо бы перенести в http://www.habrahabr.ru/blog/css
да, спасибо, я пару раз тоже недоумевал, пока переводил, почему 800х600, и в своих комментариях курсивом написал про 1024х768
Трудно в это верить, но многие заокеанские пользователи жлобятся купить монитор более 800х600. К тому же большинство пользуется ноутбуками.
Для того чтобы найти такой монитор/ноутбук нужно приложить немало усилий.
на сколько я знаю, есть дорогущие бизнес-модели ноутов
главное их преимущество в малых размерах
Разрешение у таких "малых размеров" тем не менее меньше 1024х768 не бывает %)
тру! я почему-то думал, что там гораздо меньше...
но согласитесь, что люди с ослабленным зрением с гораздо больше вероятностью могут там поставить разрешение поменьше?)
Как это ни странно, но пользователи с разрешением в 800х600 встречаются. В большинстве своем это неродное разрешение, которое эти люди ставят из-за проблем со зрением. Я всегда полагала что css — is all about usability. Поэтому ориентироваться на этих людей тоже надо (ну разве только если у сайта определенная ЦА, и всеми "отсталыми" пользователями можно пренебречь).
Конечно встречаются и забывать о них не надо, но ориентироваться надо уже не на них.
У меня на кпк разрешение 640х480, к примеру. Делают screen-версию, делают print, а про handheld забывают.
Какой у вас КПК, если не секрет? И каким браузером предпочитаете пользоваться на КПК?
сейчас hp 4700, использую либо Opera, либо Pocket IE
Спасибо за ответы.
Одно можно сказать точно - дизайн и юзабилити всегда были двумя сторонами одной монеты.
И всё же попадаются такие клиенты, которые из-за своей скупости, наделяют сотрудников старым железом в которых ПО win2000 и мониторы с разрешением 640х480. Но это как-бы исключение из правил. С такими надо бороться либо посылать нахер.
Спасибо! Очень полезная статья
В резиновой верстке есть один минус, который убивает сам смысл такой верски.
Взять обычный гавнасайт буквой "П". Первая колонка (допустим, меню) - 250 пикселов, третья колонка (новости) - 250 пикселов. При разрешении 1024 (на самом деле 1000 примерно из-за полосы пркрутки) на контент остается 500 пикселов. Это замечательно, ибо с строку помещается примерно 8-10 слов. Это то максимальное количество слов, которое человек может осилить в строке, читая текст. При большем количестве - он с третьей строки захлопнет чудо-сайт и пойдет покурить на балкон, глядя в даль, чтобы восстановить порушенное зрение.
Так, при разрешении (как показывает статистика - 50% населения сидит под 1280x1024) в строке уже 15-17 слов. Это в 2 раза больше допустимого.
На дёрти, по-моему, Виконт выкрутился и сделал резиновыми новости (все-равно они решающей роли в жизни сайта не играют))
Но через год-другой придется делать редизайн сайта, ибо 50% уже будут сидеть под 1600 )))
И так до бесконечности.
А по поводу 600х480, 800х600 - смешно: у меня стартовая ширина макета ориентируется на 1024. Ибо те, кто сидят под 800х600, не являются платежеспособной частью населения и им просто не купить гламур-тужур товары, предлагаемые в интернете.
))
Первый сайт исключительно на css я сделал году этак в 2002. Четырехколоночная верстка! В те времена три колонки сделать было проблемой. Ходил гордый )))
Сейчас уже сам css знаю в примитиве - поменял профессию.
это скорее недостаток проектирования)
есть же максимальная/минимальная ширина и хаки (для ie), что бы макет способствовал удобному чтению)
Наличие UMPC с такими разрешением экрана и стоимостью от 2000 вечнозеленый не является подтверждением платежеспособности..? Я уже не говорю о карманных компьютерах..
Впрочем и мнение относительно 8-10 слов на мой взгляд спорное, более того для меня не приемлемое, Мне абсолютно западло читать длинный столбец новостей, с полями занимающими больше 2 третей экрана.., да еще на который в случае отстуствия баннерорезки всякое г мельтешит.. Поэтому лично для себя все подобные сайты заностся в черный список в моей голове и я на такой дизайн больше никогда не захожу. Разве если только RSS подписка есть у сайта, где можно это нормально читать.
частично согласен с вами.
кроме высказывания о неплатёжеспособности 800x600.
сейчас мобильные устройства всё круче и круче. в платёжности мобильных пользователей я не сомневаюсь по-умолчанию. более того, раньше они были убоги в отображении страниц, поэтому пользователь норовил лазить по pda-special, pda-complaint ресурсам. а сейчас тенденция такова, что pda/мобилы/смартфоны гормонично полноценно отражают страницы (это им, наконец, удалось), но пока ущербны в "слабых" разрешениях (выше 800x600 им всё-таки не дано, и вряд ли будет из-за размеров самих устройств!).
поэтому остаётся 2 выхода:
1. либо ждать времени, когда все мобильные устройства смогут отображать 1024 и выше, тогда ваше пост будет актуальным 100% (если на тот момент все мониторы не будут оперировать разрешениями 2048 и выше)
2. мириться хотя бы с разрешением 800x600 :) про 640 молчу :)
Я про то, что все-таки бОльшая часть просмотров и заказов товаров делается в стационарных условиях, когда человек ползает по сайтам и выбирает товар. Заниматься этим с помощью мобильника тяжеловато.))
Если посетитель выбрал в спокойных офисных условиях себе товар и запомнил сайт, то мобилка ему поможет разве что как вспомогательное средство типа напоминалки схемы проезда.
Ну и я вот еще тенденцию такую заметил у заказчиков: продали они свою рольставню и давай ее фотографировать на объекте (как она преобразила фасад дома, как органично облагородила этот мир и т.д.). И на сайт пытаются вывесить фотообои (доктор, дайте мне таблетки от жадности, да побольше, побольше!). Размер картинки по ширине 500 пикселей их уже не устраивает!
Т.е. вышеописанный размер сайта в 1000 пикселей - это самый минимум для бедного клиента.))
Вот уж с чем приходится мириться, куда там 800! )
если мириться, то эти поблажки - именно то, за что мы, разработчики, будем гореть в аду :)
посетитель - наш главный заказчик ;)
Я давно уже бросил бесполезно-нервное занятие с девизом "ты делаешь гайки, а я - дизайн сайта". Все они в душе дизайнеры.)) Если раньше хватало сил на разговоры, что не надо делать бекграунд с викторианскими букетами, у вас же тяжелое машиностроение, то сейчас я сразу говорю как правильно надо сделать, а потом молчу. Вчера моими руками женщина рисовала логотип конторы по недвижимости. Мой вариант, который я ей с пол-пинка выдал, ей не понравился. Угрохала кучу денег (я за такое участие в моей работе беру 100 долларов в час), устала, опустила руки и тихо сказала: а самый первый вариант мне нравится больше всего.
Поэтому, если клиент хочет золото на голубом - безропотно сделаю. )) Хочет фото любимой дочки 1024 х 768 - сделаю (а всякая ненужная сайту навигация и контакты пусть живут за полосой прокрутки)
Я люблю клиентов. Честно.
Давно мысль закралась, что более чем 1600 разрешение экранов для обычных "офисных" пользователей просто неудобно. Скоро настанет предел...
Того же мнения. Осталось ждать ))
В те времена три колонки сделать было проблемой. Ходил гордый )))


Жаль. И по сей день можно гордится такими умениями.
Хороший CSS-код подобен хорошим стихам. Или даже музыке.
у меня любой элегантный код почему-то вызывает ассоциации с »Игрой в Бисер» Гессе. Я считаю, что современное общество уже почти пришло к этой концепции.
К сожалению, перевод основополагающих понятий не соответствует устоявшейся в русском языке терминологии:

fluid — резиновый (плавающий);
elastic — эластичный (резиновый).
спасибо большое, с радостью бы поставил плюс, но пока не могу, по-видимому
я за вас это сделаю, если вы не против :)))
Кстати сейчас много говориться об увеличении шрифта.
У кого-нибудь (не считая юзверей оперы) по дефолту стоит увеличенный шрифт? То есть понятно, что если мелкий текст, и надо его прочитать, то его увеличивают на время. А если у тебя минимальный шрифт на странице в 30px? Стоит ли на это обращать внимание?
Просто статистику по этому вопросу получить тяжело, и не понятно откуда проблема. Многие вообще не знают, как шрифт менять.
У меня стоит 13...16 мин.размер шрифта в зависимости от монитора - люблю смотреть издалека и не напрягаясь.

И у разнообразных пионерами сляпанных сайтов постоянно разлазится верстка колонок с меню, повторяется фоновая картинка с градиентами и полосочками (ужос) и так далее
Я всегда работаю со сверхбольшими шрифтами, если сайт сделан аккуратно, то легко ставлю 16, а то и 18. И терпеть не могу фиксированную вёрстку, когда под основную информацию отводят пикселов 400 из 1600 возможных.
гы) CurlyBrace в принципе всё сказал уже)

Единственное могу добавить, что в принципе можно говорить о подобии кроссбраузерного решения для максимальной/минимальной ширины, с той оговоркой, что мы используем conditional comments для ie, т. к. по факту всё же код остаётся чистым для современных браузеров.
"Не верю!" ©

1280*1024 побольше должно быть, но они не ходят на те сайты где счетчик ХотЛога стоит :)))
Статистика: lenta.ru: 40% 1024x768, 40% - 1280x1024, 5% - 1600x1200

Альтернативные бродилки (не IE) - 25%
Эластика прекрасна. Но картинки в приведенных примере фиксированы.
А что можно делать с картинками? Тоже задать размеры в em? Есть ли пример где-то?
Можно задать одну из сторон в относительных единицах. Но ресамплинг в сторону увеличения будет все портить, а картинки, которые в бэкграунде не потянешь никак. Видимо, что-то яваскриптовое и комплект картинок. Есть и футуристический вариант — отказ от растра вовсе.
ребят а посоветуйте хороший(стабильный, универсальный, простой) резиновый макет в 2 колонки с футером и хидером
НЛО прилетело и опубликовало эту надпись здесь
Зарегистрируйтесь на Хабре , чтобы оставить комментарий

Публикации

Истории