Knappbeskrivningar och informationstips

Artikel
03/12/2025

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.

En knappbeskrivning är ett litet popup-fönster som etiketterar den omärkta kontroll som pekas på, till exempel omärkta verktygsfältskontroller eller kommandoknappar.

Skärmbild som visar utskriftsknappen med knappbeskrivningen

En typisk knappbeskrivning för en knapp i verktygsfältet.

Eftersom knappbeskrivningar har visat sig vara så användbara finns det en relaterad kontroll som kallas infotips, som ger mer beskrivande text än vad som är möjligt med knappbeskrivningar.

En infotip är ett litet popup-fönster som kortfattat beskriver objektet som pekas på, till exempel beskrivningar av verktygsfältskontroller, ikoner, grafik, länkar, Windows Explorer-objekt, Start-menyobjekt och knappar i aktivitetsfältet. Informationstips är en form av progressiva sekretesskontroller, vilket eliminerar behovet av att alltid ha beskrivande text på skärmen.

skärmbild av delningsknappen med infotip-

En typisk infotip.

I den här artikeln kallas knappbeskrivningar och informationstips gemensamt för tips.

Tips hjälper användare att förstå okända eller okända objekt som inte beskrivs direkt i användargränssnittet . De visas automatiskt när användarna hovra pekaren över ett objekt och tas bort när användarna klickar på kontrollen eller flyttar musen, eller när tipset överskrider tidsgränsen.

Utvecklare: Det finns ingen infotip-kontroll; infotips implementeras med knappbeskrivningskontrollen. Skillnaden är i användning, inte implementering.

Not

Riktlinjer som rör ballonger, verktygsfältoch Hjälp visas i separata artiklar.

Är det här rätt kontroll?

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

Visas informationen baserat på pekarens hovring? Om inte använder du en annan kontroll. Endast visningstips som resultat av användarinteraktion visar dem aldrig på egen hand. Däremot kan ballonger visa på egen hand (som de gör med meddelanden), så att de har en svans som identifierar källan.
Har en kontroll en textetikett? Om inte använder du en knappbeskrivning för att ange etiketten. Observera att de flesta kontroller ska vara märkta och därför inte har knappbeskrivningar. Verktygsfältskontroller och kommandoknappar med grafiska etiketter bör ha knappbeskrivningar.
Har ett objekt nytta av en kompletterande beskrivning eller ytterligare information? I så fall använder du en infotip. Texten måste dock vara kompletterande, vilket inte är nödvändigt för de primära uppgifterna. Om det är viktigt lägger du det direkt i användargränssnittet så att användarna inte behöver identifiera eller jaga efter det.
Är tilläggsinformationen ett fel, en varning eller status? I så fall använder du ett annat gränssnittselement, till exempel en pratbubblan, felmeddelandeeller statusfältet. Infotips för meddelandeområdesikoner är ett undantag eftersom de kan användas för att visa statusinformation.
Behöver användarna interagera med tipset? I så fall använder du en annan kontroll, till exempel en ballong. Användare kan inte interagera med tips eftersom om du flyttar musen försvinner de.
Behöver användarna skriva ut kompletterande information? I så fall använder du en annan kontroll, till exempel ett statiskt kommentarsfält. Du kan dock också använda informationstips för att ge mer direkt åtkomst till den här informationen.

I det här exemplet gör ett statiskt kommentarsfält i Microsoft Word att användarna kan skriva ut kommentarer.
Är kontexten sådan att användarna kan tycka att tipsen är irriterande eller distraherande? I så fall bör du överväga att använda en annan lösning, inklusive att inte göra någonting alls. Om du använder tips i sådana sammanhang kan du låta användarna inaktivera dem.

När de används på rätt sätt förbättrar tips kommunikationen med användaren. Använd aldrig tips som ersättning för bra design. Om en bild, knapp eller ett annat objekt kräver att användarna fortsätter att kontrollera ett tips för att förstå det, är designen dålig. Åtgärda designen i stället.

Designbegrepp

Tips är ett kraftfullt sätt att förenkla ett användargränssnitt. De tillhandahåller information som användarna behöver när de behöver den, med minimal ansträngning från deras sida. Tips kan hjälpa dig att använda skärmutrymme mer effektivt och minska skärmtrasslet. Men dåligt utformade tips kan vara irriterande, distraherande, ohjälpsamma, överväldigande eller i vägen. Följande designbegrepp är avsedda att visa skillnaden.

Upptäckbarhet

Tips visas automatiskt när användare hovra pekaren över ett objekt under en tidsperiod. Den här mekanismen för tidsfördröjning gör tips mycket praktiska, men det minskar också deras identifiering.

Med tiden får användarna lära sig att vissa standardobjekt som verktygsfältsknappar, grafiska knappar, Start-menyalternativ och ikoner för meddelandefältet har tips, så att du kan ta deras identifiering för givet.

Det tar längre tid för användarna att identifiera tips på platser som inte är standard. Det finns ingen visuell ledtråd, till exempel en frekvent punkt eller pekarändring, som indikerar att ett objekt har ett tips. Ännu värre är att vissa användare flyttar musen runt mycket, särskilt när de lär sig att navigera i användargränssnittet. Användarna måste veta att ett objekt har ett tips, antingen genom tidigare erfarenhet eller genom experimentering.

Du kan förbättra identifieringen genom att använda tips konsekvent, vilket i sin tur främjar förutsägbarhet. Om du ger tips för vissa objekt bör du ange dem för alla liknande objekt som användarna sannolikt vill ha kompletterande information för. Ibland kan det vara svårt att göra det, eftersom du också måste se till att tipsen är användbara och inte uppenbara.

Om det visar sig vara ett problem att tillhandahålla identifierbara, konsekvent användbara tips kan du överväga alternativa design såsom självförklarande kontrolletiketter eller kompletterande text på plats.

Lämplig information

Information som är lämplig för tips har följande egenskaper:

Koncis. Popup-fönstren som används av tips är perfekta för korta meningar och meningsfragment, samt formaterad text. Stora, oformaterade textblock är svåra att läsa och överväldigande.
Hjälpsam. Tipstexten måste vara informativ. Det bör inte vara uppenbart eller bara upprepa vad som redan finns på skärmen.
Kompletterande. Eftersom tipstext inte alltid visas bör det vara kompletterande information som användarna inte behöver läsa. Viktig information bör förmedlas med hjälp av självförklarande kontrolletiketter eller kompletterande text på plats.
Statisk. Användarna förväntar sig inte att tipsen ändras från en instans till en annan, så det är osannolikt att de märker ändringar i dynamiskt innehåll, till exempel statusinformation. Tips för meddelandeområdesikoner är ett anmärkningsvärt undantag: Användare är mer benägna att upptäcka ändringar i tipsinformationen där eftersom dessa ikoner främst kommunicerar status.

Lämpliga tidsgränser

Lämplig automatisk visning och borttagning av tips är avgörande för målet att användarna ska behålla kontrollen över sin användargränssnittsmiljö. Tips har tre timeout-värden:

Initial. Den tid då pekaren måste stå stilla för att spetsen ska visas. Standardtiden är 0,5 sekunder.
Visa igen. Tiden pekaren måste stå stilla när pekaren flyttas från ett mål till ett annat. Standardtiden är 0,1 sekunder.
Borttagning. Den tid efter vilken spetsen tas bort automatiskt. Standardtiden är 5 sekunder.

Att ha för korta initiala och återvisa värden resulterar i en irriterande, störande upplevelse eftersom de ofta skulle visas oavsiktligt, medan för långa resultat i tips känner sig svarar inte eller inte upptäcks. Standardtiden för borttagning fungerar bra för kort tipstext, som används i knappbeskrivningar. Infotips har längre text, så de behöver längre visningstider.

Lämplig placering

Tips bör placeras nära objektet som hovras, vanligtvis vid pekarens svans eller huvud om möjligt. De bör dock aldrig placeras på ett sätt som stör vad användaren gör genom att dölja föremålet av intresse. Om du förhindrar det här problemet kan du flytta tipset bort från pekaren men intill objektet. Detta är inte ett problem så länge relationen mellan objektet och dess tips är tydlig. Se till att användarna inte flyttar pekaren bara för att få programmets tips att försvinna.

Tillgänglighet

Tips har en ovanlig effekt på tillgängligheten. De utlöses normalt genom att hovra pekaren över ett objekt, men tips hanteras av skärmläsare för kontroller med tangentbordsåtkomst. När de används på lämpligt sätt för koncis, användbar, statisk, kompletterande information, kan tips förbättra den övergripande tillgängligheten. I själva verket är alt text tip-mönstret det bästa sättet att göra grafik tillgänglig. Men när de används på ett olämpligt sätt skadar de tillgängligheten genom att göra viktig eller dynamisk information svårare att få tag på.

Ge mer än ett sätt att komma åt en kontroll om den kontrollen kräver ett tips som inte har tangentbordsåtkomst.

skärmbild av utskriftsknappen med knappbeskrivning

I det här exemplet kan användare skriva ut med hjälp av verktygsfältsknappen (som inte är tillgängligt för tangentbordet) eller kortkommandot Skriv ut.

Om du bara gör en sak...

Designa identifieringsbara tips som visar kortfattad, användbar, statisk, kompletterande information på lämplig plats vid lämplig tidpunkt.

Användningsmönster

Tips har flera användningsmönster:

Användning	Exempel
Knappbeskrivningar visa etiketten för en omärkt kontroll eller glyf.	Eftersom dessa tips fungerar som etiketter följer deras text etikettriktlinjerna för den underliggande kontrollen. I det här exemplet ger knappbeskrivningen kommandoetiketten. i de här exemplen etiketterar knappbeskrivningar grafikknappar. I det här exemplet etiketterar knappbeskrivningen en glyph.
infotips ange en kompletterande beskrivning eller förklaring av ett objekt eller en kontroll.	Använd informationstips för att beskriva eller förklara objekt och kontroller, till exempel verktygsfält kontroller, ikoner (inklusive ikonöverlägg), länkar, flikar, progressiva kontroller för avslöjandeoch anpassade kontroller. I de här exemplen ger informationstips ytterligare information om kontroller och objekt.
Alternativ textinformationstips beskriva en bild för hjälpmedel.	Det här mönstret är främst för användare som har någon form av nedsatt syn och som kan använda en skärmläsare. I det här exemplet beskriver infotip bilden på Start-menyn.
miniatyrer visa en liten bild av ett objekt.	Miniatyrbilder ger en lätt igenkännlig grafisk representation av ett fönster eller dokument. I det här exemplet ger aktivitetsfältet i Windows miniatyrtips för objekten. I det här exemplet ger Windows Photo Gallery miniatyrtips för sina objekt.
Informationstips visa detaljerad information om ett objekt.	Informationstips är ett effektivt sätt att visa detaljerad information om ett objekt eller för att tillhandahålla data. I de här exemplen ger informationstips detaljerad information om ett objekt eller data.
Informationstips för Start-menyn beskriva ett objekt på Start-menyn.	Startmenyn består av programnamn och viktiga windows-mål, till exempel dokument, bilder och kontrollpanelen. Dessa tips beskriver startmenyobjekt, vanligtvis genom att ge en kort beskrivning av programmet eller målet samt de primära uppgifter som användarna kan utföra med det. Dessa beskrivningar indexeras också av sökrutan på Start-menyn, vilket ytterligare hjälper användarna att hitta de program de behöver. I det här exemplet beskriver infotip vad användare kan göra med ett program på Start-menyn.
informationstips för Kontrollpanelen beskriva en kontrollpanelskategori eller uppgift.	De här tipsen ger kompletterande information som hjälper användarna att välja rätt kategori och objekt på kontrollpanelen. I det här exemplet beskriver infotip kategorin Kontrollpanel för användarkonton.
Fullständiga informationstips för namn visa det fullständiga namnet på ett objekt när namnet trunkeras eller inte är helt synligt.	Med de här tipsen kan du visa objekt i ett mer kompakt utrymme, samtidigt som du minskar behovet av horisontell rullning. Detta är särskilt viktigt när innehållslängden är okänd eftersom den är dynamisk. till skillnad från de andra mönstren visas tipsen direkt över källobjektet när de används i listor och träd. I det här exemplet används en infotip för att visa det fullständiga objektnamnet vid hovring.
informationstips för status visa statusinformation för ikoner i meddelandefältet.	Normalt bör tips vara statiska eftersom användarna inte förväntar sig att de ska ändras från en instans till en annan. ikoner för meddelandeområdet är ett undantag eftersom dessa ikoner kommunicerar status och det inte finns något annat skärmutrymme tillgängligt för statustext. I de här exemplen ger informationstips statusinformation för ikoner för meddelandeområde.

Riktlinjer

Timeout

Använd standardtidsgränsen för inledande och återvisa tidsgränser. Undantag:
- Miniatyrbilder som inte är redundanta och visas på sidan av deras associerade objekt kan visas omedelbart (utan fördröjning). Använd dock den inledande standardtimeouten för redundanta miniatyrbilder (till exempel ett stort miniatyrtips för ett litet grafiskt objekt) eller miniatyrbilder som täcker deras associerade objekt.
För knappbeskrivningar använder du standardtimeouten för borttagning av fem sekunders tips.
För informationstips inaktiverar du tidsgränsen för borttagning av tips. Utvecklare: Eftersom du inte tekniskt sett kan inaktivera tidsgränsen för borttagning anger du det till det största värdet.
Om du behöver ange timeout-värdena till något annat än det maximala värdet för hjälpmedel, gör du dem till multiplar av SPI_GETMOUSEHOVERTIME och SPI_GETMESSAGEDURATION systemparametrar i stället för att använda fasta tider. Om du gör det justeras tidsgränserna till användarens hastighet.

Placering

Undvik att täcka det objekt som användaren ska visa eller interagera med. Placera alltid spetsen på sidan av objektet, även om det kräver separation mellan pekaren och spetsen. En del separation är inte ett problem så länge relationen mellan objektet och dess tips är tydlig.
- Undantag: Knappbeskrivningar för fullständigt namn som används i listor och träd.
felaktig:

rätt:

I rätt exempel placeras informationstipset bort från sökrutan, även om det kräver utrymme mellan den och caret.

felaktig:

rätt:

I rätt exempel är den underliggande texten mycket mer användbar än tipset, så infotip placeras långt ur vägen.
För samlingar med objekt bör du undvika att täcka nästa objekt som användaren sannolikt kommer att visa eller interagera med. För horisontellt ordnade objekt, undvik att placera tips till höger; för vertikalt ordnade objekt, undvik att placera tips nedan.

felaktig:

rätt:

I det felaktiga exemplet täcker tipset det objekt som användaren troligen interagerar med nästa.
För potentiellt distraherande (ofta stora) tips kontrollerar du att informationen är användbar för de flesta användare. Om så inte är fallet kan du antingen göra de distraherande tipsen valfria eller till och med eliminera dem. Annars måste de flesta användare flytta pekaren bort från målobjektet för att bli av med tipset.