• Zkratky a akronymy v HTML. Méně známé sémantické prvky Podívejte se, co je "TAG" v jiných slovnících

    Web je dnes stále více sémantický. Co ale znamená „sémantický“? Proč je to důležité?

    Sémantické HTML vyjadřuje význam dokumentu. Jde spíše o to, jaký je text, než jak vypadá. Dobré sémantické značení pomáhá lidem i počítačům lépe porozumět obsahu dokumentu a jeho kontextu.

    Sémantické označení je mnohem snazší interpretovat. Je optimalizace pro vyhledávače přátelská. Funguje skvěle s moderními prohlížeči, snižuje množství kódu potřebného k vyjádření obsahu a zlepšuje čitelnost tohoto kódu.

    Dobře, takže sémantické značení je dobré, ale jak ho použít. Nejlepší je začít nahrazením běžných značek výraznějšími. Podívejme se na osm prvků, které vám umožní vstoupit do této hry.

    Jako tvůj hranatý bratranec
    , tag používá se k označení citace.

    Proč nepoužít uvozovky? Uvozovky nemusí vždy znamenat citaci. Někdy se používají pro sémantické zvýraznění, ironii nebo k označení názvu něčeho – a v této souvislosti se používají správně. Pokud však něco citujete, jasně vyjadřuje váš záměr.

    A

    Za starých dobrých časů tagy A označovalo text zvýrazněný kurzívou a tučným písmem. Jak myšlenka oddělení sémantiky od prezentace nabývala na síle, začalo se na tyto značky pohlížet s podezřením. Byly nahrazeny štítky A označující příslušně důraz a silný důraz.

    V HTML5 dostávají tyto značky konečně skvělou sémantickou interpretaci. štítek označený text, který má jiný tón nebo náladu. To je užitečné například pro popis myšlenek nebo odborných termínů. Štítek označí text, který je stylově odlišný od normálního textu, ale nemá žádný zdůrazněný sémantický význam. Jak se to liší od používání ? Klíč je v tom nenese žádný sémanticky odlišný význam.

    používá se pro zkratky! Může se hodit zejména v dokumentech, kde je jich hodně. Tato značka má volitelný atribut titul, ve kterém můžete zadat plnou verzi textu.

    lol nevím g2g ttyl

    Pojďme se podívat na klasický problém s lokalizací data. V USA je 5. říjen 2013 zapsán jako 10/05/13, v Británii je to 05/10/13, v Jižní Africe je to 2013/10/05, v Rusku je to 05/10/13. Všechny tyto možnosti velmi ztěžují úkol automatického rozpoznávání dat.

    Štítek umožňuje zadat datum a čas ve strojově čitelném formátu. Předchozí příklad by mohl vypadat nějak takto: . Analyzátory HTML budou schopny přesně porozumět datu bez ohledu na to, v jakém formátu jej zadáme. Štítek také umožňuje volitelně zadat čas ve 24. formátu: ;

    Dělal jsi to někdy?

    Tři sta stran nudného, ​​zbytečného textu. Jedna věc, kterou potřebujete vědět, a už ji nikdy nenajdete, pokud ji nezvýrazníte. Více nudných věcí…


    Už ne. HTML5 zavedlo prvek , který označuje text, který je zvýrazněn pro referenční účely kvůli jeho vysoké důležitosti.

    Ano, . Pravděpodobně používáte , možná dokonce , použil jsi někdy jiné typy? V HTML5 lze použít s celou řadou nových typů:
    • e-mailem
    • číslo
    • rozsah
    • Vyhledávání
    • barva
    To je skvělé, ale nejprve se musíte ujistit, že vaše cílové prohlížeče toto vše podporují. To je stále problém.

    Sestavili jste někdy menu z neuspořádaného seznamu?

    • OTEVŘENO
    • Uložit
    • Přestat

    Už to nedělej! Pro toto existuje

    , což je neuspořádaný seznam příkazů. Tato značka má atribut typ, který může nabývat hodnot: vyskakovat nebo Panel nástrojů.

  • OTEVŘENO
  • Uložit
  • Přestat
    •

    Bonus

    Většina front-end vývojářů používá HTML při psaní, ale mnozí neznají jeho skutečný význam. Nerozdělitelná mezera nepřeruší řádek. To znamená, že pokud jsou dvě slova spojena pevnou mezerou, budou vždy spolu na stejném řádku. Někdy je to velmi důležité. Zde jsou nějaké příklady:
    • Jednotky: 12m/s
    • Čas: 20:00
    • Vlastní jména: Dairy Queen
    K dispozici je také pevná pomlčka ( ‑ ) pro podobné účely.

    Konečně

    HTML se den ode dne stává více a více sémantickým. Použití všech těchto prvků je dobrým začátkem psaní přístupnějších značek. Pro úplnější obrázek se podívejte

    Živel HTML zkratky () je zkratka nebo zkratka; Volitelný atribut title může poskytnout rozšíření nebo popis zkratky. Pokud je uveden, název musí obsahovat tento úplný popis a nic jiného.

    Článek Jak zkratky označovat a učinit je srozumitelnými je návod, jak se naučit používat a související položky.

    Atributy

    Tento prvek podporuje pouze globální atributy. Atribut title má při použití s ​​prvkem specifický význam ; On musí obsahovat úplný lidsky čitelný popis nebo rozšíření zkratky. Tento text se v prohlížečích často zobrazuje jako nápověda, když kurzor myši najede na prvek.

    Každý prvek používáte, nezávisí na všech ostatních; poskytnutí názvu pro jednoho automaticky nepřipojí stejný text rozšíření k ostatním se stejným textem obsahu.

    Poznámky k použití

    Typické případy použití

    Samozřejmě není nutné, aby byly označeny všechny zkratky . Existuje však několik případů, kdy je to užitečné:

    Gramatické úvahy

    V jazycích s gramatickým číslem (tj. v jazycích, kde počet prvků ovlivňuje gramatiku věty), použijte v atributu title stejné gramatické číslo jako uvnitř vašeho prvku. . To je zvláště důležité v jazycích s více než dvěma čísly, jako je arabština, ale také v angličtině.

    Výchozí styl

    Účel tohoto prvku je čistě pro pohodlí autora a všechny prohlížeče jej ve výchozím nastavení zobrazují inline ( display : inline ), i když se jeho výchozí styl v jednotlivých prohlížečích liší:

    • Některé prohlížeče, jako je Internet Explorer, jej nevytvářejí jinak než prvek .
    • Opera, Firefox a několik dalších přidávají k obsahu prvku pomlčky.
    • Několik prohlížečů nejen přidá čárkované podtržení, ale také jej vloží malými velkými písmeny; Chcete-li se tomuto stylu vyhnout, přidejte něco jako font-variant : none v CSS se o tento případ nepostará.

    Příklady

    Významové označení zkratky

    Chcete-li označit zkratku bez poskytnutí rozšíření nebo popisu, jednoduše použijte bez jakýchkoli atributů, jak ukazuje tento příklad.

    HTML

    Použitím HTML je zábavné a snadné!

    výsledek

    Podmíněné zkratky

    CSS můžete použít k nastavení vlastního stylu, který bude použit pro zkratky, jak je vidět v tomto jednoduchém příkladu.

    HTML

    Použitím css, můžete si stylizovat zkratky!

    css

    abbr ( varianta písma: všechna malá písmena; )

    výsledek

    Zajištění expanze

    Přidání atributu title vám umožní zadat rozšíření nebo definici zkratky nebo zkratky.

    HTML

    Ashokův vtip mě přivedl lol velký čas.

    výsledek

    Zkratka Definice

    Můžeš použít v tandemu s pro formálnější definici zkratky, jak je uvedeno zde.

    HTML

    HTML je značkovací jazyk používaný k vytvoření sémantiky a struktury webové stránky.

    A Specifikace (spec) je dokument, který podrobně popisuje, jak má technologie nebo API fungovat a jak se k nim přistupuje.

    výsledek

    Dostupnost

    Úplný popis zkratky nebo akronymu při prvním použití na stránce pomáhá lidem porozumět jim, zejména pokud jde o technický nebo oborový žargon.

    příklad

    Zápis objektů JavaScript( JSON) je odlehčený formát pro výměnu dat.

    To je užitečné zejména pro lidi, kteří nejsou obeznámeni s terminologií nebo koncepty probíranými v obsahu, pro lidi, kteří jsou s jazykem noví, a pro lidi s kognitivními problémy.

    Charakteristika

    Kompatibilita prohlížeče

    ZvláštnostWebové zobrazení AndroidChrome pro Androidedge mobileFirefox pro Androidoperační systém AndroidSafari pro iOSInternetový obchod Samsung
    Základní podporaAnoAnoAno 4 AnoAnoAno

    1. Před Firefoxem 4 tento prvek implementoval rozhraní HTMLSpanElement namísto standardního rozhraní HTMLElement.

    Popis

    Štítek označuje, že sekvence znaků je zkratka. Pomocí atributu title je uveden přepis zkratky, který umožňuje porozumět zkratce i lidem, kteří ji neznají. Vyhledávače navíc indexují fulltextovou verzi zkratky, což lze využít ke zvýšení hodnocení dokumentu.

    Prohlížeče nezvýrazňují text uvnitř , s výjimkou Opery starší než verze 15, která přidává k textu čárkované podtržení.

    Syntax

    Text

    Atributy

    Přidá k textu nápovědu, ve které můžete podat vysvětlení zkratky.

    Uzavírací štítek

    Požadované.

    HTML5 IE Cr Op Sa Fx

    Značka ABBR

    CGI označuje protokol, pomocí kterého jakýkoli externí program komunikuje s webovým serverem. Pomocí CGI na serveru můžete spouštět programy v jakémkoli programovacím jazyce a zobrazovat výsledek jejich akce jako webovou stránku.

    Výsledek tohoto příkladu je znázorněn na Obr. 1.

    Rýže. 1. Typ popisku při najetí myší na text zkratky

    Prohlížeče

    Internet Explorer do verze 6 včetně tuto značku nepodporuje , místo toho se doporučuje použít značku .

    Obraťme svou pozornost k tématu zkratek na webových stránkách, respektive srozumitelnosti těchto zkratek pro čtenáře. Tento článek pojednává o značkách zkratek a akronymů a nuancích s nimi spojených.

    Pozornost!!! Ve specifikaci HTML5 prvek akronym prohlášeno za zcela zastaralé a důrazně doporučeno k odstranění z používání. Místo toho se navrhuje použít prvek zkr(upřesnění z 11.10.2011) .

    Orientace v terminologii

    Zkratka (italsky abbreviatura - zkratka, z latinského abbrevio - stříhám) je zkrácená forma slova nebo skupiny slov používaná místo celého slova nebo fráze. Například: WWW , HTTP , URI , zkr. atd. Zkratka (řecky akros - vysoký, onima - jméno) je zkratka tvořená částmi slov původní fráze (obvykle počáteční písmena), vyslovovaná jako jedno slovo, a nikoli písmeno po písmenu, jako jiné typy zkratek. . Například: modem , radar nebo laser .

    Zkratky a akronymy by měly být každému a vždy jasné

    Poměrně často používáme různé zkratky, od „zamkompomorde“ po „ASS“ (to není vůbec to, co si myslíte). Ale také dost často mnoho lidí netuší, co tyto zkratky znamenají. Proto při použití jakéhokoli termínu, který je zkratkou nebo akronymem, je třeba jim poskytnout vysvětlení. Navíc, pokud jste zadali termín na začátku a vysvětlili jste jej, neznamená to, že člověk nezapomene jeho význam do 2 minut, takže vysvětlení by měla být vždy nablízku.

    HTML tagy A

    HTML 4 nám poskytuje dva logické prvky formátování používané ke zvýraznění zkratek a akronymů – abbr a acronym . Tyto značky mají atribut title, který daný termín vysvětluje. Každý běžný prohlížeč zobrazí nápovědu určenou atributem title při najetí myší na takový výraz.

    Příklad: WWW modem

    www modem

    Billy, který nemá rád W3C

    IE (až do verze 6) nepodporuje značku ABBR(omlouvám se za to tak brzy, bez přípravy :-)

    V seznamu jemu známých prvků je uveden pouze prvek AKRONYM. Ale jsem si jistý, že to bude opraveno v sedmé verzi prohlížeče.

    Samozřejmě se na to můžete vykašlat a místo značky abbr použít značku akronymu, ale pak se nedivte, když hlasový agent uživatele vysloví písmennou zkratku URI nikoli písmeno po písmenu, ale jedním slovem, a dostanete jméno Uri z filmu / f "Dobrodružství elektroniky". Můžete však také najít řešení, například vložit prvek SPAN do ABBR:

    css

    A je lepší tento proces automatizovat prováděním vkládání pomocí skriptu, po načtení dokumentu a pouze pro IE. A co je velmi důležité, nebude potřeba měnit opravit původní text dokumentu.

    Nastavení CSS maratonu

    Protože abbr a akronym jsou prvky logického formátování, prohlížeče je mohou na stránce zobrazovat odlišně. Například Mozilla Firefox a Opera zobrazují tyto prvky s černým podtržením jako tečky, Konqueror tyto prvky uvádí kurzívou a IE je vizuálně nezvýrazňuje (akronym).

    Proto neuškodí nastavit styly, které by sjednotily zobrazení těchto prvků v různých prohlížečích.

    Například takto:

    ABBR, AKRONYM (
    border-bottom: 1px tečkovaný #F04B2D;
    kurzor:pomoc;
    styl písma: kurzíva;

    Přečtěte si více: