Пример аудита сайта: Мир Свадьбы

На нашем форуме появился новый раздел, посвященный юзабилити. Я решила сделать небольшой аудит сайта Marsi. Сайт называется Мир Свадьбы, ему 3 года, сейчас средняя суточная посещаемость сайта составляет 2,324 человека (основной трафик с гугла, чуть меньше идет с яндекса).

Навигация

Начнем с верхнего меню:

Не понятно наличие статьи: http://mir-svadbi.ru/glavnaya/ (первый пункт главного верхнего меню «Все о свадьбе» ведет на эту статью).

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

Обязательно смени title этой странички. А то получается, что страница http://mir-svadbi.ru/glavnaya/ и главная сайта http://mir-svadbi.ru/ имеют одинаковые title (Мир свадьбы). Это плохо с точки зрения оптимизации. Может стоить определить действительно главнуюстраничку?

Пример аудита сайта: мир свадьбы страницы

Имхо, над верхнем меню и рубриками стоит усиленно поработать. Сейчас рубрики не оптимизированы. Например, почему бы вместо рубрики с title Традиции (http://mir-svadbi.ru/rubrika/tradicii/), не сделать что-то более понятное и пользователю и поисковику: Свадебные традиции.

Соответственно:

  • Путешествие — Свадебные путешествия.
  • Наряды — Свадебные наряды, Свадебные платья и т.п.
  • Советы— Советы молодоженам (Свадебные советы)
  • Заметки юриста — Юристы о свадьбе

Пункт меню: услуги. Наверное, в описании рубрики (http://mir-svadbi.ru/rubrika/uslugi/) стоит как-то пояснить, что это не твой сайт предоставляет услуги, вы просто пишите о самом стоящем и интересном в мире свадьбы. А сам пункт переименовать, чтобы читателям было более понятно, что это за рубрика.

Сайдбары:

Не совсем понятно, что это за блок: Лучшее на сайте (в левом сайдбаре)?

Что это за фотографии? Это лучшие фото сайта? Или что-то другое? Из всего это понятно только: Мастер-класс по оформлению свадебных бокалов.

Я так понимаю, что это сбой в работе плагина или темы? Побродив по сайту, я заметила, что некоторые тизеры выводятся без текста (только фото). Но пользователю то до этого по барабану. Сделай вывод лучших статей другим плагином или пропиши html-кодом вручную. В общем, что хочешь делай, но делай красиво. 🙂

Мой совет: сделать фотки кликабельными, убрать стиль ul (li), добавить максимальную высоту блока (может, это он мешает) и посмотреть, что изменится. По идее должно стать лучше.

Обилие рубрик в правом сайдбаре просто пугает… Может стоит вывести в сайдбар самые основные, а вложенные рубрики сделать всплывающим меню? Подумай об этом.

Мелкие недочеты (то, до чего обычно не доходят руки — по себе знаю):

Размер текста по сравнению с картинкой довольно маленький, поэтому в рубриках названия других статей наползают на картинки — смотрится очень не опрятно.

Также стоит сделать отступы от картинок хотя бы 3-5 пиксела, так текст будет восприниматься куда лучше:

Вот как примерно это должно выглядеть:

Я бы сделала размер шрифта с названиями рубрик (Где? Заметки юриста) чуть меньше, так как из-за большого шрифта внимание от содержания статьи отводится.

Внизу под статьей в блоке Похожие статьи, у некоторых тизеров нет картинок:

Подозреваю, что связано это с тем, что некоторые файлы картинок названы русскими буквами: http://mir-svadbi.ru/wp-content/uploads/ребенок-и-свадьба.-Фото-Олег-и-Алексей-Ловцовы-150×150.jpg

Лучше, чтобы имена фотографий были латинскими буквами, к примеру: http://mir-svadbi.ru/wp-content/uploads/child-and-wedding-150×150.jpg или http://mir-svadbi.ru/wp-content/uploads/rebenok-na-svadbe-150×150.jpg

Также я заметила, что картинки имеют разный размер (смотрится не очень):

Попробуй сделать их одинаковыми по ширине и высоте.

В исходном коде я обнаружила странный тег:

Такого тега не существует. nofollow — это атрибут rel тега a, а не сам тег (существует мета-тег nofollow, но он используется в других случаях). Его необходимо убрать из кода (он у тебя несколько раз встречается на страничке).

Также в коде есть и другие ошибки (просмотри его внимательно). Например, код гугл аналитикс нужно ставить в конец содержания, непосредственно перед закрывающим тегом /body (в footer.php). У тебя же он стоит как раз наоборот: сразу после открывающего тега body.

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

Внизу же статьи слова

  • При копировании материалов сайта сохраняйте активную ссылку на источник.
  • Вам понравилась статья? Вы можете поделиться заметкой с друзьями! Нажмите на кнопку вашей соц.сети!

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

Форма подписки, имхо, спрятана очень далеко внизу и не дает полного понимания, зачем она нужна.

Я предлагаю поставить ее наверх, изменив надпись. Вместо слов: Хочу получать свежие статьи на е-меил, можно написать что-то вроде:

Хотите получать свежие статьи сайта «Мир Свадьбы» на электронную почту? Подпишитесь на нашу рассылку.

В поле подписки желательно добавить слова: введите сюда свой е-майл адрес. Вот что-то вроде этого:

На главной странице отсутствует тег h1. Советую обязательно его добавить. Например, можно добавить название сайта в h1 (или что-то вроде того, что я сделала на картинке) вместо блока рекламы от гугла. Примерно так:

Кстати, блок от гугла на главной выглядит как меню (это нарушение правил адсенса), я бы убрала его с главной странички, а в статьях оставила бы.

В статистике ли-ру я увидела, что

Средняя длительность (мин.) — 1,1
Просмотров на посетителя — 1,9

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

Есть что добавить к этому аудиту (он ведь далеко не полный)? Пишите. Будем учиться вместе.

Verytruth

Поделиться с друзьями
  • Ольга, спасибо, отличная статья. Многих вещей по юзабилити не найдешь ни в одном учебнике, а на примерах все становится яснее.

    зы: я-то этих моментов на сайте Марси даже не заметила)))

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

  • Anatol

    Статья хорошая. На счет рекламного блога Гугл не согласен. Он не нарушает правила адсенс. Там нигде не написано меню и тест на блок не налазит.

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

    Исправила. Пока не знаю чего еще исплавлять. Но хочется увеличить кол-во просмотров.

  • К аудиту Мир.свадьбы добавлиа бы еще свои 5 копеек.

    Заголовки к статьям на главной выглядят мелко, увеличить шрифт не мешало бы. Так как шрифт и ширина контентной части довольно большие.

    Гугл адсенс я бы 100% поставила бы в начале и в конце страниц, повысит доход олнозначно, а эти ссылки сверху убрать.

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

    В шапку сверху названия сайта добавила бы двух голубей белых или кольца.

  • Florentina

    Сайдбары прижимаются к внешней границе поля. Выглядит очень неопрятно.

    Миниатюры разного размера – не придают сайту доверия!!! Для некоторых миниатюр всплывает в подсказках английский текст. Ссылки с миниатюр на главной ведут на картинки. Зачем?

  • Спасибо большое, Ольга :)) Часть из того, что написано мне известно, что-то исправляю, но мееедленно, Часть постоянно остается на потом, тк думала это не существенно… Но и есть некоторые моменты (с тизерами, например) -с которыми я вообще не знала что делать (попробую переписать названия картинок). И есть то, что я вообще не замечала (н-р, рассылка на емэил).
    по порядку с чем согласна-не согласна.

    1. наличие 2х главной. Раньше она была статичной, потом решила сделать динамичной. До сих пор не знаю какую выбрать :))) Пожалуй статичную переведу в «О сайте» и «украшу»:)

    2. Рубрики меню. По-моему вполне конкретные и понятные названия. Какие еще могут быть традиции на свадебном сайте? А добавив слов в названия рубрик, менюшка будет перенасыщена текстом.
    С пунктом «услуги» -согласна полностью, исправлю 🙂

    3. Левый Сайдбар.
    да, это сбой в плагине. Лучшее на сайте -там лучшие статьи. Почему-то у некоторых названия исчезли не могу разобраться 🙁 высота там стоит авто,так что не из-за этого. :)))делать хочу, но пока не красиво :)))

    4. Правый сайдбар. по-моему количество рубрик нормальное, людям не приходится думать где же искать то что им надо. Дочерние рубрики пожалуй можно сделать всплывающими. Только вопрос- как? Раньше у меня стоял плагин, но у него было ограничение символов в названиях, и смотрелось коряво. Поэтому его убрала и оставила как есть 🙂

    5.Мелкие недочеты. Согласно со всем кроме «блока гугла» -по-моему он отличается от меню очень сильно….
    По поводу рассылки новых статей на почту — у меня тоже сомнения…я вообще хочу убрать этот блок…вот сейчас ты мое внимание к нему привлекла -так что точно уберу :))) вместо него поставлю форму рассылки через сабскрайб, скорей всего в сайдбаре…

    Все таки взгляд со стороны это здорово 🙂 Оля, еще раз спасибо 🙂

  • У тизеров под статьей проверила названия картинок. У тех которые отображаются -название написано на руссоком. А у тех которые не отображаются- на латинице….вот и поими их…

  • Очень понравилась статья.

  • Все подправила, еще и дизайн сменила 🙂

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

  • Над этим сайтом (webledi.ru) тоже нужно поработать 🙂 Хотя бы устранить выступ фотографий за область контента…