Приказка за Капитал 5.1 и трите падащи менюта

Публикувано на: July 21st, 2010 | Автор: Петя | В категория: Секво | 11 коментара »

Не харесвам падащи менюта. Идеята, че са нужни в Капитал дойде от Ivgin в седмицата преди да пуснем новия сайт през март.

Тогава я анатемосах, мрънках ужасно, търсих аргументи против в статии за ползваемост, в мнения на разни хора, в първоначалната логика на сайта (според която много открояващата се пътечка от трохи над публикациите служи за навигиране и затова не ни трябва поднавигация), в какво ли не, но само аргументът ми, че падащите менюта ще покриват рекламните формати успя да обори упорития дизайнер и да спечели екипа. Пуснахме сайта без тях.

И се започна:

“Не знам къде съм и как съм стигнал до там.” (анонимен, 23 март 2010)
“За да стигнеш до подрубрика трябва да минеш през индексна страница, това е неприемливо!” (Ш1, която започна да негодува за това през февруари и никога не спря)
“Влизам в статията сега, а как да се върна, а да… ей го back бутонът” (#susednotoburo, май 2010)

За четирите месеца след старта на Capital.bg получихме достатъчно обратна връзка, че лично аз да поставя въпроса за поднавигация обратно на масата. Решихме да я включим в първия пакет промени по Capital.bg, който е факт от вчера.

Защо?

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

- Закрива един от основните рекламни формати и части от съдържанието, когато са активни
- Чупи оригиналния дизайн, в който любимото ни нещо беше колко е опростена структурата (само едно ниво навигация)
- По-сложна навигация, повече възможности = по-голяма неизвестност, неясни
- Невъзможна под IE6 Изискват допълнително време за разработка под IE6 (в крайна сметка взехме решение с този браузър да оставим стария вариант на навигацията)

Гледахме няколко различни варианти, представям ви ги тук. В крайна сметка може да видите какво решение взехме.

Вариант 1: Падащи менюта, които се активират при преминаване с мишката над основната секция.

Вариант 2: Хоризонтална поднавигация, отворена постоянно в подсекции, за да улесни преминаването от една подсекция в друга. Изчезва на home page. Минус – сайтът скача нагоре-надолу и вкарваме потребителя в почуда защо поднавигацията изчезва.

Вариант 3: Хоризонтална поднавигация, която се появява при преминаване с мишката над менюто.

Вариант 4: Падаща поднавигация, която се отваря при преминаване над основната секция и избутва сайта надолу, не покрива рекламните формати или съдържанието. В случая с блоговете ефектът е внушителен.

Финалният вариант. Падащи менюта, които реагират на преминаване през основната секция, независимо в коя част от сайта се намирате.

Всеизвестно е, че проект мениждърите ненавиждат обратната връзка (предполага промяна в спецификацията, спорове с програмистите, с дизайнерите, изобщо…). Но не се колебайте да стреляте. Разгледайте вариантите и споделете според вас правилно решение ли взехме?

Cheers!

– Петя

P.S. Ако сте фен на сайта, задължително разгледайте галериите в Crop, блога за визуална журналистика, на цял екран.


11 коментара за “Приказка за Капитал 5.1 и трите падащи менюта”

  1. 1 Димитър Панов рече в 11:34 на July 21st, 2010:

    “- Невъзможна под IE6 (в крайна сметка взехме решение с този браузър да оставим стария вариант на навигацията)”

    А, така. Ама това просто не е вярно.

    Не дали на вашите кодъри не им се занимава или просто не знаят как да ги направят, но падащи менюта могат да се направят без особени проблеми и за IE6.

    Това, че :hover не се поддържа от IE6 не значи, че няма други варианти, които да свършат работа. Ползвайте JS в крайна сметка. Всички по-известни JS библиотеки биха ви свършили работа (jquery, което виждам, че ползвате също ще ви свърши работа), ако щете ползвайте и чист JS даже.

  2. 2 Петя рече в 12:09 на July 21st, 2010:

    Димитър, мерси за забележката.

    Разбира се, че не е вярно, че са невъзможни. Истината е, че обсъдихме усилията, които ще коства и взехме решение, че няма да разработваме специално за IE 6.

    Като цяло единственото нещо, което ни спира изобщо да спрем да разработваме и дебъгваме за този браузър, е че все още немалък процент от потребителите на повечето ни сайтове го използват. И тъй като сме убедени, че това са хора, които нямат възможност да преминат на по-нова версия, все още правим усилия сайтовете да са ок и под IE 6.

    Но това си е тема за цяла друга дискусия.

  3. 3 Tweets that mention Блог на Икономедиа » Blog Archive » Приказка за Капитал 5.1 и трите падащи менюта -- Topsy.com рече в 13:18 на July 21st, 2010:

    [...] This post was mentioned on Twitter by Христо Иванов, Petya Raykovska. Petya Raykovska said: Mалко помрънках за падащите менюта на Capital.bg в :E блога: http://tinyurl.com/32blvsz [...]

  4. 4 Събина рече в 14:06 на July 21st, 2010:

    Вариант 2, но обикновено това, че аз харесвам нещо е сигурен знак, че другите няма да го харесат.

  5. 5 WebCrusader рече в 15:25 на July 21st, 2010:

    Просто IE6 не заслужава да му блъскаш JS код за да подкара падащи менюта специално за него.

  6. 6 Joko рече в 16:42 на July 21st, 2010:

    Вариант 2.

  7. 7 Боримечка рече в 17:58 на July 21st, 2010:

    Вариант 2 не работи, защото не може да събере повече от 6-7 немного дълги линка.

    А в Капитал секциите са с дълги имена и много :)

  8. 8 dimi рече в 07:45 на July 23rd, 2010:

    №3 – hands down

  9. 9 Атанас Янев рече в 18:28 на July 26th, 2010:

    Хоризонталните под-менюта изглеждат добре, но в реални условия се представят престъпно зле.

    Сега са супер, само бих препоръчал горещо да се обърне внимание на цветовете – тъмен фон и бели букви != добро.

    Съветвам да промените фона на бял, а буквите да са тъмно сиви или черни.

    Поне опитайте, нищо не губите :)

  10. 10 Croesus рече в 16:11 на August 3rd, 2010:

    http://econsultancy.com/blog/3543-huge-drop-down-menus-good-for-usability-nielsen

  11. 11 Тихомир рече в 02:29 на August 7th, 2010:

    И малко под Опера да потесвате – от време на време гърми.


Коментирайте!