Оцените, пожалуйста, юзабилити сайта

[Mad Cat]

Это мой первый в жизни сайт, только ради него 3 месяца назад я и начала изучение html. Поэтому в код попрошу никому не лезть =) Сейчас там наверняка навалом косяков и ошибок, но мы потихоньку исправляемся. А вот мнения и критику дизайна и юзабилити жду с нетерпением.

http://www.nc-aero.com

[ablay2009]

Здравствуйте! Посмотрел, в код не лез, не бойтесь. Итак, замечания:

1)Шрифт оснвного контента лучше подобрать без засечек, т. к. темный фон+белый текст+шрифт с засечками это нехорошая смесь

2)Зачем вы сделали сайт таким узким?

3)Буквица смотрится нелепо, можно доработать

4)Мне кажется на главной должна быть большая и красивая кнопка "заказать", ибо если я не хочу читать про ваши награды и т. п. , а просто хочу быстро заказать, то лазать в поисках адреса и телефона, потом звонить вам.... долго это все

5)Лучше выделить не цифры, а сами вопросы в FAQ

6)Текст в подвале лучше наоборот сделать темнее, потому что он не должен выделяться

7)счетчик - зачем?

8) кнопки социальных сетей лучше сделать презентабельнее, соц. сети для сайта студии - критично(продвижение способом сарафанного радио)

9)Пункт "Аэрография" лучше переименовать в "Портфолио" или что-то типо этого, т. к. и так понятно чем вы занимаетесь

А так для первой работы неплохо.

[Mad Cat]

Большое спасибо за столь подробный анализ!

Теперь мой подробный отчет об исправлениях:

1) Шрифт основного контента теперь Helvetica, действительно, так намного лучше!

2) Не поняла?

3) Буквица может и не к месту, просто посчитаем ее моей странностью)

4) Ах, если бы можно было поставить большую и красивую кнопку "ЗАКАЗАТЬ"! И если бы на нее жал хотя бы каждый сотый посетитель! Какая жизнь тогда бы началась! =) Правда, непонятно - что должно появиться на экране после этого самого нажатия...

5) Весь этот текст на главной размещен ради SEO и этих долбаных ПС. Типа поисковые слова и все такое... Надеюсь, никто его там не читает)

6) Текст в подвале теперь тоже никому не бьет в глаза! Затемнила его по-максимуму.

7) Это не просто счетчик, это супер-пупер счетчик Вебвизор! На стороне клиента он позволяет узнавать всю информацию по посетителям сайта!

Например, я вижу, по каким запросам попадают на мой сайт, что они там делают и куда больше смотрят. Вот тут информация: http://metrika.yandex.ru/promo/webvisor/

8) Кнопки соц. сетей взяты из готового скрипта, вроде на том же Яндексе. А метод сарафанного радио в нашем бизнесе не меняется последние 10 лет...

9) Не знаю, почему я не люблю слово "портфолио" - видимо это моя вторая странность)

И да, если эти мои исправления не видно сразу, то наверное надо просто обновить страницу.

Благодарю еще раз - очень приятно, что нашлось кому поддержать )))

[kir]

Сайт в целом понравился. Однако с юзабилити есть проблемы.

Поддерживаю замечания от ablay2009, за исключением первых двух.

• Ваш серый шрифт с засечками на черном фоне читается отлично для светлого шрифта на темном фоне. В отличии от ablay2009, я считаю, что шрифт менять не стоит.
  
• Ширина сайта нормальная, по-моему.
  

Советы, замечания (без учета кода) -- то, что в глаза бросилось:

1. Ссылки внешне (без наведения) сложноопознаваемы. Можно, например, добавить ко всем ссылкам подчеркивание. Также будет лучше все ссылки сделать в едином стиле (сейчас же есть серые без подчеркивание, красные с подчеркиванием, белые без подчеркивания : ).
   
2. Тексты оттипографить, например, в "Типографе".
   
3. В конце заголовка не следует ставить такие знаки препинания как ':' и '.'.
   
4. Нет межабзацных интервалов.
   
5. Расстояние от заголовка до предыдущего абзаца почти равно расстоянию от заголовка до следующего за ним абзаца. Правильнее делать расстояние до следующего за заголовком абзаца заметно меньшим, чтобы глаз легко определял, к какой части текста относится заголовок.
   
6. Не смог понять, зачем в разделе "Аэрография" нужен красный заголовок "Аэрография студии North Custom. Портфолио.", который дублирует, по-сути, название раздела.
   
7. Кнопки соцсетей слишком яркие для черного фона. Лучше уменьшить их яркость (например, разместив их в полупрозрачном слое) -- так же, как у вас слегка затемнены превьюшки "свежих работ" на странице "О студии".
   
8. [Дело вкуса] Я бы для превьюшек сделал не такое сильное затемнение (когда они не в фокусе), как сейчас -- сейчас они мрачновато смотрятся, а ведь фотки работ студии это одна из самых важных вещей для клиентов.
   
9. "Адреса и телефоны" -> "Контакты"
   
10. В разделе "Адреса и телефоны" побывал кэп и оставил надпись "Создано с помощью инструментов Яндекс.Карт" -- лучше убрать ее.
    
11. Для подстраниц разделов "Аэрография" и "Награды" не помешали бы хлебные крошки.
    
12. Изображения на логотипе и в favicon похожи (если мельком смотреть), но разные -- логичнее бы сделать их одинаковыми.
    

Успехов.

Edited February 12, 2012 by kir

[Mad Cat]

Оспади, я же уже умела варить борщ, так зачем же я еще и в это сунулась?!

У меня в голове все прояснилось - сайт надо переписать начисто, будем считать, что я показала вам черновик =) Все равно в таблице

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

kir, спасибо за ссылку, до меня наконец дошли суть и назначение типографа, чем непременно и воспользуюсь!

Удачи всем вам в ваших проектак!

[html232]

На мой взгляд мрачновато. У вас в названии есть слово North - север. Можно изобразить сугробы, вьюгу, ураган, метель, северное сияние и т.п. П.С. У вас замечательные работы, успехов вам!

[SteeLZzZ]

Сайт в общем-то ничего.Всё равно,мне кажется,чего-то не хватает.Зато очень сильно понравились Ваши творения с транспортом,красиво.

Edited February 15, 2012 by SteeLZzZ

[ablay2009]

Уж поверьте мне, я знаю что такое Вебвизор Совсем не обязательно оставлять сам счетчик на страничке, можно его спрятать за пределы экрана.

[Searcher]

1. Контакты для такого сайта должны быть прямо рядом с заголовком. Посетитель не любит поиски, да еще и с фонарем.

2. Почему "с фонарем"? Потому, что слишком сильно затемнены неактивные пункты меню (как в главном меню так и в разделе "Аэрография").

3. Вместо не очень понятного названия пункта меню "Аэрография", если вы не любите слово "Портфолио", то логичнее и понятнее для посетителя будет написать "Работы", поскольку такой термин уже встречается у вас ниже.

4. Буквица к месту, только надо её сделать более аккуратно. Добавить небольшой отступ справа. Убрать наклон у шрифта. Немного увеличить шрифт.

[Mad Cat]

Уфф, сегодня перекроила все страницы заново с новыми стилями и по новому шаблону.

Перелиновка страниц теперь не даст заблудиться на сайте даже идиоту, даже и не знаю что я там еще могу сделать... Зато знаю точно - второй раз так кардинально переделывать весь сайт меня заставят только под дулом пистолета =)

Исключительно благодаря вашим советам:

1. Шрифт с засечками только в меню, контент без засечек.

2. Текст в подвале затемнен.

3. Счетчик убран в прозрачный слой.

4. Все тексты оттипографлены!

5. Кнопки соц.сетей приглушены.

Теперь можно взять тайм-аут =)

[Radiocity]

А меня сайт не впечатлил.

Из-за черного фона, светлый текст кажется больше.

Соц кнопки нужно убрать в другое место.

В контактах лучше указать время работы.

Ну и больше графики, 100500 чертей! Это же студия аэрографии. Покажите, что умеете рисовать =)

Edited February 15, 2012 by Radiocity

[Mad Cat]

Цвет фона может быть только черным - так уж сложилось исторически, ничего не поделать. Текст затемнен насколько это возможно, чтоб в глаза не бил.

Куда убрать соц. кнопки? Неужели в подвал?!

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

Дизайн продумывался как минималистичный, чтобы ничто не отвлекало он основных картинок и графики - наших работ =)

Edited February 16, 2012 by Mad Cat

[buddah]

Лучше стало

[kir]

Куда убрать соц. кнопки? Неужели в подвал?!

А почему бы и нет? Лично я эти кнопки понимаю так: посетитель прочел контент на вашей странице и ему он понравился / показался интересным и посетитель решает поделиться этой информацией с друзьями, знакомыми и жмет на кнопку, например, ВКонтакте, чтобы быстро разместить ссылку на страницу у себя на стене. Для описанной модели поведения логично размещать кнопки соцсетей после контента, ведь какой смысл размещать их до или в середине контента, если пользователю еще не ясно, будет ли интересно или нет то, что он прочтет далее.

Шрифт с засечками только в меню, контент без засечек.

В части контента остался шрифт с засечками, например, в разделе "Награды" и у половины ссылок. Хотя на мой вкус, повторюсь, шрифт с засечками смотрелся и читался много лучше. Кстати, какие у остальных мнения про более подходящий шрифт для этого сайта -- с засечками иби без? Пока 1:1 -- ablay2009 против засечек, я за.

[buddah]

Кстати, какие у остальных мнения про более подходящий шрифт для этого сайта -- с засечками иби без? Пока 1:1 -- ablay2009 против засечек, я за.

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

[Searcher]

Немного лучше стало, но повторю:

1. Контакты для такого сайта обязательно должны быть прямо рядом с заголовком, и очень желательно, чтобы на каждой странице. Посетитель не любит поиски, да еще и с фонарем.

2. Почему "с фонарем"? Потому, что слишком сильно затемнены неактивные пункты меню (как в главном меню так и в разделе "Аэрография").

3. Вместо не очень понятного названия пункта меню "Аэрография", если вы не любите слово "Портфолио", то логичнее и понятнее для посетителя будет написать "Работы", поскольку такой термин уже встречается у вас ниже.

4. Буквица к месту, только надо её сделать более аккуратно. Добавить небольшой отступ справа. Убрать наклон у шрифта. Немного увеличить шрифт.

И ради этого не надо все кардинально переделывать.

[Vin]

Красиво, стильно, органично. Но очень темно. Особенно если говорить о ссылках в верхнем меню (без наведения). Их бы сделать посветлее — сейчас они почти сливаются с фоном.

[Mad Cat]

kir, эти многострадальные кнопки в середине контента только на главной странице, на всех прочих страницах они идут в правильном порядке - сразу за всем остальным.

Шрифт думаю пока оставить в покое - текст практически никто не читает - 99% приходят смотреть только картинки.

Searcher, я отслеживаю перемещения посетителей по сайту и вижу, что в пункты прайс и контакты заходит почти каждый посетитель, следовательно навигация достаточно читабельна =)

Как сделать отступ у буквицы я уже разобралась, а вот какой бы шрифт для этого выбрать?

[Vin]

То, что пользователи ходят, ещё не значит, что им удобно. А можно форму обратной связи повесить с пожеланиями к оформлению.

[Mad Cat]

Ну хорошо, цвет кнопок меню - из серии "понты дороже денег" =) Для себя же делаем, в конце-то концов.

А форма обратной связи с пожеланиями к оформлению сайта? Вспоминая пожелания клиентов при утверждении эскизов, страшно представить, что все эти люди будут высказывать пожелания еще и к сайту, причем они будут у каждого разные и зачастую противоречивые.

[ablay2009]

Ну хорошо, цвет кнопок меню - из серии "понты дороже денег" =) Для себя же делаем, в конце-то концов.

А форма обратной связи с пожеланиями к оформлению сайта? Вспоминая пожелания клиентов при утверждении эскизов, страшно представить, что все эти люди будут высказывать пожелания еще и к сайту, причем они будут у каждого разные и зачастую противоречивые.

Можно создать проект на reformal.ru. Туда люди смогут писать свои пожелания, и ваш почтовый ящик будет чист.

[Mad Cat]

Конечно можно. Создать такой полезный и нужный проект.

Пишите мне все - какой функционал прибавить, каких скриптов еще дописать. Учебник по html я выучила, чё.

=)