Хабр Курсы для всех
РЕКЛАМА
Практикум, Хекслет, SkyPro, авторские курсы — собрали всех и попросили скидки. Осталось выбрать!
Хабр доступен 24/7 благодаря поддержке друзей
Комментарии 71
Вывод из прочитанного: web2.0-style сайты — отстой. Пользуемся академическим стилем.
"Плавная", мягкая, если угодно разноцветность Хабра визуально помогает разделить разные по смыслу направления.
Это очень удобно.
Это очень удобно.
Возьмем данную страницу:
1. Фон под ссылкой "Написать" и цвета фонов под ссылками "Коллектиные" и "Персональные" имеют разный фон, что помогает визуально разделить их.
2. Про плавность. Фактически на сайте используются 3 группы цветов и их оттенки (шутки типа, красный, зеленый и синий не принимаеются! :), первая группа: розовый/фиолетовый/красный/оранжевый, вторая: зеленый/салатный, третья: синий/серый/т.п. Все очень плавно, различия в глаза не бросаются. Грамотно.
1. Фон под ссылкой "Написать" и цвета фонов под ссылками "Коллектиные" и "Персональные" имеют разный фон, что помогает визуально разделить их.
2. Про плавность. Фактически на сайте используются 3 группы цветов и их оттенки (шутки типа, красный, зеленый и синий не принимаеются! :), первая группа: розовый/фиолетовый/красный/оранжевый, вторая: зеленый/салатный, третья: синий/серый/т.п. Все очень плавно, различия в глаза не бросаются. Грамотно.
ничего не понял, они разделяются или нет? :)
C разным фоном, думаю понятно... (надеюсь по крайней мере, что тут непонятного? :)
По поводу плавности. Цитата из данного хабратопика:
На нашем сайте уродливая цветовая схема (например, красный и зеленый). (ХА! http://www.artlebedev.ru/kovodstvo/130/#…, прим.пер.)
Тут Vincent Flanders хотел сказать именно о юзабилити, а не о дизайне в целом.
Сами по себе цвета ярко, а не "плавно" бросаются в глаза, чего нет на Хабре, т.е. тут яркое различие используется в абсолютно обоснованных случаях, к примеру, для оценки комментария, яркое различие: плохо - красный, хорошо - зеленый.
А для выделения заголовков, используются плавно-различные фоны: серо-розовый, серо-голубой, серо-зеленый. Есть что-то общее (серая составляющая цвета) и в тоже время они разные.
про остальные цвета. ты мне так и не рассказал схожесть вышеприведенных двух пунктов и то, ради чего в один из них пихнули анимированный gif.
и не описал всю [немалую] палитру используемых на сайте цветов.
Это я уже прокомментировал, см. выше: надо этот гиф, по-хорошему, удалять по-скорее...
нет, насчет выделений цветом — ты меня не убедил.
цветов слишком много. и подобраны они не очень.
я, к примеру, в прямом эфире ники с разделами вижу только, когда к монитору ближе придвигаюсь.
Странно, у меня все ОК. Не придвигаюсь к монитору, все хорошо, четко видно.
этот ужасный анигиф у популярных
Вот под этим подпишусь! Согласен на 100%, надо его поскорее удалить :), не серьезно как-то...
Это точно, потому что
"В некоторых областях страниц сайта слишком много ссылок" Сайты с облаками тегов вообще не прокатывают, судя по статье.
"В некоторых областях страниц сайта слишком много ссылок" Сайты с облаками тегов вообще не прокатывают, судя по статье.
Все эте рекомендации, как подметил flint, для дизайнов в стиле 1.0, что на данный момент полнейший отстой.
Ну, во-первых не все, а во-вторых - что-значит дизайн в стиле 1.0, и в чем его отстойность?
Согласен :)
А еще бывает удобный для использования или неудобный.
А еще бывает удобный для использования или неудобный.
хм. т.е. дизайнер типа нарисовал, а потом спец по юзабилити "как-то там" придумывает, как бы удобным этот дизайн сделать. или наоборот, "юзабилист" придумал, как будет удобно, а дизайнер потом "удобно" нарисовал?
В целом, согласен, что так часто бывает, вот только не соглашусь, что так должно быть. Я именно такую ситуацию наблюдаю, выступая в данном контексте в роли юзабилиста, и, често говоря, считаю, что делаю работу дизайнера за него самого. Если я дизайнеру ставлю задачу сделать промо-сайт, пожалуйста, пусть даст волю своей фантазии, а вот если я говорю, что сайт должен быть удобным, дизайнер в первую очередь должен кинуться почитать что такое юзабилити, и как это применять. Вот именно в этом случае получится и удобный и красивый сайт.
+1 поддерживаю. Я занимаюсь, тем что формирую структуру сайта, которую потом можно отдать дизайнеру и он с соблюдением всей моей структуры ее красиво оформит. А вот найти человека, который сразу бы делал юзабельную структуру и при этом красивую практически невозможно :(
Не согласен. Дизайн - это очень обширное понятие, которое включает в себя и юзабилити. Юзабилити - часть дизайна.
Вы путаете работу дизайнера с работой художника. Это разные вещи.
На 100% согласен с Алексеем Дружининым (интервью с ним), вот что он говорит:
«В Лондоне некоторое время назад проводился конкурс среди дизайнеров на редизайн одной из улиц этого города. Приглашено было большое количество и дизайнеров, и художников, и просто около-творческих людей. Задача на первый взгляд простая – сделать редизайн одной из старейших улиц Лондона. После нескольких месяцев работы на суд было предоставлено несколько работ. Среди них было много граффити, много предложений во что можно раскрасить дома, дорогу и магазины с киосками – вообщем много очень интересных, но именно художественных проектов. Выиграла женщина, Дизайнер, которая вместо того чтобы заниматься украшательством улицы и домов, сначала прошлась по ней, поговорила с людьми, расспросила их о сути проблемы. Она вышла защищать свой проект не с кучей бордов и красивыми картинками, а рассказала комиссии, что на этой улице, в рамках выделенного бюджета, можно сделать единственную правильную с точки зрения дизайнера вещь – положить на дороге новый асфальт, потому как старый совсем уже плох. Вот это – я считаю работой профессионального зрелого Дизайнера с большой буквы. Она победила в конкурсе».
Хочется только прокомментировать это:
Дизайнер сделала работу исключительно по юзабилити и в данном конкретном случае, именно это и требовалось.
Юзабилити - часть дизайна!
Вы путаете работу дизайнера с работой художника. Это разные вещи.
На 100% согласен с Алексеем Дружининым (интервью с ним), вот что он говорит:
«В Лондоне некоторое время назад проводился конкурс среди дизайнеров на редизайн одной из улиц этого города. Приглашено было большое количество и дизайнеров, и художников, и просто около-творческих людей. Задача на первый взгляд простая – сделать редизайн одной из старейших улиц Лондона. После нескольких месяцев работы на суд было предоставлено несколько работ. Среди них было много граффити, много предложений во что можно раскрасить дома, дорогу и магазины с киосками – вообщем много очень интересных, но именно художественных проектов. Выиграла женщина, Дизайнер, которая вместо того чтобы заниматься украшательством улицы и домов, сначала прошлась по ней, поговорила с людьми, расспросила их о сути проблемы. Она вышла защищать свой проект не с кучей бордов и красивыми картинками, а рассказала комиссии, что на этой улице, в рамках выделенного бюджета, можно сделать единственную правильную с точки зрения дизайнера вещь – положить на дороге новый асфальт, потому как старый совсем уже плох. Вот это – я считаю работой профессионального зрелого Дизайнера с большой буквы. Она победила в конкурсе».
Хочется только прокомментировать это:
Дизайнер сделала работу исключительно по юзабилити и в данном конкретном случае, именно это и требовалось.
Юзабилити - часть дизайна!
У вас врожденный порок не соглашаться?
Это не менеджмент, а грамотная работа дизайнера.
Аналогия не обоснована, т.к. уверен в том, что бюджет был более чем солидный, а предложение положить новый асфальт было выдвинуто совсем не в целях экономии, скорее всего был предложен асфальт высокого качества + качественная работа по его укладке, т.е. тут нет никакой экономии: хороший бюджет - хорошая работа.
Аналогия не обоснована, т.к. уверен в том, что бюджет был более чем солидный, а предложение положить новый асфальт было выдвинуто совсем не в целях экономии, скорее всего был предложен асфальт высокого качества + качественная работа по его укладке, т.е. тут нет никакой экономии: хороший бюджет - хорошая работа.
Раз организовали конкурс - то победить должен был тот, кто предложит лучший решение.
Она это сделала.
Работа эта должна была быть и была ее.
Все.
Она это сделала.
Работа эта должна была быть и была ее.
Все.
Что она и сделала: осталась думающим дизайнером, а не художником.
Вы рассуждаете в отрыве от реальности, рассматриваете идеальный случай.
А в реальности все бывает далеко не так, как хотелось бы.
Конечно, логичнее было бы сначала задуматься о людях (властям!), проживающих в этом районе, а потом уже об эстетический стороне этого вопроса, об украшательствах.
Но в этом то и дело, что дизайнер исправила ошибку властей, когда занялась тем, что нужно в первую очередь, на то она и Дизайнер с большой буквы!
А в реальности все бывает далеко не так, как хотелось бы.
Конечно, логичнее было бы сначала задуматься о людях (властям!), проживающих в этом районе, а потом уже об эстетический стороне этого вопроса, об украшательствах.
Но в этом то и дело, что дизайнер исправила ошибку властей, когда занялась тем, что нужно в первую очередь, на то она и Дизайнер с большой буквы!
дизайнер высчитал стоимость укладки асфальта и выбрал самый лучший для него материал :D
не смеши меня.
Я имел ввиду совершенно не это, Вы это прекрасно понимаете, не надо писать ерунду.
Хабра - дизайн в стиле 2.0
Вебпланет - дизайн в стиле 1.0
руководство по дизайну Веб 2.0 - почитайте, думаю найдете отличия от 1.0 и 2.0. Лично мне эта статья очень сильно помогла.
А 2.0 это не толькоя аякс, тэги, социальность, это скорее стиль сайтостроения и дизайн неотемлемая часть :)
Вебпланет - дизайн в стиле 1.0
руководство по дизайну Веб 2.0 - почитайте, думаю найдете отличия от 1.0 и 2.0. Лично мне эта статья очень сильно помогла.
А 2.0 это не толькоя аякс, тэги, социальность, это скорее стиль сайтостроения и дизайн неотемлемая часть :)
ух ты. социальность и тэги - признак w2.0 ? ;)
раньше этих вещей не было?
Я вроде уже написал, что это стиль сайтостроения. Аякс, теги и социальность - это компоненты, которые в себя вобрал в2.0
назови мне четкую границу — где кончается 1 и начинается 2. смогешь? :)
Да без проблем, граница в том месте, гда заканчивается пафос и творчество сливается с прагматизмом :)))
Почитал. Спасибо за ссылку - действительно хорошая статья! Только я бы не сказал, что "дизайн в стиле веб 2,0" - лучше. Он отличается, и он сейчас в моде, но, думаю, вы согласитесь, что полно сайтов "в стиле 1,0", которые очень удобны и красивы.
+1!
много размытых объяснений и спорных моментов.
Буржуйские статьи — в топку. Даешь рашн артиклс!
Буржуйские статьи — в топку. Даешь рашн артиклс!
Согласен, очень много недосказанности и внутренних противоречий. Хотя, это один отдельно взятый человек, да еще приводящий вопросы в форме теста.
У этого человека довольно-таки странные взгляды на дизайн. Которые, к тому же, остались на уровне конца 90-х. По-моему, последние лет 7-8 он не был в Интернете.
Да, и к тому же, его статья теряет весь свой сомнительный авторитет, поскольку его собственный сайт не выполняет и половины указанных им пунктов. В таком случае, какое право он имеет выдвигать такие требования к современным сайтам: если хоть один раз поставите галочку, то ваш сайт — отстой.
Мое мнение: либо эта статья — стеб, либо автор просто мудак, простите за выражение.
Да, и к тому же, его статья теряет весь свой сомнительный авторитет, поскольку его собственный сайт не выполняет и половины указанных им пунктов. В таком случае, какое право он имеет выдвигать такие требования к современным сайтам: если хоть один раз поставите галочку, то ваш сайт — отстой.
Мое мнение: либо эта статья — стеб, либо автор просто мудак, простите за выражение.
(Logo is not above the fold – кто скажет, что в данном контексте значит fold, тому буду очень благодарен, прим.пер.)
скорее всего имеет ввиду перевод как лацкан. В роли лацкана здесь выступает та часть содеражательная страницы, ради собственно которой траница и создается, по научному не интересовался как называется.
(что за trailing cursor? прим.пер.)
фигня такая как выглядит можно посмотрев зайдя в Специальный возможности панели управления Окошек, курсор для слабовидящих, за которым тянется след.
На нашем сайте много сложных URL-ов (это каких? прим.пер.)
например таких, просто пример кликать не надо http://www.search.com/click?sl,marin.1.118.1554.1.3.%25D0%25BA%25D1%2583%25D0%25BA%25D0%25BA%25D0%25BF.0,http%3A%2F%2Fwww%2Eradarr%2Ekiev%2Eua%2Fforums%2Flofiversion%2Findex%2Ephp%2Ft14229%2Ehtml
(что за «переходы страниц», «переходы по страницам»? прим.пер.)
симпатичная штука, когда ипользуется различные эффекты затенения и тому подобное при переходе страниц, работает только из под IE, но при этом ужасно тормозит маломощные машинки. Всего около 25 различных эффектов. На сегодняшний день проще сделать это на ява скрипте.
(всё! 90% сайтов – отстой :), прим.пер.)
и с точки зрения стиля и сточки зрения наполнения полностью согласен, смайлик можно стереть =)
скорее всего имеет ввиду перевод как лацкан. В роли лацкана здесь выступает та часть содеражательная страницы, ради собственно которой траница и создается, по научному не интересовался как называется.
(что за trailing cursor? прим.пер.)
фигня такая как выглядит можно посмотрев зайдя в Специальный возможности панели управления Окошек, курсор для слабовидящих, за которым тянется след.
На нашем сайте много сложных URL-ов (это каких? прим.пер.)
например таких, просто пример кликать не надо http://www.search.com/click?sl,marin.1.118.1554.1.3.%25D0%25BA%25D1%2583%25D0%25BA%25D0%25BA%25D0%25BF.0,http%3A%2F%2Fwww%2Eradarr%2Ekiev%2Eua%2Fforums%2Flofiversion%2Findex%2Ephp%2Ft14229%2Ehtml
(что за «переходы страниц», «переходы по страницам»? прим.пер.)
симпатичная штука, когда ипользуется различные эффекты затенения и тому подобное при переходе страниц, работает только из под IE, но при этом ужасно тормозит маломощные машинки. Всего около 25 различных эффектов. На сегодняшний день проще сделать это на ява скрипте.
(всё! 90% сайтов – отстой :), прим.пер.)
и с точки зрения стиля и сточки зрения наполнения полностью согласен, смайлик можно стереть =)
above the fold - на первом экране (то, что видно без прокрутки)
Зарегистрируйтесь на Хабре, чтобы оставить комментарий
WebPagesThatSuck.com — тесты на отстойность, часть 2