Visuell hierarki i grafisk design

Det börjar enkelt nog. Designa en sida för en webbplats som innehåller information om ABC-företag, händelser, nyheter etc. Den här sidan kan göras på två sätt: (1) Skriv ner all information så mycket som ett informativt brev eller (2) avsnitt från varje rubrik för att göra dem utmärkta, (bild, rubrik etc.) vilket gör det lättare för en användare att hitta vad de behöver.

Ovanstående är visuell hierarki inom grafisk design. Även om båda har samma information, hur den visas kommer att avgöra om sidan / besökaren lämnar omedelbart eller stannar för att se mer.

Det främsta målet för visuell hierarki är att kommunicera. Hur du organiserar, prioriterar och ger din sida / webbplatselement högsta vikt förmedlar värdefull information om deras relativa betydelse. Denna hierarki ger förståelse, förstärker meddelanden och hjälper dig att vägleda din besökare genom din berättelse.

 

Vad är visuell hierarki?

Vi vet att en hierarki är organisationen av objekt i olika nivåer av relativ betydelse. Visuell hierarki är helt enkelt att skapa denna organisation och prioritering ur ett visuellt perspektiv.

Med hjälp av grundläggande designprinciper betonas ett element framför ett annat så viktigare innehåll ser visuellt viktigare ut. Visuella ledtrådar är utformade för att stödja den hierarkinivå som du marknadsför och organisera alla andra element på sidan för att skapa en känsla av ordning.

I grund och botten skapar du ett centrum för intresse på varje sida och kommunicerar betydelse genom kontinuitet i bild eller stil genom upprepning. Detta gör det enkelt att markera de åtgärder du vill att dina besökare ska vidta och hjälper till på din webbplats designade rörelse- och flödesmönster. I slutändan kommer varje sida att bidra till den övergripande historien som varje sida bidrar med och blandar med webbplatsen.

 

Varför är det viktigt?

Vikten är ganska enkel. Vi är visuella varelser. Vi förstår bilder snabbare än ord. Webbsidor och webbplatser innehåller stora mängder information att kommunicera. När vi söker och landar på en sida finns det ett omedelbart behov av att förstå var svaren på våra frågor är utan dröjsmål.

• Är min information här?
• Var finns det på den här sidan?
• Hur slutför jag min uppgift om den inte är det?
• Med hjälp av visuella hierarkier möjliggör designers lättare skanning av sidor och visuellt verkställer specifika rubriker, ämnen, information lättare att förstå. Det kan beskrivas som att rensa en stig i skogen för att se din destination direkt.

 

Kommer du ihåg våra sidalternativ tidigare? En som ett brev och en annan med bilder, rubriker etc.? För att använda bokstäverna skulle en användare behöva göra mycket arbete för att hitta sin information, mycket mindre avgöra om själva sidan är användbar. Användaren har inget annat val än att läsa varje ord för att slutföra sin uppgift. Det andra alternativet gör sidan lättare att skanna. Varje avsnitt listas eller markeras så att identifiera den information som krävs görs mycket snabbt.

Det finns ett inbyggt ändamål för varje designad sida. Varje sida ska ha ett mål. Ibland är det helt enkelt att få informationen läst, annars kan innehållet ge din besökare anledning att gå in i en försäljningstratt. Varje sida som utformas bör ha ett primärt element som du vill att dina besökare ska märka.

 

Hur är det viktigt?

Denna process använder de grundläggande principerna för design för att producera visuellt övertygande layouter.

• Kontrast
  • Visar den relativa betydelsen.
  • Du inser omedelbart att en större text eller rubrik har större betydelse.

• Upprepning
  • Fäster mening till nya element.
  • Det bästa exemplet är de understrukna blå länkarna på en sida. Du har lärt dig att de symboliserar en klickbar länk. Nu är varje sida du ser de omedelbart igenkännbara som en metod för att söka ytterligare information om ett specifikt ämne.

• Inriktning
  • Detta skapar ordning.
  • Denna process gör att besökaren snabbt kan ansluta element över en sida, vilket ger besökaren en start- och slutpunkt att arbeta från. Det är nog bäst att tänka "nät" här.
  • Med hjälp av inriktning kan vi föra ett enda element framåt för att uppmärksamma sig själv. Om du tänker på citat är detta ett exempel på en effekt. En textrad som står mitt i två stycken.

• Anslutning
  • Processen med att gruppera element i en hierarki för att skapa underhierarkier.
  • Din webbplats hemsida erbjuder produkter, tjänster, om oss, kontakta oss rubriker.

Allt ovan styrs med hjälp av följande designmekanismer.

• Storlek
• Färg
• Densitet
• Värde
• Mellanslag
• Visuellt specifikt - form, framträdande, bilder

 

Slutgiltiga tankar

Visuella hierarkier ger ordning på ordning. Genom att prioritera erbjuder de tydlig kommunikation. Det är viktigt att använda kvalificerade erfarna proffs som kommer att arbeta med dig om innehåll och design.