pzeleny@kurzygrafiky.cz        Tel.: 724 810 701

Košík je prázdný

Základní principy HTML

Pokud se chcete naučit základní strukturu HTML dokumentu podívejte se do následujícího návodu.

Pokud již máte připravený design a rozmyšlenou strukturu webu, můžete přejít ke kódování. Budete k tomu potřebovat alespoň základní znalosti HTML kódu a kaskádových stylů. Následující část textu vám objasní hlavní důležité techniky kódování a nejčastější HTML prvky.

HTML je jednoduchý značkovací jazyk, který slouží k tvorbě webových dokumentů. Jeho největší výhodou je univerzálnost. Nezáleží na tom, kdo si stránky prohlíží, může používat systém Windows, Linux nebo mobilní telefon, stačí, aby měl webový prohlížeč. Postupem času vznikaly různé verze HTML. Ta nejnovější je HTML 5, která vznikla relativně nedávno.


Pravidla HTML – tagy

Celý HTML kód je značkovací jazyk, kterému rozumíte vy i prohlížeč. Obsahuje strukturu, podle které počítač stránku sestaví. Kód se skládá z TAGŮ (značek), které se píší v ostrých závorkách „< >“. Možností jak závorky napsat je přepnout klávesovou zkratkou "Alt+Shift" na anglickou klávesnici a pak psát ostré závorky jako tečku či čárku, se stisknutou klávesou shift.

Seznam obvykle používaných HTML elementů z programu Microsoft Expression Web:

web

HTML je programovací jazyk a má svoje přesná pravidla, která musíte dodržovat. Budete-li psát kód textovou podobou, dávejte pozor na přesný zápis tagů, včetně všech uvozovek, závorek a dalších znaků.

Každý dokument HTML se skládá ze dvou částí: hlavičky a těla. Označují se tagy <head> a <body>. Oba jsou to párové tagy, musí mít vyznačený začátek a konec. Vždy se skládají ze dvou částí, např. <head> a </head>. Tag ukončíte přidáním lomítka před slovo označující značku.

Celou stránku ohraničujte tagem <html>, který počítači říká, že se jedná o dokument HTML.

 


 

Jednoduchý zdrojový kód prázdné webové stránky tedy vypadá takto:

<html>

<head>

<title>ndpis první stránky</title>

</head>

<body>

obsah stránky

</body>

</html>

 

Jednotlivé prvky se vnořují jeden do druhého. Vytváří tím hierarchii stránky. Tag TITLE zapisujeme uvnitř tagu HEAD a ten uvnitř HTML. Jednotlivé části stránky ohraničené určitou značkou se nazývají prvky či elementy webové stránky. Např. <title>Titulek!</title> je jeden z elementů stránky. Použitý tag pak určuje význam daného elementu.

V případě párových tagů je nikdy nezapomínejte uzavřít, vyhnete se problémům se zobrazením stránky. Na druhou stranu, prohlížeče jsou při čtení velmi tolerantní a mnoho věcí jsou schopné doplnit automaticky. Pokud tedy na konci zapomenete </html>, pravděpodobně se nic závažného nestane. To ale nic nemění na faktu, že je to špatně.

Časem se kód může stát poměrně rozsáhlým a nepřehledným. Proto je potřeba naučit se dodržovat určitá pravidla, abychom zachovali zpětnou čitelnost. Je poměrně častým zvykem odsazovat každou novou úroveň tagů pomocí klávesy TAB. Dále je možnost psát všechny tagy velkými písmeny, čímž také můžeme docílit lepší přehlednosti (neplatí pro XHTML, které vyžaduje vždy psaní malými písmeny). Orientaci v kódu vám také usnadní barevné zvýraznění, které umožňují pokročilejší editory.

Více informací se dozvíte na našich kurzech a školení zaměřených na Tvorbu webových stránek.

------ © 2015 KURZY GRAFIKY ------ Všechna práva vyhrazena. Kopírovat obsah bez souhlasu autora je zakázáno.

Icons made by Freepik from www.flaticon.com is licensed by
CC BY 3.0

Soubory cookie nám pomáhají poskytovat, chránit a zlepšovat naše služby. Pokud budete náš web používat i nadále, vyjádříte tím svůj souhlas s našimi zásadami týkajícími se souborů cookie.

 

OBCHODNÍ PODMÍNKY

KURZYGRAFIKY.CZ

Prokop Zelený, DiS.
Veronské nám. 331
Praha 10  10900

pzeleny@kurzygrafiky.cz
tel.: 724 810 701

Soubory cookie nám pomáhají poskytovat, chránit a zlepšovat naše služby. Pokud budete náš web používat i nadále, vyjádříte tím svůj souhlas s našimi zásadami týkajícími se souborů cookie. Informace o cookies ZDE.

  
EU Cookie Directive Module Information