Analýza HTML elementů a uchovávaných informací¶

Globální atributy¶

Atribut	Uchovávat	Komentář/popis
accesskey	DISKUZE	klávesová zkratka umožňující přistupovat k elementu - můžeme použít k ovládání stránky?
autocapitalize	NE	automaticky zapnout načítání velkých písmen při zadávání do textu
autofocus	NE	automatické zaměření na element
class	ANO	půjde použít při manipulaci s elementem
contenteditable	ANO	umožňuje uživatelům upravovat obsah elementu přímo ve webovém prohlížeči, hodnoty true false
contextmenu	ANO	k definici vlastního kontextového menu (nebo také známého jako kontextového menu s kliknutím pravým tlačítkem) pro daný element
data-*	NE	umožňuje vkládat libovolná uživatelská data přímo do HTML elementů, pro uchování informací
dir	DISKUZE	obsahově ho nepotřebujeme, ale možná bude třeba k manipulaci se stránkou
draggable	ANO	lze drag a drop - true, false
enterkeyhint	NE/DISKUZE	umožňuje vývojářům specifikovat, jaký typ akce by měl být spuštěn po stisknutí klávesy Enter v rámci daného vstupního pole
exportparts	NE	přídavek do CSS specifikace, který slouží k definici pojmenovaných částí (parts) HTML elementu, které jsou následně dostupné pro stylizaci pomocí CSS
hidden	NE
id	ANO	k manipulaci s elementy
inert	NE	k deaktivaci interakce s prvkem a jeho potomky
inputmode	DISKUZE	umožňuje specifikovat očekávaný způsob zadávání textu do vstupního pole
is	NE	užití s vlastními (custom) prvky HTML (př. technologie Web Components)
itemid	ANO	typ identifikátoru, používá ve strukturovaných datech, jako je například JSON-LD, Schema.org nebo RDFa, k identifikaci konkrétního prvku nebo entity
itemprop	NE	bez hodnoty, součást mikrodatového značkování (Microdata), což je způsob strukturování informací v HTML, aby bylo snazší pro vyhledávače a další webové technologie porozumět obsahu stránky.
itemref	ANO	užití při indexování, slouží k propojení různých částí strukturovaných dat, aby bylo možné jednodušeji popsat složitější struktury informací
itemscope	NE	prázdný atribut, slouží k označení elementu jako kontejneru pro strukturovaná data
itemtype	NE	slouží k určení typu strukturovaných dat, která jsou obsažena uvnitř elementu
lang	NE	používá k určení jazyka obsahu uvnitř daného HTML elementu
nonce	NE	použití politiky bezpečnostního zábrany skriptů (CSP - Content Security Policy), omezení obsahu povoleného na dané stránce
part	NE	specifikace CSS Shadow Parts. Tento atribut slouží k propojení částí vlastních prvků (custom elements) s externím CSS
popover	NE
role	NE	definici role, kterou má určitý element nebo komponenta na stránce
slot	NE	slouží k definici slotu (místa) pro obsah, který má být vložen do určitého místa v HTML šabloně.
spellcheck	NE	k určení, zda má být pro daný textový vstup aktivována automatická kontrola pravopisu
style	NE	není pro naše použití důležité
tabindex	DISKUZE	budeme simulovat klávesy? určuje pořadí, v jakém se prvek zařadí do tabulátoru
title	NE
translate	NE	označení, zda má být obsah elementu přeložen do jiného jazyka, když je zobrazen uživateli.
virtualkeyboardpolicy	NE	Určuje, jak virtuální klávesnice na dotykovém zařízení reaguje na interakci s konkrétními prvky na webové stránce - možnosti auto, manual, none

Podrobnější popis k vybraným globálním elementům¶

atribut enterkehing - hodnoty¶

• enter: Tato hodnota indikuje, že po stisknutí klávesy Enter by měla být provedena výchozí akce spojená s daným vstupním polem, například odeslání formuláře.
• done: Tato hodnota indikuje, že po stisknutí klávesy Enter by měla být provedena akce spojená s dokončením editace, například potvrzení změn v textovém poli.
• go: Tato hodnota indikuje, že po stisknutí klávesy Enter by měla být provedena akce spojená s přechodem na jinou stránku nebo spuštění určité akce.
• next: Tato hodnota indikuje, že po stisknutí klávesy Enter by měla být provedena akce spojená s přechodem na další pole ve formuláři.
• search: Tato hodnota indikuje, že po stisknutí klávesy Enter by měla být provedena akce spojená s vyhledáváním, například spuštění vyhledávání po zadání dotazu do vyhledávacího pole.

atribut inputmode - hodnoty¶

• none: Specifikuje, že vstupní pole nepřijímá žádný text, tj. není určeno k zadávání textu. Používá se pro vstupní * * pole, která slouží k volbě nebo odeslání hodnoty, ale nekromazí se v nich text.
• text: Specifikuje, že vstupní pole očekává standardní textový vstup.*
• tel: Specifikuje, že vstupní pole očekává telefonní číslo.
• url: Specifikuje, že vstupní pole očekává URL adresu.
• email: Specifikuje, že vstupní pole očekává e-mailovou adresu.
• numeric: Specifikuje, že vstupní pole očekává číselný vstup.
• decimal: Specifikuje, že vstupní pole očekává desetinné číslo.
• search: Specifikuje, že vstupní pole očekává hledací dotaz.

Elementy s pouze globálními atributy¶

<abbr>, <acronym> (deprecated) - místo toho použít <abbr>, <address>, <article>, <aside>
<b>, <bdi>, <big> (deprecated), <cite>, <datalist>, <dd>, <dl>, <dt>
<em>, <figcaption>, <figure>, <footer>, <h1> - <h6>, <header>, <hgroup>,<i>, (kbd), <main>, <mark>

Sdílené atributy¶

Atribut	ELEMENTY	Uchovávat	Komentář
href	<a>, <link>, <area>, <base>, <form>, <script>	ANO
download	<a>, <area>, <button>	ANO	ano- má-li hodnotu
target	<a>, <area>, <base>, <form>	ANO	k určení, kde má být otevřený odkaz, ať už je to nové okno, nová záložka nebo jiný rámec
ping	<a>, <area>, <form>	ANO	používá se ke sledování, které URL adresy byly vyvolány po kliknutí na odkaz
hreflang	<a>, <link>	NE	označuje jazyk nebo region cílového dokumentu nebo odkazu
referrerpolicy	<a>, <area>, <img> <iframe>, <link>, <script>	DISKUZE	jakým způsobem má být předáván tzv. "referrer" (informace o tom, odkud uživatel přišel) při načítání externího zdroje, jako jsou obrázky, skripty, styly nebo odkazy
rel	<a>, <link>, <area>, <base>, <form>	NE	definici vztahů mezi aktuálním dokumentem a odkazovaným dokumentem nebo zdrojem
type	<button>, <input>, <a>, <script>, <style>, <source>, <embed>, <li>, <link>	NE	používá se k určení typu obsahu nebo skriptu, který je obsažen v daném elementu
charset	<meta>, <a>	DISKUZE	kódování v použitém dokumentu, odkazu, ...
coords	<area>, <a>	NE	definuje jednu oblast v rámci obrázkové mapy, která může být odkazem na jiný dokument nebo akcí.
name	<a>, <form>, <iframe>, <img>, <input>, <button>, <fieldset>, <frame>(deprecated), <map>	ANO	lze použít k identifikaci
rev	<a> <link>	NE	deprecated, specifikuje revese link, opak rel
shape	<a>, <area>	NE	určuje tvar oblasti, na kterou se odkazuje
alt	<area>, <img>, <input>	NE/DISKUZE	alternativní textový popisek obsahu prvku pro uživatele
tabindex	<area>, <select>, <textarea>, <button>	DISKUZE	umožňuje určit pořadí, v jakém jsou prvky na stránce procházeny pomocí klávesnice (pomocí kláves TAB nebo jiných klávesových zkratek)
autoplay	<audio>, <video>	NE	bez hodnoty, mediální obsah se přehrává automaticky po načtení stránky
controls	<audio>, <video>	NE	bez hodnoty, zobrazení standartních ovládajích prvků (tlačítka přehrávání, regulýtor hlasitosti atd.)
controlslist	<audio>, <video>	DISKUZE	pro řízení, jaké ovládací prvky se zobrazí v uživatelském rozhraní přehrávače
crossorigin	<audio>, <video>, <img>, <script>, <link>	NE	pro zajištění bezpečného a správného načítání obsahu z různých zdrojů
disableremoteplayback	<audio>, <video>	NE	bez hodnoty, zakázání přehrávání na vzdálených zařízeních pomocí ovládacích prvků
loop	<audio>, <video>	NE	bez hodnoty, přehrávaný obsah se automaticky opakuje
muted	<audio>, <video>	NE	bez hodnoty, zvuk je ve výchozím stavu ztlumený
preload	<audio>, <video>	NE	určení zda by se měl multimediální obsah načíst ihned po načtení stránky nebo za vyžádání
src	<audio>, <video>, <img>, <iframe>, <script>, <embed>, <source>, <frame>(deprecated), <input>	DISKUZE	určení zdroje obsahu, který má být zobrazen nebo načten
dir	<bdo>, <html>, <input>, <textarea>, <iframe>, <div>, <span>, <p>	NE	k určení směru textu pro obsah daného elementu. Může být užitečný pro určení směru textu v různých jazycích, které používají odlišné směry psaní (zleva doprava nebo zprava doleva)
cite	<blockquote>, <q>, <del>, <ins>	NE	k poskytnutí odkazu na zdroj citace
alink (deprecated)	<body>	NE	Barva textu pro hypertextové odkazy, když je vybrána
background (deprecated)	<body>	NE	starších verzích HTML a byl spojen s nastavením pozadí pro různé prvky
bgcolor (deprecated)	<body>, <table>, <tr>, <td>, <col>, , <colgroup>	NE	dnes už není doporučen k používaní
bottommargin (deprecated)	<body>, <div>, <p>, <span>	NE
leftmargin (deprecated)	<body>, <div>, <p>, <span>	NE
topmargin(deprecated)	<body>, <div>, <p>, <span>	NE
rightmargin(deprecated)	<body>, <div>, <p>, <span>	NE
link(deprecated)	<body>	NE	barva nenavštívených odkazů
onafterprint	<body>, <iframe>, <div>, <span>	DISKUZE	součástí rozhraní pro tisk v prohlížečích a je spíše používán v JavaScriptu, definuje skript, který se má spustit, když uživatel dokončí tisk stránky nebo přepne zpět do normálního režimu prohlížeče po tisku
onbeforeprint	<body>, <iframe>, <div>, <span>	DISKUZE	událostí v JavaScriptu, která se spouští před tiskem stránky
onbeforeunload	<body>	DISKUZE	událostí v JavaScriptu, která se spouští předtím, než uživatel opustí stránku
onblur	<body>, <input>, <textarea>, <select>	NE/DISKUZE	událostí v JavaScriptu, která se spouští, když prvek ztratí fokus, například spustí se funkce
onerror	<body>, <img>,<script>, <link>, <audio>, <video>	DISKUZE	událostí v JavaScriptu, která se spouští, když nastane chyba při načítání externího prostředku, jako je obrázek, skript nebo jiný zdroj.
onfocus	<body>, <input>, <textarea>, <select>, <a>, <button>, <label>, <iframe>	DISKUZE	událostí v JavaScriptu, která se spouští, když se prvek dostane do fokus
onhashchange	<body>	ANO/DISKUZE	událostí v JavaScriptu, která se spouští, když se změní fragment identifikátoru URL (část URL za znakem #). Tato událost je užitečná pro sledování změn v URL a reagování na ně dynamicky.
onlanguagechange	<body>	NE
onload	<body>, <img>, <script>, <link>, <iframe>	DISKUZE	událostí v JavaScriptu, která se spouští, když se načte určitý HTML element nebo celá stránka.
onmessage	<body>, <iframe>, <window>, <worker>	DISKUZE	událostí v JavaScriptu, která se spouští, když se přijme zpráva pomocí rozhraní komunikace s mezerou (anglicky "message channel"), běžně komunikace mezi okny
onoffline	<body>	DISKUZE	událostí v JavaScriptu, která se spouští, když prohlížeč ztratí připojení k internetu
ononline	<body>	DISKUZE	událostí v JavaScriptu, která se spouští, když prohlížeč opět získá připojení k internetu poté, co byl předchozí stav offline
onpopstate	<body>	DISKUZE	událostí v JavaScriptu, která se spouští, když uživatel přejde na jiný stav historie prohlížeče pomocí tlačítka zpět/znovu nebo metody
onredo	<body>	NE	není běžně používaným atributem v HTML elementech. Tento atribut by byl použit pro zachycení události, kdy uživatel provádí akci zpět (undo) v prohlížeči
onresize	<body>	DISKUZE	událostí v JavaScriptu, která se spouští, když se velikost okna prohlížeče nebo velikost prvku na stránce změní
onstorage	<body>	DISKUZE	událostí v JavaScriptu, která se spouští, když dojde k změně v datovém úložišti (localStorage nebo sessionStorage) v rámci konkrétního dokumentu
onundo	<body>	NE	neexistuje v HTML nebo JavaScriptu jako standardní událost
onunload	<body>	DISKUZE	událostí v JavaScriptu, která se spouští, když uživatel opustí aktuální stránku
vlink (deprecated)	<body>	NE	historicky k určení barvy navštívených odkazů
text	<body>	NE	není standartním atributem HTML
clear	<br>, <hr>	NE	bez hodnoty, v minulosti v zastaralých prvcích, vynucení řádku, horizontální čáry
disabled	<button>, <input>, <select>, <textarea>, <optgroup>, <option>, <fieldset>, <link>	NE/DISKUZE	používaným atributem v HTML elementech a slouží k deaktivaci (zablokování) interakce s daným prvkem
form	<button>, <input>, <select>, <textarea>, <fieldset>	NE/DISKUZE	k označení, do kterého formuláře prvek patří
formaction	<button>, <input>	NE	obvykle používá s tlačítky typu submit nebo image v rámci formulářů a určuje URL adresu, na kterou se má formulář odeslat
formenctype	<button>, <input>	NE	k určení kódování dat odeslaných formulářem, když je odesílán pomocí metody POST
formmethod	<button>, <input>	NE	k určení metody HTTP, která se má použít při odesílání formuláře
formonvalidate	<button>, <input>	NE	k určení, zda se mají data formuláře odeslat, i když nejsou platná
formtarget	<button>, <input>	NE/DISKUZE	k určení cílového okna nebo rámce, do kterého se má odeslat formulář po jeho odeslání, ovlivní kam se formulář po odeslání otevře
popovertarget	<button>, <input>	NE	není HTML standart
popovertargetaction	<button>, <input>	NE	není HTML standart
value	<button>, <input>, <option>, <textarea>, <data>, <li>	ANO	k definici výchozí hodnoty nebo hodnoty prvku
height	<canvas>, <img>, <iframe>, <embed>, <input>	NE	k určení výšky elementu
width	<canvas>, <img>, <iframe>, <embed>, <col>, <colgroup>, <hr>, <input>	NE	k určení šířky elementu
span	<col>, <colgroup>	NE	počet po sobě jdoucích sloupců, které prvek <col> zahrnuje
moz-opaque (deprecated)	<canvas>	NE	specifický pro Mozilla Firefox
align (deprecated)	<caption>, <col>, <colgroup> <img>, <table>, <div>, <iframe>, <hr>, <legend>	NE
char (deprecated)	<col>, <colgroup>	NE
charoff (deprecated)	<col>, <colgroup>, <table>, <tr>, <td>	NE	kdysi používal v kontextu HTML tabulek pro určení odsazení znaků
valign (deprecated)	<col>, <colgroup>, <td>, <img>	NE	používán k určení svislého zarovnání obsahu uvnitř buňky tabulky
datetime	<del>, <time>, <ins>, <meter>	DISKUZE	pro stanovení data a času a je běžně spojen s elementy, které obsahují taková data
open	<details>, <dialogue>	NE	bez hodnoty
compact (deprecated)	<dir> (deprecated), <menu>	NE	bez hodnoty
color (deprecated)	<font> (deprecated>, <hr>	NE
face (deprecated)	<font> (deprecated>	NE	seznam jmen fontů
size (deprecated)	<font> (deprecated>, <hr>, <input>	NE	velikost fontu
accept-charset	<form>	DISKUZE	určuje sadu znaků, která má být použita kódováním dat, která jsou odesílána pomocí formuláře
action	<form>	NE	Určuje cílovou adresu, kam budou data z formuláře odeslána po jeho odeslání
autocomplete	<form>, <input>, <select>, <textarea>, <form>	DISKUZE	Tento atribut určuje, zda má být pro konkrétní pole formuláře povoleno automatické doplňování (automatické vyplňování) datových hodnot pro toto pole
enctype	<form>	NE	určuje, jaká metoda kódování (encoding type) se použije při odesílání dat formuláře na server
method	<form>	NE	určuje HTTP metodu, která se použije při odesílání dat formuláře
novalidate	<form>	NE	Tento atribut indikuje, že data odeslaná formulářem nebudou validována prohlížečem před odesláním
cols	<frameset> (deprecated)	NE
rows	<frameset> (deprecated)	NE
noresize (deprecated)	<frame>(deprecated)	NE
scrolling (deprecated)	<frame>(deprecated), <iframe>	NE	definuje existenci strol baru
marginheight (deprecated)	<frame>(deprecated)	NE
margwidth (deprecated)	<frame>(deprecated)	NE
frameborder (deprecated)	<frame>(deprecated), <iframe>	NE	umožňuje specifikovat hranice frame
profile (deprecated)	<head>	NE	Identifikátory URI jednoho nebo více profilů metadat oddělené mezerou
noshade (deprecated)	<hr>	NE	Nastaví pravidlo bez stínování
manifest (deprecated)	<html>	NE
version (deprecated)	<html>	NE
xmlns	<html>	NE	atribut, který se používá v XML a XML-like jazykových dokumentech (včetně XHTML), aby označil jmenný prostor (namespace) pro elementy a atributy v daném dokumentu
allow	<iframe>, <object>, <embed>	DISKUZE	specifikaci oprávnění nebo schválení určitých funkcí nebo akcí v rámci těchto prvků. Například, pokud používáte iframe pro zobrazení obsahu z jiného zdroje, atribut allow může určovat, které funkce jsou povoleny v rámci tohoto iframe
allowfullscreen	<iframe>	NE	bez hodnoty, indikuje, zda má být povoleno zobrazení obsahu v režimu celé obrazovky
allowpaymentrequest (deprecated)	<iframe>	NE	bez hodnoty, povoluje API Payment Request
credentialless	<iframe>	NE	Nastavením na true se <iframe> stane bez pověření, což znamená, že jeho obsah bude načten v novém, pomíjivém kontextu.
csp	<iframe>	NE	(Context Security Policy) Zásady zabezpečení obsahu vynucené pro vložený prostředek
loading	<iframe>, <img>, <script>, <link>	DISKUZE	poskytuje informace o tom, jak by měl být zdroj načítán
sandbox	<iframe>	NE	vytvoření izolovaného prostředí pro zobrazení vnějšího obsahu (například jiné webové stránky) v rámci hlavní stránky
srcdoc	<iframe>	DISKUZE	definici HTML obsahu, který má být zobrazen v rámci tohoto iframe. Tento atribut poskytuje možnost vložit obsah přímo do atributu srcdoc, aniž by bylo nutné odkazovat na externí zdroj pomocí atributu src.
decoding	<img>	NE	slouží k určení způsobu, jakým má být dekódován obrázkový soubor během zpracování.
elementtiming	<img>	NE	označí obrázek pro pozorování pomocí PerformanceElementTiming
fetchpriority	<img>, <link>	NE	Poskytuje nápovědu o relativní prioritě, která se má použít při načítání obrázku
ismap	<img>	DISKUZE	označuje, že obrazový obrázek má být použit jako mapa obrazu (image map)
sizes	<img>, <link>	NE	definování různých velikostí obrázků pro responsivní design pomocí techniky "srcset" a "sizes". Tento atribut umožňuje prohlížeči určit, jaký bude šířka daného obrázku vzhledem k aktuálnímu oknu prohlížeče nebo zařízení
srcset	<img>	NE	poskytnutí různých verzí obrázku v závislosti na velikosti zobrazení zařízení
usemap	<img>	ANO	k odkazování na mapovou oblast v HTML obrázku
border (deprecated)	<img>	NE
longdesc (deprecated)	<img>, <iframe>	NE	k poskytnutí odkazu na rozšířený popis obsahu určitého prvku, například obrázku nebo rámování, pro uživatele, kteří potřebují další informace
hspace (deprecated)	<img>	NE
vspace (deprecated)	<img>	NE
accept	<input>, <form>	DISKUZE	ne všude stejné využití, může například omezení typů souborů
capture	<input>	NE	v rámci elementu <input> s typem "file" (tedy <input type="file">) a slouží k určení, zda by měl být obsah souboru zachycen pomocí kamery nebo jiného zařízení na zařízení uživatele, jako jsou mobilní telefony nebo počítače s webovými kamerami
checked	<input>	ANO/DISKUZE	úkol zobrazovat stav zaškrtnutí (checked)
dirname	<input>	NE	směr textu v rámci daného vstupního pole nebo textové oblasti
list	<input>	ANO	slouží k propojení tohoto textového vstupu s elementem <datalist>, který poskytuje seznam možných hodnot pro uživatele
max	<input>	ANO
min	<input>	ANO
maxlength	<input>	ANO
minlength	<input>	ANO
multiple	<input>	ANO/DISKUZE	bez hodnoty
pattern	<input>, <textarea>	ANO	definování regulárního výrazu, který musí být splněn pro platnou hodnotu vstupního pole nebo textové oblasti
placeholder	<input>, <textarea>	NE
readonly	<input>, <textarea>	NE
required	<input>, <textarea>	NE
step	<input>	ANO/DISKUZE
for	<label>	ANO	u značky <label> k indikaci, které vstupní pole (<input>, <select> nebo <textarea>) je s touto značkou spojeno
as	<link>	NE	používán spolu s atributem rel, kde rel specifikuje vztah mezi zdrojem a dokumentem, a as definuje typ obsahu tohoto zdroje
blocking	<link>	NE
imagesizes	<link>	NE
imagesrcset	<link	NE	pro rel="preload" and as="image"
integrity	<link>, <script>	ANO	k poskytnutí kontrolního součtu (hash) obsahu externího souboru (např. skriptu JavaScript nebo CSS souboru)
media	<link>, <style>, <source>	ANO/DISKUZE	pro specifikaci mediálního dotazu, který určuje, pro jaké médium jsou určeny styly

Podrobnější popis sdílených atributů¶

• target - kde se užité URL zobrazí - možnosti:
  _blank (otevře propojený dokument na nové kartě nebo okně), _self (otevře propojený dokument ve stejném rámci nebo kartě), _parent (otevře propojený dokument v nadřazeném rámci) nebo _top (otevře propojený dokument v plném rozsahu tělo okna)
• download: Tento atribut, pokud je přítomen, naznačuje, že cíl by měl být spíše stažen, než na něj po kliknutí navigovat. Může mít hodnotu, která určuje výchozí název souboru, který by měl mít stažený soubor.
  Příklad: <a href="example.zip" download>Download Example</a> <a download="filename"> - specifikuje stahovaný soubor
• controlslist hodnoty:
1. nodownload: Zakazuje uživatelům možnost stahování média pomocí přehrávače.
2. nofullscreen: Zakazuje uživatelům možnost přepnutí přehrávače do režimu celé obrazovky.
3. noremoteplayback: Zakazuje uživatelům možnost přehrávání média na jiných zařízeních pomocí ovládacích prvků.
4. noremoteplayback: Zakazuje uživatelům možnost ovládání přehrávání na jiných zařízeních pomocí ovládacích prvků.
5. noplaybackrate: Zakazuje uživatelům možnost nastavení rychlosti přehrávání média.
6. noduration: Zakazuje uživatelům možnost zobrazení celkové délky média.
7. nocontextmenu: Zakazuje zobrazení kontextového menu při kliknutí pravým tlačítkem myši na přehrávači.

• loading
1. lazy: Zdroj bude načítán až tehdy, když bude ve viewportu (viditelné oblasti) stránky.
2. eager: Zdroj bude ihned načten, jakmile bude stránka načtena.
3. auto: Prohlížeč automaticky určí, zda zdroj bude načten okamžitě nebo zpožděně.