HTML & CSS pro začátečníky

HTML & CSS pro začátečníky (Část 01): První pohled na HTML, CSS a spol.

Všechna videa tutoriálu HTML a CSS pro začátečníky

HTML je značkovací jazyk, pomocí kterého lze strukturovat obsah. Za formátování obsahu jsou zodpovědné styly. Více o nich později.

Zodpovědný za další vývoj HTML je World Wide Web Consortium (krátce W3C).

Na webovou stránku W3C byste měli pravidelně nahlížet, abyste byli v obraze o aktuálním vývoji v oblasti webu.

Když se zabýváte HTML, důležitá otázka zní: Kterou verzi bych měl použít? Samozřejmě si dokážete představit, že jazyk jako HTML je neustále aktualizován. Nové prvky přicházejí, staré jsou odstraněny.

Zde jsou nejdůležitější verzování jazyka HTML:

• HTML (listopad 1992): To byla první verze. Zaměřovala se výhradně na textové dokumenty.

• HTML 2.0 (listopad 1995): Nyní jsou zde také prvky pro obrázky a formuláře.

• HTML 4.0 (prosinec 1997): Přináší se styly, rámce a skripty.

• XHTML 1.0 (leden 2000): Jedná se o novou formulaci HTML 4.0 pomocí XML.

• HTML5 (duben 2009): Jedná se stále o pracovní návrh, tedy ještě ne odsouhlasený standard.

V čele následujících tutoriálů bude HTML5. S HTML5 by mělo konečně dojít k oživení ve světě HTML. A nová specifikace skutečně nabízí celou řadu zajímavých novinek. K nim patří například mnohem pohodlnější formuláře, ukazatele průběhu, kreslicí prvky a zlepšená struktura dokumentů. Kromě toho umožňuje nový standard vložení videí do webových stránek bez potřeby plug-inů a existuje rozhraní pro přetahování.

První návrh na HTML5 byl publikován již v roce 2004 pracovní skupinou Web Hypertext Application Technology Working Group (WHATWG) pod názvem Web Applications 1.0. Do dnešního dne sice nebyl HTML5 oficiálně vydán jako standard, nicméně prohlížeče již nyní zahrnují mnoho funkcí HTML5. To není překvapivé, protože WHATWG je aliancí výrobců prohlížečů Apple, Mozilla a Opera. Vznik WHATWG byl reakcí na nedostatečný vývoj webových standardů ze strany World Wide Web Consortium (W3C).

Můžeme se tedy ptát, co přimělo výrobce prohlížečů k vytvoření vlastního standardu HTML. Vždyť vývoj HTML byl až dosud pevně v rukou W3C. Podle výrobců prohlížečů problémy začaly, když W3C převedlo HTML 4.01 na XHTML 1 bez zvláštních obsahových úprav. Původně chtělo W3C prostřednictvím XHTML 1 zavést první krok směrem k XML založenému webu. Na konci vývoje mělo následovat XHTML 2. Právě tato koncentrace W3C na XML byla tím, co vadilo výrobcům prohlížečů. Z jejich pohledu je XML přístup praxi vzdálený a neodráží skutečné přání uživatelů. (To ale W3C vidí jinak.)

Od roku 2007 W3C a WHATWG společně vyvíjejí specifikaci HTML5. Aktuální informace o HTML5 naleznete na http://www.w3.org/TR/html5/.

V následujících tutoriálech se zaměříme právě na HTML5.

CSS pro formátování

Jistě jste již pracovali s dokumentovými šablonami ve Wordu či jiných textových editorech. Pokud tedy například označíte řádek, můžete vybrat formátovací styl.

HTML & CSS pro začátečníky (část 01): První pohled na HTML, CSS & Co.



V závislosti na tom, jaká formátovací volba byla v dokumentové šabloně zvolena pro tento styl, se zobrazí nadpis. Při změně dokumentové šablony se mění i vzhled nadpisu.

Co má společného Word s HTML? I pro HTML dokumenty existují styly. Tyto šablony je možné definovat pomocí CSS (kaskádové styly). Díky CSS tedy můžete například stanovit, že hlavní nadpisy (h1) budou zobrazeny ve velikosti 22 pixelů ve zeleném písmu Arial.

Co budete potřebovat

V následujících tutoriálech se postupně seznámíte s HTML a CSS. Abyste mohli sami vytvářet webové stránky na základě HTML a CSS, nepotřebujete žádný složitý software. V nejjednodušším případě můžete - pokud pracujete pod Windows - použít standardní editor.

I když není zvlášť pohodlný, pro začátek to ale postačí. Pokud dáváte přednost většímu pohodlí, měli byste se raději podívat po "skutečném" HTML editoru. Jedním z klasiků je samozřejmě Dreamweaver.

Tento editor však není zdarma.

HTML a CSS pro začátečníky (část 01): První pohled na HTML, CSS a spol.

Pro soukromé uživatele je naopak zdarma phase5 (http://www.phase5.info/). Pokud tedy chcete editor používat pro soukromé účely, máte tu dobrý a zdarma dostupný nástroj.

HTML & CSS pro začátečníky (část 01): První pohled na HTML, CSS a ostatní.



Kromě editoru byste měli mít nainstalovány nejdůležitější prohlížeče k testování webových stránek. Prohlížeče totiž občas interpretují HTML a CSS poměrně nezávisle. S ohledem na to je důkladné testování stránek v různých prohlížečích povinností. Měli byste mít minimálně nainstalovány Internet Explorer, Google Chrome a Mozilla Firefox. Ideálně byste měli stránku také testovat v prohlížeči Opera a na tabletu/smartphonu.