De 3 Komponenterna av Bra Webdesign

Bra design handlar inte bara om bra utseende, och ingenstans är det här snabbare än i webbdesign. Det är faktiskt vettigt att tänka på webbdesign som består av tre stora icke-tekniska komponenter: estetisk design, informationsdesign och gränssnittsdesign. Om du vill vara en bra webbdesigner är det viktigt att du har ett bestämt grepp om alla tre.

Det här inlägget är dag 2 i vår webbdesignsession. Creative Sessions "Session Day 1Session Day 3"

Estetisk design

Estetisk design handlar om att få utseendet rätt. Om du är bra på det betyder det att du kommer att kunna designa webbplatser som inte bara ser bra ut men är lämpligt designad. Olika mönster överför olika meddelanden till en slutanvändare, så det är viktigt att en design matchar webbplatsens meddelande.

Den andra dagen gick jag igenom en stormarknad och såg ett juice märke som hade den visuella designen av tvättmedel. Det var bara något om hur lådan gjordes, att jag tillfälligt undrade varför det var tvättmedel i fruktjuicegången. På samma sätt ger en webbplats ett olämpligt paket för innehållet och meddelandet - även om det är en riktigt snygg paket, är ett dåligt slutresultat. Det är därför som det är väldigt viktigt som webbdesigner att du inte bara följer fads och trender blint. Du måste alltid tänka inte bara hur du kan göra en webbdesign ser bra ut, men ser också lämplig ut.

Av de tre komponenterna i webbdesign är estetisk design det som folk mest identifierar som varelse design. En sak som jag tycker är intressant om estetisk design är att det är bedrägligt svårt. Jag kommer ihåg en gång att designa en affisch och visa den till en vän som kommenterade "Åh det är bara några rader och lite text, du måste ha gjort det på ungefär tio minuter" - ah glädjen att vara designer!


Information Design

Informationsdesign handlar om att förbereda informationen på en webbplats på bästa möjliga sätt, så att användarna effektivt och effektivt kan hitta och smälta information. På större sidor blir det bara utmanande att hitta information, men i såväl stora som små bearbetningar är det alltid ett designproblem.

Ett snabbt exempel på informationsdesign är hur du organiserar och formaterar text på en sida. Eftersom folk tenderar att skumma igenom innehåll på en skärm, är det mycket bättre att organisera det med rubriker och underrubriker, diagram och visuella krokar och allmän variation för ögat. Tekniker som dessa gör informationen på en sida mycket lättare att smälta. Men informationsdesign är inte begränsad till vad som finns på en enda sida, det handlar också om vilka strukturer du använder för att hysa webbplatsens delar, hur du lägger ut menyerna och undermenyerna och hur du korsar länkade olika sektioner.

Du kanske är intresserad av att veta att i större och mer komplexa projekt och sidor finns det faktiskt ett helt yrke dedikerat till modellering och strukturering av information som heter Information Architecture. Den mest kända informationsarkitekten som jag känner till är Jesse James Garrett som för övrigt utsåg termen AJAX. Han är ganska snygg och du kan läsa om honom på Wikipedia.


Collis 'Awesome Diagram

Eftersom vi pratar om informationsdesign verkar det som ett bra tillfälle att göra 6 stycken av Waffley-text till ett diagram, så jag presenterar för dig mitt fantastiska diagram över komponenterna i webbdesign! Bask i sin röda och gråa awesomeness!


Gränssnittsdesign

Gränssnittsdesign är arrangemang och smink av hur en användare kan interagera med en webbplats. Ordet gränssnitt betyder en punkt eller yta där två saker berör. Så ett webbanvändargränssnitt är där en person och en webbplats berörs - så menyer, komponenter, formulär och alla andra sätt du kan interagera med en webbplats.

Bra gränssnittsdesign handlar om att göra upplevelsen av att använda en webbplats enkel, effektiv och intuitiv. Det är faktiskt mycket lättare att visa dålig gränssnittsdesign eftersom det är när du märker det verkligen. Ett enkelt exempel på gränssnittsdesign är användningen av ikoner. Har du någonsin tittat på en ikon och tänkt "vad betyder det för att representera ?!" - Det skulle vara dåligt gränssnitt design. Använda ikoner för att märka och beteckna olika typer av innehåll eller handlingar är bara en del av gränssnittsdesign.

För övrigt ett annat exempel på gränssnitt som du sannolikt kommer att möta som webbdesigner är Application Programming Interfaces eller API. Ett API är uppsättningen funktioner och protokoll som du (eller ditt program mer exakt) kan interagera med vad API-en är för. Så till exempel tillhandahåller Google Maps ett API som du kan använda för att skapa program eller webbplatser som fungerar med Google Maps.


Vad sägs om…

Nu kanske du tänker, det är allt väldigt bra och bra Collis men var passar CSS in i det här? Eller hur är det med Flash? Tja, som jag säger, det här är de tre ej-tekniska aspekter av webbdesign. På flipsidan finns alla dessa tekniker och färdigheter som HTML / CSS, Flash, Javascript och så vidare. Men jag tenderar att tro att de är mer en del av webbutveckling än webbdesign. På samma sätt som det är viktigt att skilja HTML och CSS för att hålla informationen och presentationen separat, kan man argumentera för att hur man gör en design till verklighet skiljer sig från själva utformningen. I enklare termer är det att veta en viss CSS hack något att göra med design?

Förse mig inte fel, du behöver veta hur man bygger saker för att utforma dem på ett lämpligt sätt. Men när det gäller att säga vad som gör webbdesign, är mitt svar fortfarande gränssnittsdesign, informationsdesign och estetisk design.

Vad tar du med? Har jag missat någon väsentlig del av webbdesign? Eller tycker du att webbutveckling är en väsentlig del av webbdesignen själv?

Senare i veckan kan du läsa mer djupartiklar av tips och tricks för var och en av dessa tre komponenter i webbdesign - gränssnittsdesign, estetisk design och informationsdesign. Faktum är att den första kommer att gå upp på några korta timmar.

Det här inlägget är dag 2 i vår webbdesignsession. Creative Sessions "Session Day 1Session Day 3"