HTML – prvek hlavy
Element HTML <head>je kontejner pro následující prvky:
<title>, <style>,
<meta>, <link>, <script>a <base>.
Element <head> HTML
Prvek <head>je kontejner pro metadata (data o datech) a je umístěn mezi <html>tag a <body>tag.
Metadata HTML jsou data o dokumentu HTML. Metadata se nezobrazují.
Metadata obvykle definují název dokumentu, znakovou sadu, styly, skripty a další meta informace.
Element HTML <title>
Prvek <title>definuje název dokumentu. Název musí být pouze textový a zobrazuje se v záhlaví prohlížeče nebo na kartě stránky.
Prvek <title>je vyžadován v dokumentech HTML!
Obsah názvu stránky je velmi důležitý pro optimalizaci pro vyhledávače (SEO)! Název stránky používají algoritmy vyhledávačů k rozhodování o pořadí při uvádění stránek ve výsledcích vyhledávání.
<title>prvek :
- definuje titulek na liště prohlížeče
- poskytuje název stránky, když je přidána do oblíbených
- zobrazí název stránky ve výsledcích vyhledávače
Snažte se tedy, aby byl nadpis co nejpřesnější a nejsmysluplnější!
Jednoduchý HTML dokument:
Příklad
<!DOCTYPE html>
<html>
<head>
<title>A Meaningful Page
Title</title>
</head>
<body>
The content of the document......
</body>
</html>
Element <style> HTML
Prvek <style>se používá k definování informací o stylu pro jednu stránku HTML:
Příklad
<style>
body {background-color: powderblue;}
h1 {color: red;}
p {color: blue;}
</style>
Element HTML <link>
Prvek <link>definuje vztah mezi aktuálním dokumentem a externím zdrojem.
Značka <link>
se nejčastěji používá k propojení s externími šablonami stylů:
Příklad
<link rel="stylesheet" href="mystyle.css">
Tip: Chcete-li se dozvědět vše o CSS, navštivte náš výukový program CSS .
Element <meta> HTML
Prvek <meta>se obvykle používá k určení znakové sady, popisu stránky, klíčových slov, autora dokumentu a nastavení výřezu.
Metadata se na stránce nezobrazí, ale používají je prohlížeče (jak zobrazit obsah nebo znovu načíst stránku), vyhledávače (klíčová slova) a další webové služby.
Příklady
Definujte použitou znakovou sadu:
<meta charset="UTF-8">
Definujte klíčová slova pro vyhledávače:
<meta name="keywords" content="HTML, CSS, JavaScript">
Definujte popis své webové stránky:
<meta name="description" content="Free Web tutorials">
Definujte autora stránky:
<meta name="author" content="John Doe">
Obnovit dokument každých 30 sekund:
<meta http-equiv="refresh" content="30">
Nastavení zobrazované oblasti, aby váš web vypadal dobře na všech zařízeních:
<meta name="viewport" content="width=device-width, initial-scale=1.0">
Příklad <meta>značek:
Příklad
<meta charset="UTF-8">
<meta name="description" content="Free Web tutorials">
<meta name="keywords" content="HTML, CSS, JavaScript">
<meta name="author" content="John
Doe">
Nastavení Výřezu
Viewport je uživatelova viditelná oblast webové stránky. Liší se podle zařízení – na mobilu bude menší než na obrazovce počítače.
Na všechny své webové stránky byste měli zahrnout následující <meta>prvek:
<meta name="viewport" content="width=device-width, initial-scale=1.0">
To dává prohlížeči pokyny, jak ovládat rozměry a měřítko stránky.
Část width=device-widthnastavuje šířku stránky tak, aby odpovídala šířce obrazovky zařízení (která se bude lišit v závislosti na zařízení).
Část initial-scale=1.0nastavuje počáteční úroveň přiblížení při prvním načtení stránky prohlížečem.
Zde je příklad webové stránky bez metaznačky viewport a stejné webové stránky s metaznačkou viewport:
Tip: Pokud si tuto stránku prohlížíte pomocí telefonu nebo tabletu, můžete kliknutím na dva odkazy níže vidět rozdíl.
Element HTML <script>
Prvek <script>se používá k definování JavaScriptů na straně klienta.
Následující JavaScript píše "Ahoj JavaScript!" do prvku HTML s id="demo":
Příklad
<script>
function myFunction() {
document.getElementById("demo").innerHTML = "Hello JavaScript!";
}
</script>
Tip: Chcete-li se dozvědět vše o JavaScriptu, navštivte náš výukový program JavaScript .
Element HTML <base>
Prvek <base>určuje základní adresu URL a/nebo cíl pro všechny relativní adresy URL na stránce.
Značka <base>musí obsahovat atribut href nebo cílový atribut, případně obojí.
V dokumentu může být pouze jeden jediný <base>
prvek!
Příklad
Zadejte výchozí adresu URL a výchozí cíl pro všechny odkazy na stránce:
<head>
<base href="https://www.w3schools.com/" target="_blank">
</head>
<body>
<img src="images/stickman.gif" width="24" height="39"
alt="Stickman">
<a href="tags/tag_base.asp">HTML base Tag</a>
</body>
Shrnutí kapitoly
- Prvek
<head>je kontejner pro metadata (data o datech) - Prvek
<head>je umístěn mezi<html>tag a<body>tag - Prvek
<title>je povinný a definuje název dokumentu - Prvek
<style>se používá k definování informací o stylu pro jeden dokument - Značka
<link>se nejčastěji používá k propojení s externími šablonami stylů - Prvek
<meta>se obvykle používá k určení znakové sady, popisu stránky, klíčových slov, autora dokumentu a nastavení výřezu - Prvek
<script>se používá k definování JavaScriptů na straně klienta - Prvek
<base>určuje základní adresu URL a/nebo cíl pro všechny relativní adresy URL na stránce
Prvky hlavičky HTML
| Tag | Description |
|---|---|
| <head> | Defines information about the document |
| <title> | Defines the title of a document |
| <base> | Defines a default address or a default target for all links on a page |
| <link> | Defines the relationship between a document and an external resource |
| <meta> | Defines metadata about an HTML document |
| <script> | Defines a client-side script |
| <style> | Defines style information for a document |
Úplný seznam všech dostupných značek HTML naleznete v naší Referenční příručce značek HTML .