В рамках анонсированного мероприятия разберем расстановку акцентов на сайте города Кривой Рог. Заявленная цель сайта — привлечение внимания жителей к местным новостям.
Для начала скриншоты главной «до» и «после». Если кликнете по картинке, увидите скриншоты большего размера.
Что я сделал и почему?
1. Заголовки новостей сделал крупнее и ярче, чтобы они могли соперничать с анимированными баннерами.
2. Уменьшил количество визуального шума на странице: убрал горизонтальные линейки, пунктир, стрелочки, повторяющуюся иконку в блоке «Рубрики», сделал светлее рамки.
Подчеркивание ссылок сделал заметно светлее.
Добавил «воздуха»: увеличил междустрочный интервал в абзацах, отступы вокруг заголовков, пробелы между элементами списков.
Убрал формальные заголовки блоков «Рубрики» и «Опрос».
Это всё, чтобы скорость сканирования страницы взглядом возросла, чтобы взгляд не цеплялся за незначащие элементы.
3. Рубрики сделал взвешенным списком. Разделы «Другое» и «Право» ничего не потеряют от нововведения, зато шуметь будут поменьше. А шансы, что пользователь найдет интересующую рубрику быстрее, возрастут.
4. Уменьшил контрастность шапки сайта, особенно логотипа и даты. В результате количество акцентов на странице уменьшилось.
Дмитрий Сергеев, 26 лет, разрабатываю сайты на Drupal, управляю интернет-проектами
Комментарии
Александр Кучеренко, 15.01.2008 15:11
На мой взгляд, содержание статьи не соответствует её заголовку.
Я ожидал что "расстановка акцентов" имеет отношение к "расстановке приоритетов размещения элементов (информации, сервисов) в макете страницы" (что непосредственно связано с проектирование сайтов), а тут описывается проделанная работа по улучшению внешнего вида сайта.
Но если переименовать заголовок статьи, то она вполне будет иметь право на существование.
Дмитрий Сергеев, 15.01.2008 16:41
Работы по выделению главного и затушевыванию неважного как раз связаны с расстановкой акцентов, разве нет? Улучшение внешнего вида — побочный эффект.
Размещение элементов на странице связано с расстановкой акцентов ничуть не меньше. В заявках есть еще три сайта, чтобы посмотреть на вопрос с разных сторон, что я и сделаю. Если рассказывать обо всём сразу, боюсь, получится сумбурно и слишком поверхностно. К тому же сил и терпения написать подобное эссе не хватит.
Attlant, 15.01.2008 20:31
Спасибо! Ждал конечно больше, но и на этом спасибо :) Как поправлю всё что уже запланировал напишу что и как...
Дмитрий Сергеев, 15.01.2008 20:54
Я недооценил временные затраты, взял четыре сайта. Теперь пытаюсь найти баланс :)
Павел, 15.01.2008 22:41
Рад, что есть еще дизайнеры, которые на юзабилити акцент делают. А-то всё чаще понарисуют красивостей, а пользоваться сайтом невозможно - только и годится что инвесторам на презентациях показывать.
Есть еще такая мудрая мысль: "Хороший дизайн - незаметный дизайн".
Дмитрий Сергеев, 15.01.2008 22:51
Как-то ты небрежно про инвестров :)
Павел, 15.01.2008 23:03
Приходилось общаться с инвесторами заказчика. Как-то до существенных вещей не придирались, а вот по дизайну - были от них придирки буквально на уровне "тут такую картинку поставить, а здесь зелененький сделать, чтоб красивее смотрелось" :) Может я просто правильных инвесторов не видел.. Надеюсь, что так :)
daedmen, 15.01.2008 23:35
Пост интересный конечно, но только как уже тов. Кучеренко сказал не в по заголовку, он скорее а-ля правим огрехи юзабилити. Я всетаки за расстановку приоритетов на этапе проектирования интерфейса сайта, а тут с точностью на оборот.
Дмитрий Сергеев, 15.01.2008 23:45
Прямо сейчас пишу пост, где совсем другой подход.
daedmen, 15.01.2008 23:48
Ждемс........даже очень ждемс.....
з.ы.
иногда почему-то сохранение введенных данных.....
Дмитрий Сергеев, 15.01.2008 23:55
Если речь о данных, вводимых при отправке комментария, там есть галочка на эту тему. Поставишь ее один раз — сайт тебя запомнит, сотрешь куки — забудет.
У того, кто галочку то ставит, то убирает, и вводит разные данные, очень быстро начинаются ошибки валидации. Местное проклятие нефритового скорпиона, ничего не поделаешь.
Идеальный вариант — стереть куки, ввести данные, оставить галочку, и больше никогда их не менять и галочку не трогать :)
Svetolish, 20.01.2008 01:06
Дим, не совсем поняла какая цель страницы и ее функциональное предназначение!
Сейчас основные акценты внимания стоят на:
1. погода
2. популярные новости
3. обмен валют
4. банер
5. еще попадает в глаз нечитаемая вкладка "знакомства",
Если интересно мое мнение по этой странице, напиши мне. Может получится интересный разговор.
Kengy, 27.01.2008 12:21
Мне кажется, меню должно быть таким: http://imdb.com/ или таким http://www.bizrate.com/, ну идея, в общем, ясна .)
Дмитрий Сергеев, 27.01.2008 22:34
Да, как на news2.ru или vaau.ru. Хотя у криворожского сайта может не набраться новостей на такое количество тем и подтем.