13 Beste Praksis For Webdesign For 2021

I Dag kan du få et nettsted oppe i løpet av få minutter. Men det er en forskjell mellom et nettsted blir live og det blir optimalisert.

hvorfor betyr design noe? Det tar bare 0,05 sekunder for folk å danne seg en mening om nettstedet ditt. Ja, du leste riktig—50 millisekunder for noen å bli blåst bort eller frastøtt av nettstedet ditt. Det meste av den oppfatningen er dannet av designet.

Webdesign påvirker også konverteringene, troverdigheten, og til slutt gjør eller bryter suksessen til nettstedet ditt. Ingen nettside er perfekt, men du bør optimalisere det så mye som mulig.

Her er noe å ta hensyn til også: etter en dårlig opplevelse er det lite sannsynlig at 88% av forbrukerne kommer tilbake til et nettsted. På toppen av det, en fersk studie fant at 77% byråer sier at en dårlig webdesign er den viktigste svakheten til sine kunder.

Bunnlinje: Hvis webdesignet ditt ikke er optimalisert for brukeropplevelse (UX), vil det være skadelig for din suksess. Derfor skrev jeg denne guiden.

mange faktorer går inn i utformingen av et nettsted. Dette er de tretten viktigste elementene å prioritere i 2021. Hvis du følger disse beste fremgangsmåtene, vil ytelsen til nettstedet ditt drastisk forbedre.

Bruk denne sjekklisten for å sikre at du har et vinnende design

1. Minimer tekst
2. Vis, ikke fortell
3. Bruk korte setninger
4. Prøv kortere avsnitt
5. Velg et fargevalg som passer
6. Gjør CTA clear
7. forsterk Handlinger med fortrolighet
8. forenkle navigasjonen
9. optimaliser designet for mobil
10. prioriter seo
11. overvåk sidens lastehastighet
12. kjør a/b-tester kontinuerlig

minimer tekst

ikke fyll sidene dine med massive Blokker av tekst.

jeg snakker ikke om blogginnlegg, som noen ganger må gå i dybden(som denne!). Jeg snakker om nettsidene dine (f.eks. hjemmeside, destinasjonsside). Hold teksten til et minimum her.

du vil fortelle dine besøkende alt om deg, din bedrift, din merkevare og dine produkter. Men du må lære å fortelle den historien i bare noen få setninger eller-enda bedre-noen få ord.

Vis, ikke fortell

Visuals hjelper deg ikke bare med å bryte opp det skriftlige innholdet, men de kan også gi dypere forklaring. Vis dine besøkende hva du handler om. De vil forstå mer på kortere tid.

Harrys produktside legemliggjør begge disse to første designprinsippene:

la oss for eksempel si at nettstedet ditt selger barberhøvler, blader, barberkrem og andre barberingsprodukter for menn.

du opererer på en abonnementsmodell og leverer disse produktene til kundene dine på månedlig basis. Utformingen av barberhøvler er veldig kjekk — de er laget av utskåret løvtre og er hyggelig nok til å gi som en gave.

I Stedet for å gå inn i alle disse detaljene på hjemmesiden din, kan du bare få et bilde av disse produktene med tekst som sier noe som » levert på døren din.»Du får frem budskapet ditt med bare fire ord.

Jada, du kan gå i større detalj jo dypere besøkende kommer inn på sidene dine, men en lang tekstbeskrivelse er ikke nødvendig.

Bruk korte setninger

Korte setninger er lettere å lese.

ikke bombardere besøkende med store biter av tekst. De vet ikke hvor de skal begynne å lese og vil ikke kunne fordøye innholdet ditt.

Bland det opp. Hvis du trenger en lang setning, følg den med en kort en. Variasjon hjelper.

Prøv kortere avsnitt

Bruk avsnittsskift til din fordel. Det er greit å skrive lengre avsnitt, men jeg liker å holde min hjemmeside avsnitt til noen få setninger.

det er også viktig å ikke overdrive det. For mye av en god ting, er faktisk en dårlig ting.

Start hvert avsnitt med ny informasjon, så hvis noen ruller, kan de raskt fortelle om de trenger å lese det avsnittet.

Å Eliminere unødvendig tekst på sidene dine reduserer rot og legger mer vekt på oppfordringen til handling.

Å Ha CTA skiller seg ut alene i sitt eget avsnitt er mer virkningsfullt enn å begrave det i en haug med tekst.

et veldig nyttig verktøy i denne situasjonen er kuler. I stedet for å legge til avsnitt og lang form skriving, bør du vurdere å bruke lister. I disse listene, bruke punkter.

Studier viser at flere mennesker vil se på lister med punkter enn andre formater. Det er fordi de bidrar til å forbedre en sides skannbarhet og lar deg markere de viktigste punktene du vil gjøre.

Velg et fargevalg som passer din merkevarestrategi

fargevalgene du gjør på nettstedet ditt er viktigere enn du tror.

Besøkende dømmer nettstedet ditt på mindre enn 90 sekunder. Det meste av det er et resultat av fargene du velger.

den beste måten å velge ditt nettsted fargevalg er med merkevarebygging. Se din logo. Passer fargene på nettstedet ditt med merkevaren din?

her er et eksempel. Tenk På Starbucks.

når du hører dette merkenavnet, er jeg sikker på at du har et bilde i hodet ditt. Kanskje det er logoen, et skilt eller et butikksted.

forbinder du noen farger med det navnet? La oss nå se på deres hjemmeside.

Det er ingen overraskelse at de gikk med en grønn fargevalg.

dette designvalget matcher deres logo og merkevarebilde, noe som forsterker det forbrukerne allerede forbinder med merkevaren. Ved å holde ting konsekvent, er det ingen forvirring. Det ville være rart hvis du besøkte denne nettsiden og fargene var gule og røde. Det har ingenting å gjøre med deres merkevare.

vi snakker mer om forsterkning i større dybde når vi fortsetter.

Gjør DIN CTA klar og åpenbar

CTAs bør ikke bli begravet. De må være store, dristige og kraftige, og de må tydelig skille seg ut som handlingen dine besøkende skal ta neste gang.

likevel har de fleste nettsteder ikke EN cta-knapp som kan bli oppdaget på mindre enn tre sekunder. Det er en god sjanse for at du faller inn i gruppen som tar lengre tid. Det er ikke den kategorien du ønsker å være i.

du kan ikke kjøre konverteringer uten en effektiv cta-knapp.

jeg ser nesten aldri EN CTA på en bedrifts interiørsider(sidene som forklarer hva merkevaren din gjør og hva du tilbyr). Dette er en stor designfeil. Du kan ikke forvente at besøkende skal navigere tilbake til hjemmesiden din for å konvertere.

Ta en titt på DENNE CTA Fra Litmus.

Se hvor enkelt dette designet er. Det er minimal tekst på skjermen, så meldingen er klar.

SOM et resultat skiller CTA «sign up free» seg ut. Faktisk, Lakmus selv sette den på mer enn ett sted på skjermen.

Hvor DU skal sette DIN CTA, er forskjellig fra side til side. For eksempel bør blogginnlegg ha CTA opp toppen slik at leserne ser det raskt og også nederst etter at de har lest innlegget.

gå dypere: vil du optimalisere Cta-Ene dine? Her er 11 måter å forbedre dine samtaler til handling.

Forsterk handlinger med kjennskap

HVIS meldingen din er den samme, BØR CTA være den samme på hver enkelt side.

Tenk på hvordan folk navigerer på nettstedet ditt. Selv om du setter opp en bestemt flyt, vil ikke alle lande på en side og konvertere om sekunder. De kan bla rundt for litt først.

la oss for eksempel si at du har et e-handelsnettsted. Du bør ikke endre cta-knappen fra side til side, som vil se slik ut:

• Hjemmeside: Kassa nå
• Kategoriside: Kjøp den i dag
• Produktside: Klikk for å kjøpe

hvis en besøkende ser en av disse knappene på hjemmesiden din, den andre på en kategoriside og den tredje på en produktside, er det ingen forsterkning.

hold i Stedet meldingene og stilen konsistente. Her er et godt eksempel fra smykker og tilbehør merket MVMT.

Det spiller ingen rolle om du er på deres briller, klokker eller smykker side. Du kommer til å se den samme» SHOP NOW » CTA for sine produkter.

Hver side forblir også i samsvar med nettstedets generelle minimalistiske, svart-hvitt-design.

Bruk dette designprinsippet på nettstedet ditt også.

den går utover CTA-knappen. Tanken er å ha denne typen forsterkning med så mange elementer som mulig.

Konsistens i språk, meldinger og design forsterker merkeidentiteten din og etterlater et varig inntrykk på de besøkendes sinn.

Forenkle navigasjonen

det bør ikke være vanskelig for en besøkende på nettstedet å finne det de leter etter på nettstedet ditt.

Sett deg selv i deres sko. Hvorfor besøker du nettsiden? Hvordan oppnår du den oppgaven? Kanskje du ønsker å kjøpe noe, få mer informasjon, eller se hva det er å tilby. Uansett grunn kan være, hvis besøkende ikke kan finne ut det raskt, de kommer til å forlate.

det er bare for mye konkurranse der ute. Brukere har ingen grunn til å sette opp med uhåndterlig nettside navigasjon. Alt de trenger å gjøre er å forlate nettstedet ditt og finne det de trenger et annet sted.

ikke prøv å gjenoppfinne hjulet med en kompleks design. Hold deg til standardformatet.

for eksempel plasserer de fleste nettsteder navigasjonsmenyen horisontalt øverst på hver side. Hvis menyen er et annet sted, kan det forvirre besøkende.

jo færre alternativer i menyen, desto bedre. Ellers vil det være for vanskelig for folk å finne det de trenger. Dette konseptet er kjent Som Hicks Lov.

jo flere alternativer du gir noen, desto lengre vil det ta dem å ta en beslutning. Det er derfor komplekse design og navigasjoner vil knuse konverteringsfrekvenser.

Det er et kjent eksperiment om dette, referert til som jam-studien, som diskuterer paradokset av valg.

forsøket ble utført på en lokal matbutikk. Forbrukerne ble presentert med 24 syltetøy å prøve på en dag, og seks syltetøy på neste dag:

• den større skjermen på dag ett tiltrukket 60% av kundene, men bare 3% av dem gjorde et kjøp.
• den mindre visningen av seks syltetøy på den andre dagen tiltrukket 40% av kundene, men 30% av dem kjøpte.

ved å begrense valg var konverteringene ti ganger høyere. Det samme konseptet kan brukes til nettstedet ditt navigasjon.

Eliminer unødvendige menyalternativer. For eksempel, i stedet for å ha en» hjem » – knapp, bruk bare nettstedslogoen til å koble tilbake til startskjermen.

Ta en titt På Squares hjemmeside.

designet er super rent. Menyalternativene er svært begrenset. Dette gjør det enkelt for besøkende å velge et utvalg som passer deres behov.

Du vil legge merke til at det er minimal tekst på skjermen, OG CTA er klar og åpenbar.

denne typen design gjør det nesten umulig for besøkende å gå seg vill eller forvirret når de navigerer.

for de av dere som har mange alternativer på nettstedet ditt, for eksempel en e-handelsbutikk, kan du legge til et søkefelt for å forenkle navigasjonsprosessen uten å bruke en komplisert meny. Mange programvareselskaper legger sine funksjoner i en funksjonsfane i stedet for å ha en individuell fane for hver funksjon.

Optimaliser design for mobile enheter

Mobil er hvordan flertallet av verden får Tilgang Til Internett. Det betyr at hvis du ikke er optimalisert for mobil, vil nettstedet ditt ikke fungere bra.

ta en titt på disse Dataene Fra Hootsuite:

Søkemotorer gjenkjenner dette og belønner nettsteder som er mobilvennlige. Her er noen flere statistikk å treffe poenget hjem:

• Google vet at 87% av smarttelefoneiere bruker enhetene sine til Å kjøre Et Internett-søk minst en gang per dag.
• 58% Av Alle google-søk er gjort fra en mobil enhet
• resultatet: 70% av de første sideresultatene På Google er optimalisert for mobile enheter.

Mobil SEO Er det viktigste DU kan gjøre for å rangere godt På Google. Alvorlig.

hvis nettstedet ditt ikke ser bra ut på en smarttelefon, vil folk ikke bli værende. Så sørg for at webdesignene dine er mobilvennlige.

gå dypere: Vil du lære hvordan du optimaliserer nettstedet ditt for mobil? Sjekk ut vår komplette guide til en mobilvennlig nettside.

Prioriter SEO

Alt du gjør på nettstedet ditt, må sirkle TILBAKE TIL SEO.

Og det er ikke nok å bare legge til søkeord her og der. Det er et nettstedsomfattende system for å forbedre innhold og ubarmhjertig målrette mot bestemte emner for å bygge nettstedmyndigheten din på dette området.

for eksempel vil en destinasjonsside for et e-handelsnettsted fokusere på visse elementer på siden, for eksempel:

• Brukervennlighet. Hvor enkelt det er for besøkende å bruke og navigere.
• Mobil. Hvordan nettstedet ditt ser ut og utforer pa en mobil enhet.
• Optimalisering Av Søkeord. Ord og uttrykk som du ønsker å rangere for.
• Interne lenker. Hvor ofte du lenker til andre sider på nettstedet ditt.
• Overskrift. Dette er ofte den største teksten på en nettside. Som sådan gjør det det meste av den tunge løftingen på destinasjonssiden din.

Opprett ET XML-områdekart. Dette vil gjøre det enklere for søkemotorroboter å analysere innhold på nettstedet ditt. Et områdekart viser botene plasseringen av sider på nettstedet ditt, når siden sist ble oppdatert, oppdateringsfrekvensen og forholdet til andre sider på nettstedet ditt.

et riktig sitemap viser Google at Du ikke har duplikatinnhold, noe Som kan skade SEO-rangeringene dine.

Når du designer nettstedet ditt, er DET MASSEVIS av mindre åpenbare elementer som også er med i rangeringen På Google.

Vi har allerede gått over noen aspekter du kan forbedre på selve siden. Men andre elementer inkluderer:

• Domene. NETTADRESSEN din er ganske følge av google rang. Nøkkelfaktorer inkluderer å ha søkeordet ditt i domenet, hvor gammelt domenet er og hva domeneutvidelsen din er (f .eks .høy kvalitet som .com,. net,. gov,.org versus utradisjonelle utvidelser).
• Nettstedskvalitet. Nettstedet ditt må være nyttig for besøkende. Nøkkelfaktorer inkluderer en’ Om Oss ‘- side, En’ Kontakt Oss ‘ – side, hvor ofte du oppdaterer nettstedet ditt, hvor enkelt det er å navigere på nettstedet ditt, oppetid (hvor ofte nettstedet krasjer) og SSL-sertifikater.
• Tilbakekoblinger. Dette refererer til frekvensen nettstedet ditt er koblet til av andre nettsteder. Det er en avgjørende faktor for rangering godt På Google. Nøkkelfaktorer inkluderer antall koblingssider, kvaliteten og autoriteten til nettstedene som kobler til deg, ankerteksten de bruker til å koble til deg, og hvorvidt disse koblingene kommer fra. edu-eller. gov-domener.

Overvåk siden lasting hastighet

jeg vet hva noen av dere tenker. Hva gjør siden lasting hastighet har å gjøre med webdesign? Alt.

Jada, lasting ganger er relatert til ditt nettsted hosting plan, server, trafikk, og ting som naturen. Designvalg kan imidlertid også påvirke belastningstidene dine.

hver gang du legger til et element på nettstedet ditt, spesielt bilder, videoer og andre komplekse mediefiler, kan lastetidene dine påvirkes. SOM sådan kan DET redusere HTTP-forespørsler.

Treg lasting ganger føre til høy oppgivelse priser. Du kan ikke ignorere dette. Hvis sidene tar for lang tid å laste, det kommer til å være et stort problem.

videre forlater 25% av folk nettsteder som tar mer enn fire sekunder å laste. Ja, fire sekunder. Det er alt du har, eller du vil miste 25 ut av hver 100 besøkende. De fleste besøkende forventer at en side lastes inn om to sekunder eller mindre.

så hvordan kan du bruke dette til webdesign?

• Reduser filstørrelsene på bildene dine
• Dra nytte av verktøy for hurtigbufring av nettleseren
• Reduser HTTP-forespørsler
• Forbedre TTFB (tid til første byte)
• Minify og kombiner filene dine

det finnes mange verktøy tilgjengelig på nettet for å hjelpe deg å oppnå disse tingene. For eksempel, sjekk Ut WordPress Rocket plugin som en ressurs for minifying og kombinere filene dine. Og bruk Verktøyet Page Speed Insights fra Google for å hjelpe deg med å overvåke innlastingstidene dine når du gjør designendringer på nettstedet ditt.

Kjør A/b-tester Kontinuerlig

når det gjelder webdesign, kan du ikke bare sette det og glemme det.

som jeg sa tidligere, er ingen nettside perfekt. Det finnes alltid måter å forbedre designet på.

Det er derfor du må kjøre a / b-tester. Disse lar deg gjøre regelmessige forbedringer på nettstedet ditt og teste ut elementer for å se hva som fungerer best og, enda viktigere, hva som ikke fungerer i det hele tatt.

Nesten hvert element av nettstedet ditt design kan testes. Du kan for eksempel opprette to forskjellige destinasjonssider som har forskjellige Ctaer, men ellers er de samme. Hvis en destinasjonsside utfører bedre enn den andre, vet DU at CTA sannsynligvis får jobben gjort.

Her er noen raske forslag for å komme i gang i riktig retning:

• Test plasseringen AV CTA-knappen
• Test fargen PÅ cta-knappen
• Test CTA-kopien
• Test bildene du bruker på destinasjonssider
• test ordlyd variasjoner av tekst på skjermen
• Test størrelsen på navigasjonsfeltet

det er Så mange alternativer, JEG KUNNE TILBRINGE hele dagen å snakke om dette. For de av dere som ikke er kjent Med a / B-tester eller trenger litt hjelp, sjekk ut min guide på alt du trenger å vite før Du starter A/B-testing.

Konklusjon

Å Si at utformingen av et nettsted er viktig, ville være en underdrivelse. Web design valgene vil til slutt påvirke hvorvidt nettstedet ditt er vellykket.

• Alles nettsted kan forbedres. Bruk denne listen som en veiledning som en ressurs for å hjelpe deg med å gjøre disse forbedringene.
• Ikke bli overveldet. Jeg sier ikke at du må implementere alle disse designforslagene over natten, men du må starte et sted.
• jeg trakk ikke disse ideene ut av tynn luft. Alt på denne listen er støttet av forskning og statistikk knyttet til designprinsipper.

Husk: hvert nettsted er et pågående arbeid. Hvis du setter arbeidet inn og alltid finjusterer nettstedet ditt, vil du forbedre kanten din med konkurrentene dine.

det spiller ingen rolle om nettstedet ditt er helt nytt eller om det har eksistert i et tiår. Dette er webdesign beste praksis som du må følge i 2021.