Sådan laver du en professionel kontaktside

25. oktober 2026 · Webdesign · Formular · Konvertering

Redaktionel illustration af en enkel kontaktside med tydelige felter, svartidsforventning og bekræftelse

Udgivet 25. oktober 2026 · Af

Kontaktsiden er stedet, hvor en interesseret besøgende vurderer, om det er trygt og besværet værd at tage næste skridt. Den skal ikke være en tom formular under overskriften »Kontakt os«. Den skal forklare, hvem henvendelsen går til, hvad der er nyttigt at sende, hvornår virksomheden normalt svarer, og hvad der sker efter klik på send.

Giv kontakt før formular

Start med en kort invitation, der passer til virksomheden: hvilke typer opgaver eller spørgsmål er velkomne, og hvem læser beskeden? Vis relevante alternativer som e-mail og telefon. Hvis fysiske besøg kun er efter aftale, så skriv det i stedet for at antyde en åben adresse. Åbningstid, CVR eller akutnummer vises kun, når de er korrekte og relevante.

Forklar forventet svartid med et interval, virksomheden faktisk kan holde, eller brug en mere forsigtig formulering som »Jeg vender tilbage med et konkret næste skridt«. Undgå automatiske løfter, som ingen følger i ferieperioder.

Vælg kun felter, der hjælper det første svar

Et afgrænset kontaktflow
FeltFormålKrav
NavnGør svaret personligtOfte nødvendigt
E-mail eller telefonMuliggør svarMindst én kontaktvej
VirksomhedGiver kontekstKan være valgfrit
Emne eller projekttypeSender henvendelsen rigtigtBrug få forståelige valg
BeskedBehov, mål og relevante linksFortæl hvad der er nyttigt
FilKun når processen kræver detBegræns type, størrelse og følsomhed

Hvert ekstra obligatorisk felt skal forsvares. Budget kan være nyttigt for projekter, men giv intervaller og en mulighed for »skal afklares«. Et telefonnummer bør ikke være påkrævet, hvis virksomheden kan svare på mail. Bed ikke om personnummer, helbredsdata, regnskabsbilag eller adgangskoder i et almindeligt kontaktflow.

Labels skal være synlige og instruktioner konkrete

W3C anbefaler labels, der er programmatisk forbundet med feltet. En placeholder er et eksempel, ikke en erstatning for label; den forsvinder, når brugeren skriver, og kan have lav kontrast. Markér obligatoriske felter både visuelt og i kode. Hjælpetekst skal stå tæt på det felt, den forklarer.

Brug browserens relevante inputtyper, men validér også på serveren. Autocomplete-attributter kan hjælpe med navn og kontaktoplysninger. Fokusindikatoren skal kunne ses, og rækkefølgen med tastatur skal følge den visuelle rækkefølge.

Skriv fejl, der kan løses

»Der opstod en fejl« fortæller ikke, hvad brugeren skal gøre. Skriv »Indtast en e-mail som navn@virksomhed.dk« eller »Filen må højst være den angivne størrelse«. Vis en samlet fejloversigt og markér felterne uden at slette resten af beskeden. Flyt fokus til fejlen på en forudsigelig måde.

Klientvalidering giver hurtig feedback, men servervalidering er stadig nødvendig. MDN beskriver browservalidering som en hjælp til brugeroplevelsen, ikke som sikkerhed. Begræns rate, filtrér input og hold systemfejl ude af den offentlige besked.

Bekræft først, når beskeden er modtaget

En knap, der skifter tekst, er ikke bevis på levering. Vis succes, når serveren eller formularleverandøren har accepteret beskeden. Fortæl hvad der sker nu, og vis gerne en reference uden at eksponere interne data. Hvis levering fejler, bevar indholdet og giv en alternativ kontaktvej.

Test hele kæden: browser, endpoint, spamkontrol, afsenderdomæne, modtager, autosvar og svaradresse. En formular kan se succesfuld ud, mens mailen havner i spam eller sendes fra en adresse, der ikke kan besvares.

Privatliv og måling

Link til privatlivspolitikken ved formularen og forklar formålet kort. Et generelt samtykkefelt er ikke automatisk nødvendigt for at besvare en henvendelse; markedsføring er et andet formål og skal holdes adskilt. Få juridisk rådgivning til virksomhedens konkrete behandling.

Mål eventuelt formularstart og leveret formular efter relevant samtykke. Send aldrig beskedtekst, navn, e-mail eller telefon til analytics. Et send-klik er ikke et lead, hvis validering eller server fejler.

Tjeklisten før publicering

  1. Kontaktperson, formål og forventning står over formularen.
  2. Alle felter har synlige labels og forståelige fejl.
  3. Mobilens tastatur matcher e-mail og telefon.
  4. Formularen virker med tastatur og skærmlæsernavne.
  5. En rigtig test når den aftalte indbakke.
  6. Fejl bevarer beskeden og viser et alternativ.
  7. Analytics modtager ingen formularindhold.
  8. E-mail, telefon og privatlivslink er korrekte.

Kilder

  1. Labeling Controls – W3C Web Accessibility Initiative
  2. Understanding Success Criterion 3.3.2: Labels or Instructions – W3C
  3. Form data validation – MDN Web Docs

Relevante services

Formularen skal både kunne bruges og levere sikkert.

Om forfatteren

Oscar Winther er selvstændig designer og udvikler med base i Hellerup. Fysiske møder i Hellerup eller København aftales efter behov. Læs mere om Oscar Winther

Læs også

Beregn din pris · Fortæl om dit projekt