Semantisk HTML

Forskjellen på semantisk og ikke-semantisk markup

Et avsnitt kan formateres til å se ut som en overskrift — større skrift, fet tekst — uten faktisk å være en overskrift i koden. Det ser riktig ut visuelt, men en skjermleser eller en AI-crawler som ikke tolker CSS, oppfatter det fortsatt som vanlig tekst. Semantisk HTML bruker riktig element for riktig formål: <h1>–<h6> for overskriftshierarki, <nav> for navigasjon, <article> for selvstendig innhold, <ul>/<ol> for lister som faktisk er lister.

Hvorfor overskriftshierarkiet spesielt betyr noe

Én <h1> per side, deretter <h2> for hver hovedseksjon og <h3> for underpunkter, i rekkefølge — aldri hoppet over fordi en mindre overskrift så finere ut i et designverktøy. Hierarkiet er det som viser en maskin hva som er hovedtema, og hva som er underordnet det. Uten det må både skjermlesere og AI-modeller gjette seg til strukturen.

Sammenhengen med tilgjengelighet og synlighet

Det samme markup-grunnlaget som gjør en side navigerbar med skjermleser og tastatur, er det som gjør innholdet lesbart for AI-crawlere som i praksis ikke kjører JavaScript. Tilgjengelighet og AI-synlighet bygger derfor på nøyaktig den samme tekniske grunnmuren, ikke to separate arbeidsoppgaver. Alle nettsider fra in2design bygges med semantisk HTML fra første linje kode, som en fast del av leveransen.