Seks sidemaler som gjør bedriftsnettstedet enklere å bruke

Kategori: Webdesign og UX

Mange bedriftsnettsteder blir designet én side om gangen. Forsiden får én løsning, tjenestesidene en annen, og kontaktsiden settes opp til slutt. Resultatet kan se variert og påkostet ut, men brukeren må stadig lære siden på nytt.

Et bedre utgangspunkt er å definere et lite sett med sidemaler før detaljdesignet begynner. Hver mal skal støtte en bestemt brukeroppgave, ha et tydelig innholdshierarki og lede videre på en forutsigbar måte. Det gir ikke bare en bedre brukeropplevelse. Det gjør nettstedet enklere å publisere, vedlikeholde og videreutvikle.

For mange norske bedriftsnettsteder er seks sidemaler nok til å dekke de viktigste behovene.

1. Forsiden: Fordel trafikken, ikke fortell alt

Forsiden skal raskt hjelpe ulike besøkende videre. Den trenger ikke inneholde en komprimert utgave av hele virksomheten. Oppgaven er å avklare hvem bedriften hjelper, hva den leverer, og hvilke veier brukeren kan velge.

En god forsidemal kan bestå av:

• En konkret overskrift som beskriver bedriftens tilbud eller verdi
• En kort forklaring som avgrenser målgruppe eller leveranse
• To til fire tydelige innganger til sentrale tjenester eller behov
• Utvalgte bevis, som kundehistorier, fagkompetanse eller relevante godkjenninger
• En prioritert handling, for eksempel å bestille en samtale eller finne riktig tjeneste

Unngå flere likestilte knapper i toppfeltet. Når «Les mer», «Se tjenester», «Kontakt oss» og «Om oss» ser like viktige ut, skyves valget over på brukeren. Bestem hvilken handling som naturlig følger av budskapet, og gjør den tydeligst.

2. Oversiktssiden: Hjelp brukeren å velge riktig

En oversiktsside samler tjenester, produkter, bransjer eller fagområder. Den fungerer som et veikryss mellom hovedmenyen og de mer detaljerte sidene.

Den vanligste feilen er å vise en samling kort med interne produktnavn og korte beskrivelser som ligner på hverandre. Brukeren trenger i stedet hjelp til å forstå forskjellen mellom alternativene.

Beskriv derfor hvert valg med ord kundene kjenner igjen. «For virksomheter som skal…» eller «Passer når dere trenger…» er ofte mer nyttig enn interne kategorier. Dersom tjenestene krever mye forklaring, kan de grupperes etter kundebehov, bransje eller situasjon.

Oversiktssiden bør også gjenspeile hovedmenyen. Hvis menyen bruker én inndeling og selve siden en annen, blir det vanskeligere å forstå hvor man befinner seg.

3. Tjenestesiden: Koble behov, leveranse og neste steg

Tjenestesiden skal hjelpe en potensiell kunde med å vurdere om tilbudet passer. Den bør ikke åpne med en lang presentasjon av bedriften. Start med situasjonen kunden står i, og forklar deretter hva dere leverer.

En praktisk rekkefølge er:

1. Hvem tjenesten er relevant for
2. Hvilket problem eller behov den dekker
3. Hva leveransen omfatter
4. Hvordan samarbeidet foregår
5. Hva kunden kan forvente som resultat
6. Hva som er et naturlig neste steg

Denne rekkefølgen skaper en tydelig beslutningssti. Brukeren får først bekreftet relevansen, deretter informasjonen som trengs for å vurdere leverandøren.

Handlingsknappen må passe til beslutningsnivået. En kompleks bedriftsleveranse bør sjelden avsluttes med «Kjøp nå». «Diskuter behovet med oss» eller «Be om en innledende vurdering» kan være mer presist, så lenge bedriften faktisk følger opp på den måten teksten lover.

4. Kundehistorien: Vis hvordan dere arbeider i praksis

Kundehistorier skal redusere usikkerhet, ikke bare vise logoer. En god mal gjør det enkelt å forstå kundens situasjon, hva bedriften bidro med, og hvilken endring arbeidet førte til.

Bruk en fast struktur med utfordring, tilnærming, leveranse og resultat. Skill tydelig mellom dokumenterte resultater og kundens eller leverandørens vurderinger. Dersom konkrete resultattall ikke kan deles, kan teksten fortsatt forklare hva som ble forbedret i arbeidsflyt, kvalitet eller kundeopplevelse.

Vis også hvilke tjenester kundehistorien gjelder. En bruker som leser et relevant eksempel, bør enkelt kunne gå videre til den aktuelle tjenestesiden. Tjenestesiden kan på sin side vise ett eller to nærliggende kundeeksempler.

5. Fagartikkelen: Gjør kunnskap lett å skanne

Fagartikler har en annen oppgave enn tjenestesider. Leseren kommer ofte for å løse et konkret problem og er ikke nødvendigvis klar for å kontakte bedriften. Artikkelmalen må derfor prioritere lesbarhet og faglig nytte.

Bruk en tydelig innledning, beskriv hva leseren får svar på, og del innholdet inn med informative mellomtitler. Begrens tekstbredden slik at lange avsnitt ikke blir tunge å lese. Punktlister bør brukes når innholdet faktisk er en liste, ikke som pynt.

Veien videre kan være en relatert artikkel, en sjekkliste eller en relevant tjeneste. Oppfordringen bør stå i forhold til temaet. En aggressiv salgsknapp midt i en praktisk veiledning kan svekke både leseflyten og tilliten.

6. Kontakt- og konverteringssiden: Fjern praktisk usikkerhet

Kontaktsiden er ikke bare et skjema. Den skal forklare hva som skjer når noen tar kontakt. Fortell hvilke typer henvendelser dere håndterer, hva brukeren bør oppgi, og hvordan oppfølgingen vanligvis foregår.

Be bare om informasjon som er nødvendig i første steg. Et omfattende skjema kan være riktig for en detaljert forespørsel, men da bør det forklares hvorfor opplysningene trengs. For mange virksomheter holder navn, kontaktinformasjon og en kort beskrivelse av behovet.

Gjør bekreftelsen etter innsending like gjennomtenkt som skjemaet. Brukeren bør få vite at henvendelsen er mottatt, hva som skjer videre, og hva vedkommende kan gjøre hvis saken haster.

Felles designregler gjør sidemalene gjenkjennelige

Sidemalene skal løse ulike oppgaver, men de må oppleves som deler av samme nettsted. Det krever noen faste regler for typografi, farger, avstander og komponenter.

Typografi som viser hva som er viktig

Definer et begrenset hierarki for overskrifter, brødtekst, ingresser, bildetekster og knapper. Forskjellen mellom nivåene må være tydelig uten at hver overskrift blir svært stor. Lesbar linjeavstand, tilstrekkelig skriftstørrelse og god kontrast er viktigere enn dekorative skrifteffekter.

Unngå å bruke store bokstaver eller svært tynn skrift i lengre tekster. Det kan passe i enkelte grafiske detaljer, men fungerer dårlig som bærende informasjonsdesign.

Visuell identitet med en praktisk funksjon

Farger, illustrasjoner og foto skal støtte merkevaren, men også hjelpe brukeren. En aksentfarge kan for eksempel reserveres for primære handlinger. Da bør den ikke samtidig brukes på tilfeldige overskrifter og dekorative flater.

Bildestilen bør defineres like konkret som fargepaletten. Avklar hvilke motiver som passer, hvordan mennesker og arbeidsmiljøer skal fremstilles, og hvilke utsnitt som fungerer i malene. Det gir et mer troverdig uttrykk enn en blanding av tilfeldige arkivbilder.

Tilgjengelighet må ligge i selve systemet

Gode sidemaler gjør tilgjengelig publisering enklere. Overskriftsnivåer må følge en logisk rekkefølge. Lenker og knapper må ha forståelige tekster. Tastaturfokus skal være synlig, og informasjon må ikke formidles bare gjennom farge.

Komponentene bør også tåle større tekst, lange norske ord og varierende innholdsmengde. En mal som bare fungerer med korte eksempeltekster, er ikke ferdig designet.

Slik utvikler dere malene uten å starte med pynt

1. Kartlegg de viktigste sideoppgavene. Finn ut hva besøkende skal forstå, velge eller gjøre på hver sidetype.
2. Samle ekte innhold. Bruk faktiske tjenestenavn, overskrifter, skjemaopplysninger og kundeeksempler før designet låses.
3. Lag innholdshierarkiet. Bestem rekkefølgen på informasjonen uten å diskutere farger og bilder først.
4. Design de felles komponentene. Etabler regler for knapper, kort, skjemaer, sitater, navigasjon og relaterte lenker.
5. Test med realistiske scenarioer. Be personer finne en tjeneste, sammenligne alternativer, lese en kundehistorie og sende en henvendelse.
6. Kontroller hele veien. En god tjenesteside hjelper lite hvis menyen, skjemaet eller bekreftelsen skaper friksjon.

Mål malene etter oppgaven de skal løse

Ikke vurder alle sider etter samme konverteringsmål. Forsiden kan måles på om besøkende finner en relevant inngang. En oversiktsside bør hjelpe dem videre til riktig detaljside. En fagartikkel kan føre til videre lesing, mens kontaktsiden skal bidra til fullførte og relevante henvendelser.

Se også etter kvalitative signaler. Spør kundeservice og salg hvilke misforståelser som går igjen. Hvis potensielle kunder stadig spør om noe som allerede står på nettstedet, kan problemet være plassering, språk eller visuelt hierarki snarere enn mangel på innhold.

Et lite bibliotek med tydelige sidemaler gir et mer sammenhengende nettsted. Brukeren kjenner igjen mønstrene, redaktørene får tryggere rammer, og bedriften kan forbedre løsningen uten å redesigne hver side fra bunnen av.