Vi vet alle intuitivt hva som gjør et nettsted ser dårlig ut: overused bevel effekter, corny clip art, overfylte layouter. Disse irritasjonene er lett korrigert ved å utvikle seg med designfundamentale i tankene - de samme prinsippene som brukes av profesjonelle designere og artister.

Gode ​​nettsteder samler form og funksjon. Faktisk er godt utformede nettsteder sett på som mer troverdige, ifølge a Stanford studie og er faktisk enklere å bruke (som studert av forsker Don Norman ). Så her er fem grunnleggende for å hjelpe deg med å holde kvalitetsdesign i forkant av din praksis.

1) Følg reglene ... for det meste

I designskolen vil de gi deg en liste over prinsipper for å overholde som tilordner regler til skjønnhetselementer som layout, rekkefølge og symmetri. Men når du går videre, blir du fortalt å bryte reglene litt for å skape steder for seerens øyne for å se på ved å benytte elementer som variasjon, spenning eller kontrast.

Her er en Eksempel på en side Jeg gjorde i Edge Reflow CC. Kan du se de ulike designelementene som er ansatt, så spilles med?

2) Bruk bilder og ikoner til å kommunisere når det er mulig

Det er noen universelle ikoner som folk er opplært til å svare på. Forstørrelsesglasset (søk), huset (hjemmesiden) og disketten (lagre) er allerede innblandet i brukerne dine. Dra nytte av disse visuelle snarveier ; alle disse veiskiltene skal umiddelbart gjenkjennes for deg.

3) Farge som et designelement, ikke som dekorasjon

Farge gjør hele forskjellen, spesielt ettersom våre skjermer blir bedre på våre telefoner og tabletter. Det er en fasett av design som kan være en veldig viktig del av historien din nettside ønsker å fortelle. Bare bruk farge for å støtte innhold, ikke dekorere en side. Og ofte hvis du bruker et bilde, bør fargene i designet samples fra bildene som er brukt, slik at designet ditt har en hyggelig, felles følelse.

Jeg liker å trekke fargeeksempler med fargestifter - og Adobe Kuler Webapp er en fin måte å spille med forskjellige temaer, og deretter importere dem til designverktøyene dine. En av de beste reglene å gå med er å bruke gratis farger. Som i utgangspunktet bruker varme farger og kule farger sammen for å gi balanse.

4) Velg skrifter som støtter innhold

Det er bokstavelig talt tusenvis av skrifter å velge mellom.

Det er opp til deg å mikse og matche - men husk at det er best å bruke bare opptil tre fonter om gangen - en fin overskrift font, en for hovedteksten av tekst, så en for noen form for utringing du kanskje trenge. Ofte betyr det at du bruker en sans-serif for kroppskopien, og for overskrifter kan du bli mer interessant med enten serif eller sans-serif.

5) Hjelp fra andre

Ok, du har de grunnleggende designelementene dine, med vakre ikoner og bilder, med lydfargeskjema og morsomme skrifter. Hva blir det neste?

Få hjelp fra andre, selvfølgelig! Og ikke bare tilfeldige mennesker på gata, men konstruktiv kritikk fra folk som virkelig kjenner sine ting, som andre designere / utviklere. Dette kan være avgjørende for å gå fra en OK nettside til en som virkelig popper. Hvis du aldri har brukt Behance til å legge inn en arbeids-progess, anbefaler jeg at du gir den en prøve. Det aktive fellesskapet vil gjøre mer enn bare fortelle deg "å gjøre logoen større" - men gi deg råd som kan gjøre forskjellen mellom en god nettside og en flott en.

For å dykke dypere inn i hvordan man bruker designelementer til webutvikling, sjekk ut presentasjonen min fra SXSW: