Praeguse valdkonna eest vastutava Web Standards liikumise oluline põhimõte on idee kasutada HTML-elemente nende asemel, mitte selle järgi, kuidas need vaikimisi brauseris ilmuvad. Seda nimetatakse semantilise HTML-i kasutamiseks.
Mis on semantiline HTML?
Semantiline HTML või semantiline märgistus on HTML, mis tutvustab veebilehe tähendust, mitte ainult esitlust. Näiteks
silt näitab, et lisatud tekst on lõik.
See on nii semantiline kui ka esitlusviis, sest inimesed teavad, millised lõigud on ja brauserid teavad, kuidas neid kuvada.
Selle võrrandi külgedel ei ole sildid nagu ja semantilised, sest need määravad ainult selle, kuidas tekst peaks välja nägema (paksus või kaldkriips) ja ei anna märgistusele täiendavat tähendust.
Semantiliste HTML-koodide näidete hulka kuuluvad päise märgendid
läbi , , ja . Seal on veel palju semantilisi HTML-märgendeid, mida saab kasutada standarditele vastava veebisaidi koostamisel.
Miks sa peaksid semantika eest hoolitsema
Semantilise HTML-i kirjutamise eelis tuleneb sellest, milline peaks olema mis tahes veebilehe juhtimisvõimalus - soov suhelda. Lisades oma dokumendile semantilise märgendi, esitate lisateavet selle dokumendi kohta, mis toetab suhtlemist. Täpsemalt tähendavad semantilised märgised brauserile selgeks, milline on lehe ja selle sisu tähendus.
See selgus edastatakse ka otsingumootoritega, tagades õigete lehtede õigete päringute edastamise.
Semantilised HTML-märgendid annavad teavet nende siltide sisu kohta, mis ulatub kaugemale sellest, kui nad lehel kuvatakse. Brauseris tuvastatakse kohe -sildis sisalduv tekst, mis on mõne tüüpi kodeerimiskeel.
Selle koodi muutmise asemel püüab brauser mõista, et kasutate seda teksti koodi näitena mingi artikli või veebiõppe vormis.
Semantiliste märgiste kasutamine annab teile veel palju konksu sisu kujundamiseks. Võibolla eelistate, et teie koodiproovid kuvatakse vaikimisi brauseri stiilis, kuid homme soovite neid halli taustavärviga helistada ja hiljem soovite määratleda täpse mono-vahele jääva font-perekonna või font-stacki , mida kasutada teie proovid. Saate kergesti teha kõik need asjad, kasutades semantilist märgistust ja nutikalt rakendatud CSS-i.
Kasutage semantilisi sildid õigesti
Kui soovite semantilist silti kasutada pigem tähenduse kui esitusviisi edastamiseks, peate olema ettevaatlik, et te ei kasuta neid lihtsalt tavaliste kuvamisobjektide jaoks valesti. Mõned kõige sagedamini väärkasutatud semantilised märgendid on järgmised:
- Blockquote - Mõned inimesed kasutavad -märki, et sisestada tekst, mis pole tsitaat. Seda seetõttu, et pühadevahelised pakkumised on vaigistatud. Kui soovite lihtsalt sisselogimise eeliseid, kuid tekst pole blokeering, kasutage selle asemel CSS-i marginaale.
- p - Mõned veebi toimetajad kasutavad paragraofis sisalduvat
& nbsp; (paragraophis sisalduv mittetäieliku ruumi), et lisada lehe elementide vahel rohkem ruumi, mitte määratleda selle lehe teksti tegelikud lõigud. Nagu eelnevalt mainitud taande näitel, peaksite ruumi lisamiseks kasutama margin- või padding stiilis vara.
- ul - Nagu blokeotistes, asetatakse teksti ümbritsev
tag tagab selle teksti enamikus brauserites. See on nii semantiliselt vale kui ka kehtetu HTML, kuna ainult - sildid kehtivad
tag. Teksti sisestamiseks kasutage jälle marginaali või polstri stiili.
- h1-h6 - Pealkirjamärke saab kasutada fontide tegemiseks suuremaks ja julgemaks, kuid kui tekst ei ole pealkiri, ei tohiks see olla pealkirja märgendis. Selle asemel kasutage font-kaalu ja font-size CSS-i omadusi, kui soovite oma lehe konkreetse teksti suurust või kaalu muuta.
Kasutades HTML-märgendeid, millel on tähendus, loote lehti, mis annavad rohkem teavet kui lihtsalt ümbritsevad kõike
siltidega.
Millised HTML-sõnad on semantilised?
Kuigi peaaegu kõigil HTML4-märgenditel ja kõigil HTML5-märgenditel on semantiline tähendus, on mõned sildid enamasti semantilised.
Näiteks HTML5 on uuesti määratlenud tähenduse, et ja silte peetakse semantiliseks. silt ei anna lisatähtsust, vaid teksti, mis on tavaliselt paksus kirjas. -märg ei kajasta eriti tähtsust ega rõhuasetust, vaid määrab teksti, mis on tavaliselt kaldkirjas kujutatud.
Semantilised HTML-i märgendid
Lühend Akronüüm
Pikk tsitaat Määratlus Aadress dokumendi autori (de) jaoks Viide Koodi viide Teleteksti tekst Loogiline jaotus Üldine inline stiilis konteiner Kustutatud tekst Sisestatud tekst Rõhk Tugev rõhk
Esimese taseme pealkiri
Teise taseme pealkiri
Kolmanda taseme pealkiri
Neljanda taseme pealkiri
Viienda taseme pealkiri
Kuutasendist pealkiri
Temaatiline vaheaeg Tekst, mille kasutaja peab sisestama
Eelvormindatud tekst
Lühike vahetus tsitaat Proovi väljund Alapealkiri Ülenurk Muutuja või kasutaja määratletud tekst
, ja . Seal on veel palju semantilisi HTML-märgendeid, mida saab kasutada standarditele vastava veebisaidi koostamisel.
Miks sa peaksid semantika eest hoolitsema
Semantilise HTML-i kirjutamise eelis tuleneb sellest, milline peaks olema mis tahes veebilehe juhtimisvõimalus - soov suhelda. Lisades oma dokumendile semantilise märgendi, esitate lisateavet selle dokumendi kohta, mis toetab suhtlemist. Täpsemalt tähendavad semantilised märgised brauserile selgeks, milline on lehe ja selle sisu tähendus.
See selgus edastatakse ka otsingumootoritega, tagades õigete lehtede õigete päringute edastamise.
Semantilised HTML-märgendid annavad teavet nende siltide sisu kohta, mis ulatub kaugemale sellest, kui nad lehel kuvatakse. Brauseris tuvastatakse kohe -sildis sisalduv tekst, mis on mõne tüüpi kodeerimiskeel.
Selle koodi muutmise asemel püüab brauser mõista, et kasutate seda teksti koodi näitena mingi artikli või veebiõppe vormis.
Semantiliste märgiste kasutamine annab teile veel palju konksu sisu kujundamiseks. Võibolla eelistate, et teie koodiproovid kuvatakse vaikimisi brauseri stiilis, kuid homme soovite neid halli taustavärviga helistada ja hiljem soovite määratleda täpse mono-vahele jääva font-perekonna või font-stacki , mida kasutada teie proovid. Saate kergesti teha kõik need asjad, kasutades semantilist märgistust ja nutikalt rakendatud CSS-i.
Kasutage semantilisi sildid õigesti
Kui soovite semantilist silti kasutada pigem tähenduse kui esitusviisi edastamiseks, peate olema ettevaatlik, et te ei kasuta neid lihtsalt tavaliste kuvamisobjektide jaoks valesti. Mõned kõige sagedamini väärkasutatud semantilised märgendid on järgmised:
- Blockquote - Mõned inimesed kasutavad -märki, et sisestada tekst, mis pole tsitaat. Seda seetõttu, et pühadevahelised pakkumised on vaigistatud. Kui soovite lihtsalt sisselogimise eeliseid, kuid tekst pole blokeering, kasutage selle asemel CSS-i marginaale.
- p - Mõned veebi toimetajad kasutavad paragraofis sisalduvat
& nbsp; (paragraophis sisalduv mittetäieliku ruumi), et lisada lehe elementide vahel rohkem ruumi, mitte määratleda selle lehe teksti tegelikud lõigud. Nagu eelnevalt mainitud taande näitel, peaksite ruumi lisamiseks kasutama margin- või padding stiilis vara.
- ul - Nagu blokeotistes, asetatakse teksti ümbritsev
tag tagab selle teksti enamikus brauserites. See on nii semantiliselt vale kui ka kehtetu HTML, kuna ainult - sildid kehtivad
tag. Teksti sisestamiseks kasutage jälle marginaali või polstri stiili.
- h1-h6 - Pealkirjamärke saab kasutada fontide tegemiseks suuremaks ja julgemaks, kuid kui tekst ei ole pealkiri, ei tohiks see olla pealkirja märgendis. Selle asemel kasutage font-kaalu ja font-size CSS-i omadusi, kui soovite oma lehe konkreetse teksti suurust või kaalu muuta.
Kasutades HTML-märgendeid, millel on tähendus, loote lehti, mis annavad rohkem teavet kui lihtsalt ümbritsevad kõike
siltidega.
Millised HTML-sõnad on semantilised?
Kuigi peaaegu kõigil HTML4-märgenditel ja kõigil HTML5-märgenditel on semantiline tähendus, on mõned sildid enamasti semantilised.
Näiteks HTML5 on uuesti määratlenud tähenduse, et ja silte peetakse semantiliseks. silt ei anna lisatähtsust, vaid teksti, mis on tavaliselt paksus kirjas. -märg ei kajasta eriti tähtsust ega rõhuasetust, vaid määrab teksti, mis on tavaliselt kaldkirjas kujutatud.
Semantilised HTML-i märgendid
Lühend Akronüüm
Pikk tsitaat Määratlus Aadress dokumendi autori (de) jaoks Viide Koodi viide Teleteksti tekst Loogiline jaotus Üldine inline stiilis konteiner Kustutatud tekst Sisestatud tekst Rõhk Tugev rõhk
Esimese taseme pealkiri
Teise taseme pealkiri
Kolmanda taseme pealkiri
Neljanda taseme pealkiri
Viienda taseme pealkiri
Kuutasendist pealkiri
Temaatiline vaheaeg Tekst, mille kasutaja peab sisestama
Eelvormindatud tekst
Lühike vahetus tsitaat Proovi väljund Alapealkiri Ülenurk Muutuja või kasutaja määratletud tekst