Дизайн и юзабилити

[Lednar94]

Сайт http://www.itsblog.org/

Блог про IT, Android, HTML, CSS и другое

Хочу услышать рекомендации по дизайну и юзабилити

PS. всякие ие6-7 в пролете

Edited August 28, 2011 by Lednar94

[pika]

При наведении на дату поста у меня вместо стрелочки появляется знак вопроса. С чего бы? (Safari)

И по-моему было бы лучше, если бы число комментов являлось одновременно ссылкой. Нажал на цифру 2 в облаке и переместился к комментариям к статье

[Softlink]

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

[ShumNo]

• Шапка ничего, но темновато
  
• Странная обводка вокруг картинок
  
• Если везде автор один и тот же, то указывать его так жирно в каждом превью ... думаю неверно, а так же информация о времени создания слишком крупно написана, учитывая, что это все таки второстепенная информация
  
• При наведении на заголовок превью появляется что-то странное
  

Все выше мною сказано, это не рекомендация к действию это мои лично впечатления

[Lednar94]

При наведении на дату поста у меня вместо стрелочки появляется знак вопроса. С чего бы? (Safari)

И по-моему было бы лучше, если бы число комментов являлось одновременно ссылкой. Нажал на цифру 2 в облаке и переместился к комментариям к статье

Знак вопроса появляется в связи с тем что дата обернута в тег <abbr> так как заметка имеет структуру микроформата hAtom.

А идея с комментариями действительно ценная! Спасибо

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

Да пожалуй и правда слишком быстро. Исправлю.

• Шапка ничего, но темновато
  
• Странная обводка вокруг картинок
  
• Если везде автор один и тот же, то указывать его так жирно в каждом превью ... думаю неверно, а так же информация о времени создания слишком крупно написана, учитывая, что это все таки второстепенная информация
  
• При наведении на заголовок превью появляется что-то странное
  

Все выше мною сказано, это не рекомендация к действию это мои лично впечатления

Опять же одной из целей было внедрение микроформатов, а автор является обязательным атрибутом в hAtom...А странное это QR код для того чтобы быстро передать ссылку на заметку в мобильное устройство

Edited August 28, 2011 by Lednar94

[yacor]

Мне нравится дизайн)) Только надпись "Блог про IT, Android, HTML, CSS и другое" не вписывается в диз, имхо.

А по юзабилити, то я сколько не нажимал на ссылки в меню, ожидал увидеть содержимое именно в блоке Слайдера (дизайн такой у вас), но никак не под ним (в основном контенте). Вот тут запутаться можно, неудобно по-моему. Я бы поместил меню ниже Слайдера.

P.S. Скорость слайдов высокая.

Edited August 28, 2011 by yacor

[Lednar94]

Мне нравится дизайн)) Только надпись "Блог про IT, Android, HTML, CSS и другое" не вписывается в диз, имхо.

А по юзабилити, то я сколько не нажимал на ссылки в меню, ожидал увидеть содержимое именно в блоке Слайдера (дизайн такой у вас), но никак не под ним (в основном контенте). Вот тут запутаться можно, неудобно по-моему. Я бы поместил меню ниже Слайдера.

P.S. Скорость слайдов высокая.

Хм...может тогда на страницах "О блоге" и "Об авторе" убрать слайдер, контакты и боковую колонку и туда поместить текст и на 2 колонки разбить его?

[buddah]

Ну наконец-то нормальный дизайн! Аллилуйя! ))

Автор молодец, все удобно.

Единственное, что режет глаза - блок с "если найдете ошибку бла-бла-бла ", он уродливый) И вообще не нужен.

Плюс тебе.

Хм...может тогда на страницах "О блоге" и "Об авторе" убрать слайдер, контакты и боковую колонку и туда поместить текст и на 2 колонки разбить его?

Да, так и сделай.

Edited August 28, 2011 by buddah

[Анна]

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

А вообще понравилось!

[Shader]

Мне понравилось! В общем круто, необычно, чем-то не похоже на другие блоги, весело и прикольно.

Edited August 28, 2011 by Shader

[cyklop77]

не дизайн конечно, но "поделиться заметкой" с мягким знаком пишется

[Temiks]

В хроме, когда наводишь на значки в споилере(моя почта, твиттер, вконтакте и т.д) дергается название темы и слово "Контакты", что очень раздражает, в других браузерах, как я понимаю такого нету(смотрел в сафари еще)

Дизайн понравился, молодец !

Edited August 28, 2011 by Temiks

[Radiocity]

Сайт http://www.itsblog.org/

Блог про IT, Android, HTML, CSS и другое

Хочу услышать рекомендации по дизайну и юзабилити

PS. всякие ие6-7 в пролете

Жирный плюсег! Давно не видел добротного дизайна. Вы его сами рисовали?

Особенно классно смотрится фоновая подсветка логотипа.

Edited August 28, 2011 by Radiocity

[Lednar94]

За основу взял дизайн из одного урока по фотошопу. Потом значительно модифицировал его.

P.S возник еще вопрос к людям хорошо разбирающимся в разметке: если не трудно посмотрите исходный код и оцените на ваш взгляд соблюдена ли семантика в той или мной мере?

[cyklop77]

покажи сам урок пожалуйста

[sigma77]

покажи сам урок пожалуйста

Похож на этот http://psd.tutsplus.com/tutorials/interface-tutorials/photoshop-paper-texture-from-scratch-then-create-a-grungy-web-design-with-it/

[yacor]

покажи сам урок пожалуйста

Похож на этот http://psd.tutsplus.com/tutorials/interface-tutorials/photoshop-paper-texture-from-scratch-then-create-a-grungy-web-design-with-it/

Точно. Это он и есть

[pika]

Почему-то каждое появление слайда у меня сопровождается какими-то дерганиями или сверканиями в их области

[mishka]

Дизайн отличный.

Юзабилити - ну блог он и есть блог.

Значительно повышает юзабилити раздел "Карта сайта". Не помешает если добавишь.

Так же галлерея вверху (http://prntscr.com/2v4qg) сделай чтобы она останавливалась при наведении на нее мышкой, читать же неудобно. Постоянно возвращать слайд приходится.

Меня раздражает эта всплывающая штука http://prntscr.com/2v4r0

Меню не похоже на меню.

Я сразу думал это табы относящиеся к черному блоку. И немог понят что же меняется. Потом понял что это такая навигация.

Может как-то визуально отделить его от черного блока, ведь оно к нему не имеет отношения.

[Bonzash]

Дизайн понравился. Единственное чтобы я сделал, в сайдбаре, у списков меню, стрелку сделал бекграундом не у <li>, а у <a>. И сделал бы выравнивание.

[Lednar94]

Обновил сайт. Изменил скорость слайдера. Добавил дизайн для мобильников и для планшетов. Изменил страницы "О блоге" и "Об авторе" - теперь они действительно в вкладках. Хочу услышать еще рекомендации.

Просьба если кто имеет iPhone, Android, планшетник просьба отписаться о глюках сайта. Лично у меня на HTC Legend заметки грузит частично с каркозябренной кодировкой. То же самое на Lg Optimus One Может кто знает сей баг...

[bonyany]

дизайн хороший, а для юзабилити - нет предмета для оценок...

[Great Rash]

Изменил страницы "О блоге" и "Об авторе" - теперь они действительно в вкладках.

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

При наведении на иконки социальных сетей все заголовки начинают прыгать (Google Chrome).

[Lednar94]

Изменил страницы "О блоге" и "Об авторе" - теперь они действительно в вкладках.

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

При наведении на иконки социальных сетей все заголовки начинают прыгать (Google Chrome).

Мне кажется что что а аякс тут нафиг не нужен :–) это блог а не веб приложение, плюс тогда семантики никакой для поисковиков не будет, да и к тому же с аяксом особо не дружу. А мелькание это чисто хромовский глюк

(css3 transform). Как исправить это не нашел. Если владеете информацией поделитесь :–)

[Great Rash]

да и к тому же с аяксом особо не дружу

Вот главная причина

Где там CSS transform используется не увидел. Появление/исчезновение тени под текстом в заголовке это transform?