Hva du skal inkludere i en nettstedsoversikt
Nettstedets struktur
Legg ut strukturen til nettstedet ditt før du inkluderer det i omrisset av nettstedet. Hold det enkelt. Skisser på papir, i notatblokken/notisboken eller til og med en tavle. Alternativt kan du bruke disse verktøyene: Microsoft Visio, whiteboard, Excel, OmniGiraffe eller Google Sheets.
Her er et eksempel på en enkel struktur:
Bildekilde: Neil Patel
Her er vurderingene når du legger til nettstedsstrukturen i disposisjonen din:
- Kategorisering – Kategoriser nettsidene dine. Grupper funksjonene og elementene som er like sammen. Når du kategoriserer, hold kategoriene mellom 2 og 7. Balanser ut underkategoriene. Hvis hver kategori har 5 underkategorier, sørg for at alle kategoriene dine har 5 underkategorier.
- Sidenivåer/dybde – Gå for en liten sidedybde. Tre nivåer er ideelle. Men hvis nettstedet ditt trenger over tre nivåer, i bransjer som e-handel, gå for det. Jo grunnere dybden på sidenivåene er, desto enklere er navigeringen på nettstedet ditt.
- Har en global kategori – Dette er den eneste ekstra kategorien du trenger i tillegg til de 7. Her legger du elementer som personvernregler, pålogginger og søkefunksjoner. Elementene her er inkludert som en del av topp- eller bunnteksten.
Hvorfor nettstedets struktur er viktig
Nettstedets struktur avgjør brukeropplevelsen, gjennomgangen, nettstedkoblingene du sannsynligvis vil få, og de interne koblingene som nettstedet ditt vil ha.
Et nettsted med en flott struktur resulterer i bedre brukeropplevelser, noe som resulterer i lavere fluktfrekvens. Alle disse signalene forteller Google at nettstedet ditt er av høy kvalitet, noe som bidrar til at nettstedet ditt rangeres høyere i søkemotorresultatene.
Søkemotorroboter gjennomsøker nettstedets struktur for å indeksere nettsiden din. Hele nettstedets struktur må oppsummeres og sendes til Google Search Console. Dette gjøres ved hjelp av en XML nettstedskart.
Uten den riktige nettstedsstrukturen er det sider og nettadresser som søkemotorroboter aldri vil oppdage.
Passende nettstedstruktur hjelper nettstedet ditt med å ha nettstedkoblinger på søkemotorresultatsider, som eksempelet vårt:
Nettstedkoblinger gjør det enklere for brukere å velge siden som kan være mest relevant. Dette øker CTR (klikkfrekvens), konverteringsfrekvens og til og med salg. Nettstedet ditt vil sannsynligvis også rangere høyere enn konkurrentene dine.
Her er hva Google måtte si om hva som skjer på nettstedslinken:
«Vi viser bare nettstedkoblinger for resultater når vi tror de vil være nyttige for brukeren. Hvis strukturen på nettstedet ditt ikke tillater algoritmene våre å finne gode nettstedslinker, eller vi ikke tror nettstedslinkene for nettstedet ditt er relevante for brukerens søk, viser vi dem ikke.»
Et nettsted med en flott struktur resulterer i å lage interne lenker som hjelper med brukernavigering. Det gjør det også enklere for søkemotorer å identifisere relaterte sider, reduserer sidedybden og hjelper til med å overføre koblingsverdi til andre sider.
Her er en nettside med områdekartmaler som du kan hente inspirasjon fra.
Nettsideoppsett
Nettstedets struktur gir deg en skjelettskisse av nettstedet ditt. Det hjelper deg å vite hvor mange kolonner du trenger, for eksempel. Du må nå liste opp elementene som vil danne nettstedets layout. Begynn med landingssiden din, siden det er det første stedet besøkende sannsynligvis vil besøke.
Hjemmeside/destinasjonsside
Landingssiden er det brukerne vil bruke for å avgjøre om de trenger å bruke mer tid på nettstedet ditt eller ikke. Det du bør huske på her er at oppsettet vil hjelpe mye med å gjøre brukernavigering enkel.
Når du kommer opp med oppsettet til landingssiden din, bør du tenke på hva som går over den synlige delen av nettsiden, og hva som går under den synlige delen. Dette betyr hva som går før rulling (over-fold) og hva som kommer etter rulling (under fold).
Her er et bilde for å hjelpe til med å skille mellom over-fold og under-fold:
Bildekilde: Performics
Over bretten
Her er hva du skal inkludere på den synlige delen av nettsiden din:
- Logo
- Overskrift
- Underoverskrift
- Navigasjonslinje
- Primær CTA (Call To Action)
Underkategori disse elementene, for eksempel, kategoriserer logoen under navigasjonslinjen. Legg til bilder eller bygg inn en video avhengig av din bransje.
Under folden
Her er hva du skal inkludere under den synlige delen av nettstedet ditt:
- arrangementer
- Bloggartikler
- Industritrender
- Tillitsindikatorer
- pressedekning
- Stedsinformasjon
- Fordeler og/eller funksjoner
Avhengig av din bransje, grupper de ovennevnte elementene ytterligere. Sett stedsinformasjon under bunnteksten, for eksempel.
Her er en grafisk representasjon av kategoriene som skal settes inn over og under folden.
Egenskaper
List opp funksjonene du vil ha på nettstedet ditt. Bare tenk på hva du må ha for nettstedet ditt? For å hjelpe kundene dine med å få informasjonen de trenger, og handle ut fra den? Alt av UI/UX, SEO og så videre. Disse inkluderer:
- CTA
- Blogg
- Vanlige spørsmål
- Forum
- Galleri
- Sikkerhet
- Nyhetsbrev
- Kommentarer
- Attester
- Blymagnet
- Meld deg inn Logg inn
- Handlevogn
- Betalings prosessering
- Sosiale medier – dele knapper/lenker
Du vet kanskje ikke nøyaktig hvor du skal plassere disse funksjonene. Dette blir tydelig når du bygger wireframe (som er en visuell representasjon av nettstedets omriss. Den viser nettstedets layout, navigasjon og innhold. Finn ut mer om wireframes i denne artikkelen.
Her er et eksempel på en wireframe:
Bildekilde: Smartdraw
Stilguide
Stilguider og mønster er avgjørende for å hjelpe webdesigneren å opprettholde strukturen og skape opplevelser for publikummet vårt for ulike enheter.
Fordelene med stilguider er mange: de skaper et felles språk, gjør testingen enklere, sparer tid og krefter, og skaper en nyttig referanse å komme tilbake til. Disse inkluderer:
- Lister
- Knapper
- Overskrifter
- Avsnitt
- Respons
- Lenker – aktiv/inaktiv/svevende
- Bakgrunn – hvit/svart/merkefarger
- List opp fargene du vil bruke. De bør være i tråd med merkevaren din.
I disposisjonen din setter du de relaterte stilene for hvert element i parentes.
Ressurser
Hoveddriveren for ressurser er hva du kan gjøre for dem, hva har du gjort så langt, hvorfor skal de velge, hvordan du kan hjelpe. Sammen med stilguiden trenger du å lage disse meldingene på tvers av forskjellige metoder som tiltrekker publikum best.
List opp ressursene du trenger for å oppnå funksjonaliteten du har tenkt. Disse inkluderer:
- Ikoner
- Skrifter
- Videoer
- Attester/anmeldelser
- Illustrasjoner og grafikk
- Markedsføringskopi – white papers, pressemeldinger
- Bilder og deres kilder – firmabilder/lager
I disposisjonen din setter du de relaterte ressursene for hvert element i parentes.
Navigasjon
Bestem navigasjonen du vil ha basert på strukturen på nettstedet, sideoppsettet og funksjonene (både øverst og nederst på nettsiden). Det kan være topp, bunn, side eller senter. Den kan også være fast (statisk) – der den ikke endrer posisjon med rulling – eller klebrig (beveger seg mens brukeren ruller).
Her er noen navigasjonsalternativer:
Toppnavigasjon
Det er flere alternativer her.
Dette er en hamburgermeny som du sannsynligvis vil finne på mobile enheter:
Bildekilde: Mal Brødrister
Fast toppnavigasjon
Denne navigasjonen endrer ikke posisjon når brukeren ruller. Her er en demo:
Bildekilde: WebFX
Skjermbildet nedenfor viser navigasjonen på venstre side, og forblir på samme sted selv når brukeren ruller.
Bildekilde: Template Toaster
Statisk bunnnavigasjon
Her brukes bunnteksten som hovednavigasjon. Her er et skjermbilde:
Bildekilde: Template Toaster
Advarsel
Du må lage en disposisjon for hver side. Hver side på nettstedet ditt er forskjellig. Mens funksjoner som topp- og bunntekst forblir de samme, må landingssiden og om-sidene dine være forskjellige, selv om de har samme utseende og følelse for konsistens.
Mal
Her er en mal som oppsummerer alle de ovenfor diskuterte detaljene. Bytt ut beskrivelsene mellom hakeparentesene med din egen bedrifts informasjon.
For å konkludere
Når du lager et nettstedskisse, må du ikke gå i detalj. Oversikten er en guide som hjelper deg å holde nettsteddesignet ditt på rett spor, strukturert og oversiktlig. Gi rom for tilpasning og kreativitet.
