Et vigtigt princip i Webstandarder-bevægelsen, der er ansvarlig for den branche, vi har i dag, er ideen om at bruge HTML-elementer til, hvad de er, snarere end hvordan de kan vises i browseren som standard. Dette er kendt som brug af semantisk HTML.
Hvad er semantisk HTML
Semantisk HTML eller semantisk markering er HTML, der introducerer mening til websiden i stedet for blot præsentation. For eksempel a
tag angiver, at den vedlagte tekst er et afsnit.
Dette er både semantisk og præsentationelt, fordi folk ved, hvilke afsnit der er, og browsere ved, hvordan de skal vises.
På bagsiden af denne ligning er tags som og er ikke semantiske, fordi de kun definerer, hvordan teksten skal se ud (fed eller kursiv) og ikke give yderligere betydning til markeringen. Eksempler på semantiske HTML-tags omfatter overskriftskoderne Fordelen ved at skrive semantisk HTML stammer fra, hvad der skal være det drivende mål for enhver webside - ønsket om at kommunikere. Ved at tilføje semantiske tags til dit dokument, giver du yderligere oplysninger om det pågældende dokument, hvilket hjælper med kommunikation. Specielt betyder semantiske tags klart for browseren, hvad meningen med en side og dens indhold er. Denne klarhed er også kommunikeret med søgemaskiner, hvilket sikrer, at de rigtige sider bliver leveret til de rigtige forespørgsler. Semantiske HTML-tags giver information om indholdet af de tags, der går ud over, hvordan de ser på en side. Tekst, der er vedlagt i I stedet for at forsøge at gøre den kode, forstår browseren, at du bruger den pågældende tekst som et eksempel på koden til brug for en artikel eller online-tutorial af en eller anden art. Brug af semantiske tags giver dig mange flere kroge til styling af dit indhold. Måske i dag foretrækker du at få dine kodeprøver i standardweblesestil, men i morgen vil du kalde dem ud med en grå baggrundsfarve, og senere vil du definere den præcise monofilte skrifttypefamilie eller skrifttypestabel til brug for dine prøver. Du kan nemt gøre alle disse ting ved at bruge semantisk markering og smart anvendt CSS. Når du vil bruge semantiske tags til at formidle mening snarere end til præsentationsformål, skal du være forsigtig med, at du ikke bruger dem forkert for deres almindelige visningsegenskaber. Nogle af de mest misbrugte semantiske tags omfatter: Ved at bruge HTML-tags, der har betydning, opretter du sider, der giver mere information, end ved blot at omslutte alt sammen med Mens næsten alle HTML4-tag og alle HTML5-tags har en semantisk betydning, er nogle tags primært semantiske i naturen. For eksempel har HTML5 omdefineret betydningen af og tags at være semantiske. Det tag giver ikke større betydning, men snarere tekst, der typisk er udført i fed skrift. Det tag også ikke formidle ekstra betydning eller vægt, men snarere definerer tekst, der typisk gengives i kursiv. Semantiske HTML-tagsigennem
,
,
og . Der er mange flere semantiske HTML-tags, der kan bruges, når du opbygger en standard-kompatibel hjemmeside.Hvorfor du bør bekymre sig om semantik
tag genkendes straks af browseren som en slags kodningssprog. Brug semantiske tags korrekt
tag for indrykningstekst, der ikke er et citat. Dette skyldes, at blokquotes er indrykket som standard. Hvis du blot vil have fordele ved indrykning, men teksten ikke er en blokquote, skal du bruge CSS-margener i stedet.
tag indrykker den tekst i de fleste browsere. Dette er både semantisk forkert og ugyldigt HTML, som kun
tag. Brug igen margen eller polstringstilstanden til indrykningsteksten.
Hvilke HTML-tags er semantiske?
Forkortelse forkortelse Langt citat Definition Adresse for forfatter (er) af dokumentet Citation Kode reference Teletype tekst Logisk division Generisk inline stil container Slettet tekst Indsendt tekst Vægt Stærk vægt Første niveau overskrift Andet overskrift Tredje niveau overskrift Fjerde niveau overskrift Fifth-level overskrift Sjette niveau overskrift Tematisk pause Tekst, der skal indtastes af brugeren
Forformateret tekst Kort inline citat Prøveudgang Sænket Hævet Variabel eller brugerdefineret tekst
