32.13.1 Rullgardinsmenyer på webben bör fungera som vanliga datormenyer

• Bör
• www.anvandbart.se/ab/rullfunktion

Det finns starka konventioner för hur en rullgardinsmeny skall fungera, inhamrade genom att användaren ständigt möter dem i alla program hon använder. Om dina rullgardinsmenyer fungerar på ett annat sätt går de på tvärs mot användarens vanor och blir ett irritationsmoment.

• Blanda inte rullgardinsmenyns och den vanliga menyns sätt att fungera.

En rullgardinsmeny får inte innehålla länkar som går direkt till en sida. Alla länkar i en rullgardinsmeny måste fälla ut en meny. Om de inte gör det finns det inget sätt för användaren att förutse resultatet av sitt klick, och fram till dess sidan växlar svävar hon i ovisshet om hennes klick lyckades eller ej.

Att ha små pilar eller andra indikatorer för att skilja dem som är vanliga länkar från dem som rullar ut en undermeny hjälper inte; det är för diskreta tecken för att ta sig in i användarens medvetande och minska hennes osäkerhet.

• Ovanstående gäller för första nivån. I de menyer som faller ut kan däremot menylänkar som ger resultat direkt blandas med sådana som fäller ut undermenyer (på samma sätt som denna blandning är vanlig i datormenyer).

Bild 37. På Trelleborgs webbplats finns denna rullgardinsmeny. (Skärmdumpen är manipulerad för att menyn skall synas tydligare.) Œ Första nivån (som också fungerar som global meny). Från denna faller en meny ut. Ž Menyn kan i sin tur ha undermenyer som denna. (www.trelleborg.com)

Funktion

Det finns också starka konventioner för hur en rullgardinsmeny fungerar.

• Man måste klicka på en länk för att menyn under den skall falla ner. Menyn skall inte falla ner bara för att musen passerar över den (detta är viktigt inte bara av konventionsskäl utan också för att webbmenyer brukar vara placerade en bit in på sidan, till exempel under logotypen, och det där är lätt att råka passera över dem).

• Menyn förblir utfälld till dess man gör något av följande:

• Klickar på en länk i menyn och därmed antingen går till en sida eller fäller ut en annan meny.
• Klickar någonstans på sidan.
• Trycker en tangent på tangentbordet.

• Om det finns undermenyer markeras dessa med en pil i högerkanten av menyn.

• När pekaren förs över en menylänk med pil faller undermenyn ut när pekaren befunnit sig över länken i en halv sekund. Den förblir utfälld så länge pekaren är över länken, och förblir sedan utfälld en halv sekund efter att pekaren lämnat det. (Tanken med detta är att man skall kunna gå rakt till en länk på undermenyn, inte behöva anstränga handen genom att tvingas gå i räta vinklar.)

• När man letat upp rätt menylänk, väljer man den genom att klicka. (Länkar med undermenyer skall inte reagera när man klickar på dem.)

Bild 38. Valboxmenyn liknar på många sätt rullgardinsmenyn, men byggs med annan teknik och brukar inte vara fler än en. En vanlig användning är den som syns här, för att ge användaren genvägar till populära delar av webbplatsen. (www.tele2.se)

• Undermenyerna kan i sin tur ha undermenyer. Dessa beter sig på samma sätt. (Men var medveten om att en webbplats med flera nivåer av undermenyer ofta upplevs som svårnavigerad.)

• Delar av menyn får inte försvinna in under webbläsarfönstrets kant och därigenom bli oåtkomliga.

• Länkarna i en meny kan grupperas med hjälp av horisontella linjer.

Återkoppling

Rullgardinsmenyn ger feedback på följande sätt:

• När man pekar på någon av de menylänkar som har en undermeny skall det markeras på något sätt. Här finns ingen stark konvention eftersom olika program fungerar på olika sätt, men till exempel genom att en mörkblå färgplatta visas bakom länken och dess text blir vit, eller genom att skuggor läggs runt länken så att den liknar en knapp. Den grafiska profilen bör fastslå vilken variant ni använder.

Använd inte samma markering som när man för pekaren över en vanlig länk.

• När en menylänk på första nivån klickats på och dess undermeny faller ut, kan (men behöver inte) dess markering ändras.

• Menylänkar med pil reagerar genom att fälla ut sin undermeny och bli markerad.

• Klickbara menylänkar reagerar på pekaren på samma sätt som andra länkar, till exempel genom att bli röda och understrukna (se Länken bör reagera när pekaren förs över den, sid 118).

Det måste finnas sätt för den som inte kan använda mus att ändå navigera på webbplatsen. Helst genom att menyn går att styra med piltangenterna, eller i nödfall genom att samma länkar finns tillgängliga på annat sätt. Detta är ett tillgänglighetskrav, se WCAG 9.3 (prioritet 2), sid 362.

Tyvärr gör webbläsartekniken att det inte är möjligt att ge menylänkarna kortkommandon (utan att samtidigt riskera blockera samma kommandon för webbläsaren, vilket skulle vara till­gäng­lig­hets­mäs­sigt dumt). Se Kort­komman­don , sid 231.