En viktig princip i webbstandardrörelsen som är ansvarig för branschen vi har idag är idén att använda HTML-element för vad de är snarare än hur de kan visas i webbläsaren som standard. Detta är känt som att använda semantisk HTML.
Vad är semantisk HTML
Semantisk HTML eller semantisk markering är HTML som introducerar mening till webbsidan snarare än bara presentation. Till exempel a
tagg indikerar att den bifogade texten är en paragraf.
Detta är både semantiskt och presentativt, eftersom folk vet vilka avsnitt som är och webbläsare vet hur de ska visas.
På baksidan av denna ekvation är märken som och är inte semantiska, eftersom de bara definierar hur texten ska se ut (fet eller kursiv) och ger ingen ytterligare betydelse för markeringen. Exempel på semantiska HTML-taggar inkluderar rubrikrubrikerna Fördelen med att skriva semantisk HTML stammar från vad som ska vara det drivande målet för vilken webbsida som helst - viljan att kommunicera. Genom att lägga till semantiska taggar i ditt dokument tillhandahåller du ytterligare information om det dokumentet, vilket hjälper kommunikationen. Specifikt gör semantiska taggar klart för webbläsaren vad meningen med en sida och dess innehåll är. Den tydligheten kommuniceras också med sökmotorer, så att rätt sidor levereras för de rätta frågorna. Semantiska HTML-taggar ger information om innehållet i de taggarna som går utöver hur de ser ut på en sida. Text som bifogas I stället för att försöka göra den koden förstår webbläsaren att du använder den texten som ett exempel på koden för en artikel eller online-handledning av något slag. Att använda semantiska taggar ger dig många fler krokar för att ställa in ditt innehåll. Kanske föredrar du idag att visa kodprover i standardwebbläsars stil, men i morgon vill du ringa dem ut med en grå bakgrundsfärg och senare vill du definiera den exakta monofaserade typfamiljen eller fontstacken som ska användas för dina prov. Du kan enkelt göra alla dessa saker genom att använda semantisk markering och smart tillämpad CSS. När du vill använda semantiska taggar för att förmedla mening snarare än för presentationsändamål, måste du vara försiktig med att du inte använder dem felaktigt helt enkelt för deras vanliga visningsegenskaper. Några av de vanligaste missbrukade semantiska taggarna är: Genom att använda HTML-taggar som har betydelse skapar du sidor som ger mer information än att bara omge allt med Medan nästan varje HTML4-tagg och alla HTML5-taggar har en semantisk mening, är vissa taggar huvudsakligen semantiska i naturen. Till exempel har HTML5 omdefinierat meningen med och taggar att vara semantiska. De taggen förmedlar inte extra betydelse, utan snarare text som oftast gjorts i fetstil. De taggen förmedlar inte extra betydelse eller betoning, men definierar snarare text som vanligtvis görs i kursiv. Semantiska HTML-taggargenom
,
,
och . Det finns många fler semantiska HTML-taggar som kan användas när du bygger en standardkompatibel webbplats.Varför du bör bry sig om semantik
taggen känns genast av webbläsaren som en typ av kodningsspråk. Använd semantiska etiketter korrekt
tagg för indrycktext som inte är ett citat. Detta beror på att blockquotes är indragna som standard. Om du bara vill ha fördelar med indryckning, men texten inte är en blockquote, använd CSS-marginaler istället.
taggar indrar den texten i de flesta webbläsare. Detta är både semantiskt felaktigt och ogiltigt HTML, som bara
märka. Återigen, använd marginal- eller vadderingsstilen till indragstexten.
Vilka HTML-taggar är semantiska?
Förkortning Akronym Lång citat Definition Adress för författare (er) i dokumentet Citat Kodreferens Teletyptext Logisk uppdelning Generisk inline-stilbehållare Raderad text Infogad text Betoning Stark vikt Första nivån rubrik Avancerad rubrik Tredje nivån rubrik Fyrstegsrubrik Fifth-level rubrik Säsongens rubrik Tematisk paus Text som ska anges av användaren
Förformaterad text Kort inline citat Provutmatning Index Exponent Variabel eller användardefinierad text
