Dôležitým princípom hnutia Web Standards, ktorý je zodpovedný za odvetvie, ktoré dnes máme, je myšlienka používania prvkov HTML pre to, čo sú skôr než ako sa môžu v prehliadači zobraziť štandardne. Toto je známe ako používanie sémantického HTML.
Čo je sémantický HTML
Sémantický HTML alebo sémantický značkovanie je HTML, ktorý predstavuje význam pre webovú stránku a nie pre prezentáciu. Napríklad a
značka označuje, že priložený text je odsek.
Toto je sémantické aj prezentačné, pretože ľudia vedia, čo sú odseky a prehliadače vedia, ako ich zobraziť.
Na druhej strane tejto rovnice, značky ako a nie sú sémantické, pretože definujú iba to, ako by text mal vyzerať (tučné alebo kurzíva) a neposkytuje žiadny ďalší význam značke. Príklady sémantických značiek HTML obsahujú hlavičky Výhoda písania sémantického HTML vyplýva z toho, čo by malo byť cieľom všetkých webových stránok - túžba komunikovať. Pridaním sémantických značiek do dokumentu poskytnete ďalšie informácie o tomto dokumente, ktoré pomáhajú pri komunikácii. Konkrétne sémantické značky jasne ukazujú prehliadaču, čo znamená stránka a jej obsah. Táto zrozumiteľnosť je komunikovaná aj s vyhľadávacími mechanizmami, ktoré zabezpečujú, že správne stránky sa doručia na správne dopyty. Sémantické značky HTML poskytujú informácie o obsahu týchto značiek, ktoré presahujú len to, ako vyzerajú na stránke. Text, ktorý je priložený v priečinku Namiesto pokusu o vykreslenie tohto kódu prehliadač chápe, že tento text používate ako príklad kódu na účely článku alebo online tutoriálu nejakého druhu. Používanie sémantických značiek vám poskytne oveľa viac hákov na štýl vášho obsahu. Možno dnes dáte prednosť tomu, aby sa vzorky kódu zobrazovali v predvolenom štýle prehliadača, ale zajtra ich chcete zavolať sivou farbou pozadia a neskôr chcete definovať presnú jednozložkovú rodinu písiem alebo zásobník fontov, ktorý sa má používať vaše vzorky. Môžete ľahko urobiť všetky tieto veci pomocou sémantického značkovania a inteligentne aplikované CSS. Ak chcete používať sémantické značky na vyjadrenie významu, a nie na účely prezentácie, musíte dávať pozor, aby ste ich nepoužívali nesprávne jednoducho pre svoje bežné zobrazovacie vlastnosti. Medzi najčastejšie zneužité sémantické značky patria: Pomocou značiek HTML, ktoré majú zmysel, vytvárate stránky, ktoré poskytujú viac informácií, než len tým, že všetko obklopujú Zatiaľ čo takmer každá značka HTML4 a všetky značky HTML5 majú sémantický význam, niektoré značky majú predovšetkým sémantický charakter. Napríklad HTML5 zmenil definíciu výrazu a tagy majú byť sémantické. značka nepredstavuje mimoriadny význam, ale skôr text, ktorý je zvyčajne vykreslený tučným písmom. značka tiež neprináša ďalšiu dôležitosť alebo dôraz, ale skôr definuje text, ktorý sa zvyčajne zobrazuje kurzívou. Sémantické HTML tagyskrz
,
,
a , Existuje mnoho ďalších sémantických tagov HTML, ktoré je možné použiť pri vytváraní webových stránok vyhovujúcich normám.Prečo by ste mali starať o sémantiku
tag je prehliadač okamžite rozpoznaný ako určitý typ kódovacieho jazyka. Používajte sémantické značky správne
značku pre odsadenie textu, ktorý nie je citátom. Je to preto, že blokové kvóty sú predvolene odsadené. Ak jednoducho chcete mať výhodu odsadenia, ale text nie je bloková, použite namiesto toho okraje CSS.
tag označuje text vo väčšine prehliadačov. Toto je sémanticky nesprávne aj neplatné HTML, ako len
tag. Znova použite okraj alebo štýl vycpávky na odsadenie textu.
Ktoré HTML značky sú sémantické?
Skratka akronym Dlhý citát definícia Adresa autora (autorov) dokumentu citácie Odkaz na kód Text teletypu Logické rozdelenie Generic kontajner inline štýlu Odstránený text Vložený text Dôraz Silný dôraz Titulok prvej úrovne Titulok druhej úrovne Nadpis tretej úrovne Nadpis štvrtej úrovne Nadpis na piatej úrovni Titul šiestej úrovne Tematická prestávka Text, ktorý má byť zadaný používateľom
Predformátovaný text Krátka inline citácia Vzorový výstup index nazvaný Variabilný alebo užívateľom definovaný text
