Een belangrijk principe van de Web Standards-beweging die verantwoordelijk is voor de branche die we vandaag hebben, is het idee om HTML-elementen te gebruiken voor wat ze zijn in plaats van hoe ze standaard in de browser kunnen verschijnen. Dit staat bekend als Semantic HTML gebruiken.
Wat is semantische HTML
Semantische HTML of semantische markup is HTML die betekenis aan de webpagina introduceert in plaats van alleen maar aan de presentatie. Bijvoorbeeld a
tag geeft aan dat de ingesloten tekst een alinea is.
Dit is zowel semantisch als presentatief, omdat mensen weten welke paragrafen zijn en browsers weten hoe ze moeten worden weergegeven.
Aan de andere kant van deze vergelijking, tags zoals en zijn niet semantisch, omdat ze alleen definiëren hoe de tekst eruit moet zien (vet of cursief) en geen extra betekenis aan de markup geven. Voorbeelden van semantische HTML-tags zijn de header-tags Het voordeel van het schrijven van semantische HTML komt voort uit wat het drijfdoel van elke webpagina zou moeten zijn: de wens om te communiceren. Door semantische tags aan uw document toe te voegen, geeft u aanvullende informatie over dat document, wat de communicatie ten goede komt. Met name maken semantische tags het voor de browser duidelijk wat de betekenis van een pagina en de inhoud ervan is. Die helderheid wordt ook gecommuniceerd met zoekmachines, zodat de juiste pagina's voor de juiste vragen worden aangeleverd. Semantische HTML-tags bieden informatie over de inhoud van die tags die verder gaat dan alleen hoe ze eruitzien op een pagina. Tekst die is ingesloten in de In plaats van te proberen die code weer te geven, begrijpt de browser dat u die tekst gebruikt als een voorbeeld van de code voor het doel van een artikel of een online zelfstudie. Het gebruik van semantische tags geeft je nog veel meer haken voor het stylen van je inhoud. Misschien geeft u er vandaag de voorkeur aan dat uw codevoorbeelden in de standaardbrowserstijl worden weergegeven, maar morgen wilt u ze met een grijze achtergrondkleur oproepen, en later wilt u de precieze lettertypenfamilie of -lettertype die u wilt gebruiken voor uw monsters. Je kunt al deze dingen gemakkelijk doen door semantische opmaak en slim toegepaste CSS te gebruiken. Als u semantische tags wilt gebruiken om betekenis over te brengen in plaats van presentaties, moet u erop letten dat u ze niet verkeerd gebruikt, gewoon vanwege hun gemeenschappelijke display-eigenschappen. Enkele van de meest gebruikte semantische tags zijn: Door HTML-tags te gebruiken die betekenis hebben, maakt u pagina's die meer informatie geven dan alleen maar alles omringen Hoewel bijna elke HTML4-tag en alle HTML5-tags een semantische betekenis hebben, zijn sommige tags voornamelijk semantisch van aard. HTML5 heeft bijvoorbeeld de betekenis van het. Opnieuw gedefinieerd en tags worden semantisch. De tag geeft geen extra belangrijkheid, maar eerder tekst die doorgaans vetgedrukt wordt weergegeven. De tag geeft ook geen extra belangrijkheid of nadruk, maar definieert eerder tekst die doorgaans cursief wordt weergegeven. Semantische HTML-tagsdoor
,
,
en . Er zijn veel meer semantische HTML-tags die kunnen worden gebruikt bij het samenstellen van een website die aan de standaarden voldoet.Waarom u moet geven om semantiek
tag wordt onmiddellijk door de browser herkend als een soort coderingstaal. Gebruik correct semantische tags
tag voor het inspringen van tekst die geen citaat is. Dit komt omdat blockquotes standaard inspringen. Als u alleen maar wilt profiteren van inspringen, maar de tekst geen blockquote is, gebruikt u in plaats hiervan CSS-marges.
tag inspringen die tekst in de meeste browsers. Dit is zowel semantisch incorrect als ongeldige HTML, alleen als
label. Gebruik opnieuw de marge- of opvulstijl om tekst te laten inspringen.
Welke HTML-tags zijn semantisch?
Afkorting Acroniem Lange prijsopgave Definitie Adres voor auteur (s) van het document Citaat Codeverwijzing Teletype tekst Logische verdeling Generieke inline-stijlcontainer Verwijderde tekst Ingevoegde tekst Nadruk Sterke nadruk Kop op het eerste niveau Kop op het tweede niveau Kop op het derde niveau Vierde niveau kop Kop op het vijfde niveau Kop op zesde niveau Thematische pauze Tekst die door de gebruiker moet worden ingevoerd
Voorgeformatteerde tekst Korte inline-offerte Voorbeelduitvoer Onderschrift superscript Variabele of door de gebruiker gedefinieerde tekst
