Oddělujte, nenořte!

Jedna ze základních pouček použitelnosti říká, že by uživatel neměl být nikdy zmaten z ovládání webu.

Na začátek jeden test. Co myslíte, že znamená následující navigační řádek:

Domovská stránka > Weblog > Osobní

Asi většina z vás odpověděla, že je to tzv. drobečková navigace (bread crumb) – tj. řádková navigace, která zleva doprava zobrazuje zanořování do navigační struktury webu. Úplně vlevo stojí domovská stránka, jsme zanořeni do weblogu a nacházíme se pravděpodobně v osobním weblogu.

Chyba lávky! Výše uvedený příklad nezobrazuje drobečkovou navigaci, ale znak > byl použit pro oddělení položek na podobné úrovni hierarchie. Tvůrce měl asi na mysli toto:

Domovská stránka | Weblog | Osobní

Vysvětlení je prosté. Uživatel ve znaku > vidí šipku, která jej vede z jednoho místa na druhé. Naproti tomu znak | odděluje. Výsledkem je pak úplné zmatení. A to vše kvůli jedinému znaku.

Souvislosti

Pixy: komentáře, diskuze a spol.

Petr Staníček obsáhle rozebírá použití komentářů a diskuzí. Doporučuji k přečtení všem, kteří chtějí takový způsob kontaktu se čtenáři, nebo něco podobného už na svém webu mají.

Já bych zdůraznil tři myšlenky:

  • Komentáře řadit chronologicky od nejstarších – proč někteří blogeři (snad) bez rozmyslu dávají komentářům stejné řazení jako spotům ve weblogu? Vždycky mě nadrvedně, že té diskuzi nějak hůř rozumím. Že se mi zdá, jako by myšlenka postupně retardovala. Bodejť, když je vše vzhůru nohama.
  • Zadání komentářů musí být snadné – takže (skoro) žádné povinné údaje. O co vám jde? Chcete přece názor čtenářů. Tak proč jim házet klacky pod nohy.
  • Nechci nadpisy – proč musí komentující vymýšlet nějaké nadpisy?

Já bych snad doplnil ještě:

  • Uvést datum a čas komentáře.
  • Zobrazovat text komentovaného spotu (článku) – někdy mi připadá, že komentující glosuje úplně něco jiného.

Stylování vnořených seznamů

Dan Cederholm zveřejnil pěkný návod, jak pomocí kaskádových stylů měnit vzhled vnořených seznamů. Spot Styling Nested Lists na příkladu mapy webu nabízí definici CSS pro netříděný seznam tří úrovní.

Autor využívá definici následníků (kráceno):

#sitemap li { list-style: none; }

#sitemap li ul { font-size: 90%; }

#sitemap li ul li ul li { padding-left: 16px; }

Cvajmal Pixy

Petr Staníček prosí: Nesměrujte odkazy do nových oken. Co dodat? Třeba tohle:

Když to mám shrnout tak jsem proti neohlášenému otvírání odkazů do nových oken. Uživatele to zmate (už jsem to viděl tolikrát) a navíc pokud se někdo na náš web nevrátí, je to proto, že se tam vrátit nechce.

Petr Staníček vzápětí přidal spot K čemu je Lynx? Užitečné čtení pro zastánce trtdlování a další tip pro testování použitelnosti.

Floatutorial

Russ Weakley, autor Listamatic, Listamatic 2 a Listutorial, vydal Floatutorial. Pokud se chcete nechat vést krok za krokem směrem k dokonalým seznamům s využitím CSS, sáhněte po některém ze jmenovaných nástrojů.

Floatutorial v jednotlivých krocích pomáhá autorovi tvořit plovoucí prvky (obrázky, tlačítka, řádkové seznamy atd.). Každý krok obsahuje popis úkonu, příklad, CSS kód a HTML kód. Nové části kódu jsou odlišeny barvou a tloušťkou písma. Na závěr následuje stránka s popisem všech kroků pěkně pohromadě. Velmi názorné.

Dodatečná navigace od gorily

Na světě je další ze série D. Keith Robinson\’s Gorilla Web Tips. Tip číslo 11 je věnován dodatečné navigaci.

Každý tvůrce webu by měl mít na paměti, že návštěvník nepřichází tak, jak by autor webu chtěl a potřeboval. Návštěvník obrazně řečeno přijde oknem od záchoda a ne přes halu. Proto je důležité mu nabídnout vhodnou navigaci.

Článek o dodatečné navigaci uvádí tyto možnosti dodatečné navigace:

  • mapa webu,
  • zkratkové menu,
  • drobečková navigace.

Při návrhu navigace mějte na mysli:

Supplemental navigation can be useful if done right. It\’s very important to note that not one of these techniques will replace a good primary navigation structure and, with the exception of a site map or index on a large site, should only be used if there is good reason.

Délka citace: blockquote a q

Značky blockquote a q se používají pro označení citací (nikoli pro pouhé formátování):

blockquote
Bloková citace delší než 10 slov.
q
Řádková krátká citace do 10 slov.

Asi se pozastavíte nad tou 10. Toto alespoň uvádí Technique 3.7.2 [priority 2] Verify that Q and BLOCKQUOTE are used properly:

Requirement:

  • Inline quotes (marked with Q) have at least one word in front of, or behind, the quote text and are less than 10 words
  • Long quotes (marked with BLOCKQUOTE) are greater than 10 words.

Nevím sice co dělat v případě, že má citace právě 10 slov, ale nějak si už poradím.