Designa för webb 2.0.1
Det börjar bli tjatigt att höra uttrycket Webb 2.0. Utöver nya tekniker med CSS och JavaScript har designen av användargränssnitt (webbdesign) tagit ett stort kliv framåt.
Om du är ny eller dåligt uppdaterad, hjälper den här guiden dig att komma igång med modern webbdesign. Interaktiv webb och AJAX? Tyvärr kommer jag i den här guiden bara fokusera på den grafiska aspekten.
Enkel design
Det omtalade designyttrycket “Less is more” är verkligen något att ta efter inom modern webbdesign. Använd bara de designelement som fyller någon funktion, resten får inte vara med.
Tydligt separerat innehåll
Låt din design andas med hjälp av marginaler och rymd. Gruppera innehåll som hör ihop, och separera sedan dessa grupper tydligt från varandra med mellanrum.
Stor text
Tack och lov är pixeltypsnitten nästan ett minne blott, idag är det en fördel att använda en rubrik med 28 px (pixlar) i textstorlek. Att tydligt skilja rubriker, underrubriker och vanlig text i storlek och typ hjälper såväl dina användare som sökmotorerna att urskilja intressant innehåll på din webbplats.
Gradient
Toningar eller gradient kan tillföra mycket till en design, om de används på rätt sätt. De kan skapa djup i en platt design eller ge en kraftfull effekt på element, text och logotyper.
Centrerad layout
Att centrera innehåll på en datorskärm är ofta en optimal lösning när man vill förmedla information, detta gäller även på webben.
Färre kolumner
Med större rubriker och separerat innehåll är det svårt att få plats med 14 kolumner. Enkel design ger mindre layout och möjliggör större frihet i innehållet.
Separat sidhuvud
Genom att tydligt separera sidhuvudet med färg och/eller form hjälper du dina användare att enkelt urskilja det viktiga innehållet.
Enkel navigering
Utan en enkel navigering på din webbplats kan användare lämna din webbplats på några få sekunder. Var inte för kreativ vid design av navigeringsmenyer och markera tydligt var användaren befinner sig.
Tydlig och enkel logotyp
Vem är du? Den frågan besvaras snabbast genom en tydlig logotyp.
Starka färger
Ofta används neutrala färger i kombination med en eller två starka färger för att ge karaktär till en design med koppling till ett varumärke.
Texturer
I bakgrunder eller element kan texturer som liknar trä, betong, papper eller tyg användas för att följa ett koncept eller ge designen ett djup. Men se upp, det kan lätt gå över styr.
Reflektioner
Skapa djup i din logotyp eller objekt med reflektioner. Nyckeln till reflektioner är att använda en låg opacitet och alternativt i kombination med oskärpa, vilket gör den mer realistisk.
Blankpolerade ikoner
De blanka ikonerna är ett signum inom modern webbdesign. Men de kräver en enkel och ren grunddesign för att komma till sin rätt. De kan lätt ses som kladdiga om placerade i en redan komplex och färgstark design.
Grå text
Att inte ha en helsvart (#000) text mot en vit (#fff) bakgrund ger en något mjukare kontrast, vilket uppskattas av många användare. Var dock försiktig med att välja en alltför ljus textfärg (låg kontrast), detta kan skapa fina textblock men vara nästintill omöjliga att läsa.
Tack för att du tog dig igenom den här guiden och jag hoppas den hjälper dig i ditt nästa projekt. Har jag missat något som utmärker webbdesign version 2.0?