Flikar

Not

Den här designguiden skapades för Windows 7 och har inte uppdaterats för nyare versioner av Windows. Mycket av vägledningen gäller fortfarande i princip, men presentationen och exemplen återspeglar inte vår nuvarande designvägledning.

Flikar är ett sätt att presentera relaterad information på separata etiketterade sidor.

En typisk uppsättning flikar.

Flikar associeras vanligtvis med egenskapsfönster (och vice versa), men flikar kan användas i alla typer av fönster.

Flikkontroller representerar de flikar som används för att organisera information i arkiveringsskåp som ofta finns i USA. (Manila-mappar används inte över hela världen.)

Not

Riktlinjer som rör layout, tabbmenyer, dialogrutoroch egenskapsfönster visas i separata artiklar.

Är det här rätt kontroll?

Du kan ta ställning till följande frågor:

• Kan kontrollerna bekvämt passa på en enda sida i rimlig storlek? I så fall använder du en enda sida.
• Finns det bara en flik? I så fall använder du en enda sida.
• Är flikarna relaterade till varandra på något uppenbart sätt? Om inte kan du överväga att dela upp informationen i separata fönster med relaterad information.
• Är inställningarna på olika sidor helt oberoende om de används för inställningar? Påverkar ändring av en inställning på en sida inställningarna på andra sidor? Om de inte är oberoende använder du aktivitetssidor eller en guide i stället.
• Är flikarna mestadels peer-datorer av varandra, eller finns det en hierarkisk relation? Om hierarkisk, överväg att använda progressivt avslöjande eller underordnade dialogrutor för att visa relaterad information.
• Används flikarna för att visa steg i en uppgift? Du kan använda "flikar" för att visa steg i en uppgift endast om de visas för att se ut som steg, och det finns ett uppenbart, alternativt sätt att komma till textsteget, till exempel en Nästa-knapp. Om stegen annars krävs använder du sidor i ett sidflöde eller en -guide. Om stegen är valfria visar du de valfria stegen med hjälp av dialogrutor i stället.
• Är flikarna olika vyer av samma data? I så fall bör du överväga att använda en delningsknapp eller listrutan för att ändra vyer. Flikar kan användas effektivt för att ändra vyer, men alternativen är enklare.

Användningsmönster

Flikar har flera användningsmönster:

Användning	Exempel
Dynamisk fönsteryta t.ex. rullningslister kan flikar användas för att öka fönsterytan för att visa relaterad information.	Med det här mönstret liknar flikar konceptuellt att placera all information på flikarna linjärt på en enda rullningsbar yta, med tabbetiketterna som rubriker. I det här exemplet ökar flikarna effektivt fönsterytan.
Flera vyer t.ex. delade knappar eller listrutor kan flikar användas för att visa olika vyer av samma eller relaterad information.	I det här exemplet ändrar flikar vyer i ett dokument.
Flera dokument t.ex. flera fönster kan flikar användas för att visa olika dokument i ett enda fönster.	I de här exemplen visar flikar olika dokument i ett enda programfönster.
Exklusiva alternativ t.ex. alternativknappar kan flikar användas för att presentera flera exklusiva alternativ. I det här mönstret gäller endast den valda fliken och alla andra flikar ignoreras.	I det här exemplet används flikar (felaktigt) som ersättning för alternativknappar. Det här mönstret rekommenderas inte eftersom det använder ett beteende som inte är standard. Flikarna fungerar som en inställning i stället för enbart ett sätt att navigera i fönstret.

Om du bara gör en sak...

Kontrollera att informationen på flikarna är relaterad, men inställningarna på olika sidor är oberoende. Den senaste flik som valts bör inte ha någon särskild betydelse.

Riktlinjer

Allmänt

• Använd vågräta flikar om:

  • Fönstret har sju eller färre flikar.
  • Alla flikar får plats på en rad, även när användargränssnittet är lokaliserat.

• Använd lodräta flikar om:

  • Egenskapsfönstret har åtta eller fler flikar.

  • Om du använder vågräta flikar krävs mer än en rad.

    

    I det här exemplet rymmer lodräta flikar åtta eller fler flikar.

• Kapsla inte flikar eller kombinera vågräta flikar med lodräta flikar. Minska i stället antalet flikar, använd endast lodräta flikar eller använd en annan kontroll, till exempel en listruta.

• Rulla inte vågräta flikar. Vågrät rullning är inte lätt att identifiera. Du kan dock rulla lodräta flikar.

  felaktig:

  

  I det här exemplet rullas de vågräta flikarna.

• För flikar i ett storleksbart fönster eller fönster placerar du en rullningslist, när det behövs, på sidan, inte fönstret eller fönstret. Flikarna ska alltid vara synliga och inte rullas ur vyn.

  

  I det här exemplet har fliksidan rullningslisten, inte fönstret.

• Kontrollera att flikarna ser ut som flikar och inte en annan typ av kontroll.

  felaktig:

  

  I det här exemplet ser flikarna ut som kommandoknappar.

Interaktion

• När kontroller endast gäller för en sida placerar du dem inom kantlinjen på sidan med flikar.
• När kontroller gäller för hela fönstret placerar du dem utanför sidan med flikar.
• Tilldela inte effekter till att ändra flikar. Flikar måste vara tillgängliga i valfri ordning. Om du ändrar den aktuella fliken får du aldrig ha biverkningar, tillämpa inställningar eller resultera i ett felmeddelande.
• Tilldela inte en särskild betydelse till den senaste flik som valts. Flikmarkering är för navigering som användarens senaste flikval inte är en inställning.
• Gör inte inställningarna på en sida beroende av inställningar på andra sidor. Placera beroende inställningar på samma sida i stället.
• Om användarna sannolikt kommer att börja med den sista fliken som visas gör du fliken sparad och väljer den som standard. Gör så att inställningarna bevaras per fönster och per användare. Annars väljer du den första sidan som standard.

Ikoner

• Placera inte ikoner på flikar. Ikoner lägger vanligtvis till onödig visuell oreda, förbrukar skärmutrymme och förbättrar ofta inte användarförståelsen. Lägg bara till ikoner som underlättar förståelsen, till exempel standardsymboler.

  felaktig:

  

  I det här exemplet lägger ikonerna till visuell oreda och gör lite för att förbättra användarförståelsen.

  Undantag: Du kan använda tydligt igenkännliga ikoner om det inte finns tillräckligt med utrymme för att visa meningsfulla etiketter:

  rätt:

  

  I det här exemplet är fönstret så smalt att ikonerna bättre kommunicerar flikarna än etiketterna.

• Använd inte produktlogotyper för flikgrafik. Flikar är inte till för varumärkesanpassning.

Mönster för dynamisk fönsteryta

• Använd inte rullningslister på fliksidor. Flikar fungerar på samma sätt som rullningslister för att öka det effektiva området i ett fönster. En mekanism bör vara tillräcklig.

• Använd koncisa tabbetiketter. Använd ett eller två ord som tydligt beskriver innehållet på sidan. Längre etiketter förbrukar skärmutrymme, särskilt när etiketterna är lokaliserade.

• Använd specifika, meningsfulla tabbetiketter. Undvik allmänna tabbetiketter som kan tillämpas på valfri flik, till exempel Allmänt, Avancerat eller Inställningar.

• Om en flik inte gäller för den aktuella kontexten och användarna inte förväntar sig att den ska göra det tar du bort den. Detta förenklar användargränssnittet och användarna kommer inte att missa det.

  felaktig:

  

  I det här exemplet är fliken Filplatser felaktigt inaktiverad när Microsoft Word används som e-postredigerare. I stället för att inaktivera den här fliken bör den tas bort eftersom användarna inte förväntar sig att visa eller ändra filplatser i den här kontexten.

• Om en flik inte gäller för den aktuella kontexten och användarna kanske förväntar sig att den ska:

  • Visa fliken.
  • Inaktivera kontrollerna på sidan.
  • Inkludera text som förklarar varför kontrollerna är inaktiverade.

  Inaktivera inte fliken eftersom det inte är självförklarande och förbjuder utforskning. Användare som letar efter ett specifikt värde skulle tvingas titta på alla andra flikar.

  

  I det här exemplet gäller inget av visningsalternativen i Läslayout. Användarna kan dock förvänta sig att de ska tillämpas baserat på tabbetiketten, så sidan visas men alternativen är inaktiverade.

Mönster för flera vyer och dokument

• Använd vy- eller dokumentnamnen på tabbetiketter.
• Undvik alltför långa tabbnamn. Om det behövs kan du antingen ha en maximal namnstorlek eller trunkera den fliketikett som visas med hjälp av ellipser. Längre etiketter förbrukar skärmutrymme, särskilt när etiketterna är lokaliserade.
• Om en flik inte gäller för den aktuella kontexten tar du bort fliken.

Mönster för exklusiva alternativ

• Använd inte det här mönstret! Använd alternativknappar eller en listruta i stället.

  felaktig:

  

  I det här exemplet används flikar felaktigt som ersättning för alternativknappar.

  rätt:

  

  I det här exemplet används alternativknappar korrekt i stället.

Etiketter

• Etikettflikar baserat på deras mönster. Använd substantiv i stället för verb, utan att avsluta skiljetecken. Mer information finns i riktlinjerna för föregående mönster.
• Använd versalisering i meningsformat.
• Tilldela ingen åtkomstnyckel. Flikar är tillgängliga via sina kortkommandon (Ctrl+Tabb, Ctrl+Skift+Tabb, Ctrl+PgUp, Ctrl+PgDn). Det råder brist på bra alternativ för åtkomstnycklar, så om du inte tilldelar åtkomstnycklar till flikar blir det enklare att tilldela dem till andra kontroller.

Dokumentation

När du refererar till flikar:

• Använd den exakta etiketttexten, inklusive dess versaler, och ta med ordfliken.
• Om du vill beskriva användarinteraktion använder du klicka.
• Formatera etiketten med fet text när det är möjligt. Annars placerar du etiketten endast inom citattecken om det behövs för att förhindra förvirring.
• Eftersom flera användningsområden kan vara tvetydiga, särskilt för en världsomspännande målgrupp, använder du enbart substantivfliken för att endast referera till en flikkontroll. För andra användningsområden förtydligar du innebörden med en beskrivning: tabbnyckeln, ett tabbstopp eller ett tabbmärke på linjalen.

Exempel: På menyn Verktyg klickar du på Alternativoch klickar sedan på fliken Visa.