eduropa.sk

Úvod do HTML Prihláste sa cez Facebook

HTML je zkratka z anglického HyperText Markup Language, čo znamená: Hypertextový značkový jazyk. A teda HTML je značkovaci jazyk, ktorý sa používa na vytváranie internetových stránok. Využíva pri tom značky tzv. tagy, vďaka ktorým je text štrukturovaný.

Z históríe

Prvú definíciu HTML vytvoril Tim Berners-Lee v roku 1991. Ta umožňovala základnú prácu s textom, vkladanie obrázkov a podporovala hypertextové odkazy. Neoficiálne bola označená za  HTML 0.9. Prvá formálna špecifikácia bola  schválená ako štandard 22.09.1995 a bola označená číslom 2.0, aby sa zdôraznil rozdiel oproti predchádzajúcim neoficiálnym verziám. Samotné RFC nájdete tu. Ako časom rástli nároky na html, vznikali nové značky a verzie HTML.

Do príchodu HTML5, W3C plánovalo nahradiť HTML jazykom XHTML a to implementáciou jazyka XML, ktorá mala zjednodušiť prácu prehliadačom, ale aj tvorcom web stránok. Nástupcom sa nakoniec stalo HTML5, ktoré vzniklo z dôvodu obmedzenosti XHTML. Navyše  HTML5  nezahŕňa iba elementy pre definovanie štruktúry obsahu webu, ale zaoberá sa aj JavaScriptovými API, offline fungovaním aplikácií, podporou multimédií a pod.

ČO je W3C (World Wide Web Consortium)

World Wide Web Consortium je konzorcium, ktoré produkuje slobodné štandardy resp. odporúčania. Inými slovami oni určujú čo je správne a teda validne. Ak ste programátor a chcete si skontrolovať Váš HTML kód môžete na použiť validátor, ktorý nájdete na stránkach w3c.org. Riaditeľom konzorcia je nám už známy Tim Berners-Lee.  

Štruktúra, značky, elementy a atribúty

Ak chceme vytvoriť internetovú stránku, ktorú dokáže zobraziť internetový prehliadč musíte dodržiavať pár základných pravidiel, ktoré si ukážeme na príklade.

Príklad č.1:

<!DOCTYPE html>
   <html lang="sk">
 
   <head>
     <meta charset="UTF-8">
     <title>Názov stránky</title>
   </head>
 
   <body>
      Ahoj svet...
   </body>
 
</html>

 

Poďme si teda vysvetliť príklad:

Aby naša stránka fungovala správne, musíme prehliadaču povedať o aký jazyk sa jedná. Spravíme tak hneď na začiatku zadefinovaním <!DOCTYPE html>. Týmto dávame prehliadaču jednoznačne vedieť, že sa jedná o html. 

Ďalším dôležitým tagom pre nás je: <html>. Jedná sa o párový tag, čo znamená, že tag musí byť ukončený spätným lomítkom. Čiže v praxi to vyzerá takto: <html></html>. Týmto tagom dávame prehliadaču vedieť, že všetko medzi má považovať za html kód. V našom prípade má tag  <html> atribút lang, ktorý sa rovná hodnote sk. Týmto dávame prehliadaču vedieť aký ľudský jazyk bude stránka používať. 

Ďalšími dôležitými párovými značkami sú <head> a <body> a sú umiestnené medzi <html></html>, tak ako všetko ostatné.

Head obsahuje dve elementy a deklaráciu kódovania. Kódovanie nám určuje aké znaky budú použité. Pre stránky v slovenčine používajúce slovenskú diakritiku volíme kódovanie UTF-8. Druhým dôležitým elementom je titulok, ktorý je zadefinovaný medzi párovými značkami <title>. Takto zadefinovaný text sa zobrazí ako názov otvorenej karty, alebo okna prehliadača. Titulok ma význam nie len pre používateľa aby vedel identifikovať v prehliadači, čo je na ktorej karte otvorené, ale aj pre vyhľadávače ako je Google a podobne. 

Body predstavuje telo stránky a patrí sem všetko čo má byť zobrazené používateľovi. 

 

Čo sme sa naučili?

V tejto lekcii sme si ukázali ako vyzerá štruktúra jednoduchej stránky. Kód si môžeme overiť cez validátor, ktorý nám na náš kód vraví, že je validny. Na vytvorenie kódu môžeme použiť hociktorý textový editor, ktorí dokáže uložiť text ako ako súbor .html (napr. PSpad, Notepad++). 

Pridaj komentár

Prihláste sa

Diskusia

Marcel
2018-02-18 18:59:37
hgfsdas