HTML Tutoriál - časté otázky

Tutoriály z jazyka HTML (a úvody do CSS, XML) sú určené pre všetkých začínajúcich programátorov webových stránok. Odporúčané sú špeciálne pre žiakov základných a stredných škôl, ktorí sa zaujímajú o informatiku. Vedieť vytvoriť jednoduchú webovú stránku je podľa nás v dnešnej dobe základnou znalosťou informatiky. Využívať tieto tutoriály o tvorbe webov môžu tiež učitelia škôl pri vyučovaní.

Absolvovaním HTML tutoriálu sa z nikoho okamžite nestane programátor webových stránok, ale vďaka týmto základným znalostiam budete schopní vytvoriť jednoduché webové stránky a ďalej sa samostatne vzdelávať v oblasti tvorby webu, ak o to budete mať záujem.

V jazyku HTML nezáleží na veľkosti písmen - tagy je možné písať veľkými aj malými písmenami, a aj ľubovoľne ich kombinovať. Webová stránka sa bude zobrazovať a fungovať vždy. Pre krajšiu čitateľnosť sa však odporúča dodržiavať pravidlo, že v rámci jedného dokumentu (webu) sa píšu tagy jednotne (buď malým alebo veľkým písmom). Je to tak krajšie na pohľad a pôsobí to viac profesionálne.

V jazyku HTML je pri uvádzaní hodnôt atribútov jedno, či budete používať úvodzovky " alebo apostrofy '. Dôležité je, aby ste z oboch strán použili ten istý znak (ak začínate úvodzovkami, tak treba použiť znak úvodzoviek aj na ukončenie). Opäť je fajn zvyk, aby bolo v rámci dokumentu používanie úvodzoviek a apostrofov jednotné, avšak nie vždy je to jednoduché.

Každý jazyk sa vyvíja, a aj jazyk HTML prešiel istými zmenami medzi verziou 4 a 5. Jazyk HTML5 je novší a dve najväčšie zmeny spočívajú v tom, že pribudlo niekoľko sémantických tagov na štruktúru dokumentu (napr. article, section ... ), a rozšírili sa možnosti formulárových prvkov. Na druhej strane sa niektoré tagy dostali do skupiny neodporúčaných (napr. používanie skupiny rámcov frameset).
Súčasné internetové prehliadače väčšinou poskytujú podporu aj pre staršiu verziu HTML, takže pri tvorbe webových stránok nie je kriticky dôležité vedieť, ktorý tag bol dostupný v ktorej verzii.

V HTML5 prišli výrazné vylepšenia v niektorých pokročilých funkciách (kreslenie diagramov, používanie lokálnej pamäte či webových soketov, notifikácie alebo práca s polohou). Tieto funkcie však vyžadujú viac znalostí (napr. z tvorby skriptov v jazyku Javascript), preto ich začínajúci programátori zvyčajne nepoužívajú.

Tak, ako jazyk HTML, rovnako aj jazyk XHTML slúžia na tvorbu webov a vieme pomocou nich vytvoriť webovú stránku. Jazyk XHTML vznikol ako alternatíva k jazyku HTML, a to tak, že sa do HTML pridali črty z jazyka XML. XHTML je teda jazyk, ktorý v sebe zahŕňa aj niektoré zvyklosti z XML, čím sa z neho stáva mierne náročnejší (resp. striktnejší) jazyk.

V minulosti panoval na webe tak trochu boj o to, či sa má na tvorbu webu používať jazyk HTML alebo XHTML. Každý jazyk mal svojich podporovateľov aj odporcov. Nakoniec túto vojnu vyhral HTML, keď prišla verzia HTML5. Jazyk XHTML mal svoje výhody, ale keďže bol mierne komplikovanejší, viac fanúšikov si získal jazyk HTML. Dnes sa už XHTML používa len málo, no keďže jeho syntax je prísnejšia (striktnejšia), weby v ňom sa zobrazujú stále korektne. Takže pokojne môžeme tvoriť webu aj v HTML, aj v XHTML.

Najviac rozšírené technológie, ktoré sa využívajú pri tvorbe webov sú:

• Jazyk HTML na štruktúrovanie obsahu (rozdelenie stránky na sekcie a pod.)

• Jazyk CSS na štýlovanie dokumentov (grafická vizualizácia ako nastavenie farieb, okrajov a pod.). V CSS sa dajú vytvoriť aj animácie, ale vyžaduje to už lepšiu znalosť tohto jazyka.

• Jazyk Javascript (JS) na tvorbu skriptov: pre interaktívne časti webu (napr. animácie, výpočty a pod.)

• Základy SVG alebo Canvas pre kreslenie (napr. diagramy či jednoduché grafické nákresy, pokiaľ ich potrebujete).

• Jazyk PHP pre dynamické webové stránky. Ide o najrozšírenejší jazyk na tvorbu backendu (serverovskej časti) pri architektúre klient-server. Server je tá časť, ktorá realizuje operácie a výpočty. Klient je potom štandardná stránka v jazyku HTML. Alternatívne sa na tvorbu serverovskej časti samozrejme dajú použiť aj iné jazyky (napr. Python, C# alebo Java).

• Znalosť relačnej databázy (v prípade webov najčastejšie MySQL alebo MariaDB) pre ukladanie dát.

Začínajúcemu programátorovi webov stačí poznať jazyk HTML, základy CSS. V lepšom prípade aj základy JS, ak má záujem vytvoriť pokročilé animácie či interakciu.

Ďalej existujú rôzne frameworky na tvorbu webov, ktoré poskytujú dopredu pripravené riešenia na opakujúce sa problémy. Frameworky uľahčujú tvorbu webov, ale odporúča sa ich používať až potom, keď už človek aspoň trochu pozná jazyky na tvorbu webov. Dôvod je taký, že framework len uľahčuje prácu s jazykom, ale ak vývojár jazyk nepozná, koncepty a funkcie vo frameworku sú náročné na pochopenie a použitie.

Keďže webové stránky sa zvyčajne nerobia preto, aby sme ich uložili na našom počítači alebo posielali ako prílohu mailom, asi je potrebné aj vedieť, ako ich umiestniť na internet (na web). Až po uložení stránky na webový server budú stránky dostupné cez internet (aby si ich vedel každý pozrieť).

Vytvorenie obsahu webu je zvyčajne len začiatok. Ak chceme, aby si naše webové stránky vedel ktokoľvek s pripojením na internet pozrieť, musíme ich umiestniť (skopírovať) na nejaký počítač, ktorý je neustále pripojený do siete internet. Keď sa niekto rozhodne našu stránku navštíviť, zadá do prehliadača názov servera a bude mať obsah k dispozícii. Názvom servera môže byť IP adresa počítača alebo doména začínajúca sa písmenami http/https (napr. https://www.eduself.sk). Takýto počítač sa nazýva server (resp. webový server), čo v preklade znamená, že slúži na uloženie dát, ktoré sú potom dostupné na požiadanie. Slovo server sa prekladá ako "sieťový počítač" alebo "počítač, ktorý slúži iným zariadeniam".
Nastavenie a údržba webového servera je samostatnou kapitolou, ktorú už dnes zvyčajne nemá na starosti programátor. Teoreticky môže byť programátor súčasne aj správca webového servera, ale vyžaduje to iné znalosti, napr. z oblasti bezpečnosti (aby server spoľahlivo fungoval a bol odolný voči útokom). Z pohľadu tvorcu webov preto stačí vedieť, že webové stránky po ich vytvorení treba skopírovať na server a prihlasovacie údaje na server si vypýtať od správcu servera (administrátora).

Otázka by mohla znieť: Keď vytvorím webové stránky, nájde ich hneď každý? A možno ešte doplňujúca otázka: Prečo chcem, aby bol môj web navštevovaný a čo som pre to ochotný urobiť?

Ak chceme, aby návštevníci vedeli o existencii webovej stránky, zvyčajne musia poznať adresu (URL adresu alebo IP adresu). Našťastie, dnes už existujú rôzne spôsoby, ako sa vedia návštevníci o novej stránke dozvedieť. Kedysi sme sa museli spoliehať na to, že používateľ uhádne adresu alebo sa o existencii webu dozvie od niekoho iného. Dnes existujú zoznamy webov a webové vyhľadávače, ktoré sú schopné stránku prečítať (zistiť čo sa na nej nachádza), a keď potom niekto vloží tieto slová do vyhľadávača, tak sa mu medzi výsledkami zobrazí stránka (najviac populárny vyhľadávač na Slovensku je Google, no existuje ich oveľa viac).

Je to také jednoduché? Bohužiaľ nie. Aby vyhľadávač zobrazoval stránku vo svojom zozname, tiež o nej musí najskôr vedieť - musí mu to niekto povedať. A ani to nestačí. Lebo ak používateľ hľadá na webe nejaké slovo, vaša stránka asi nebude jediná, ktorá také slovo má. Okrem znalosti o existencii slova na vašej stránke teda musí vyhľadávač tiež považovať vašu stránku za lepšiu, ako všetky ostatné stránky s týmto slovom. V opačnom prípade bude vaša webová stránka niekde na poslednej strane výsledkov vyhľadávania, kam už nikto nechodí :/

Propagácia stránky pozostáva z viacerých činností a ide nad rámec tohto tutoriálu. Celkovo, marketing a propagácia webu je komplikovaná téma, ktorej sa zatiaľ nebudeme venovať (možno neskôr).

Vytváranie ďalších tutoriálov máme v pláne, rovnako aj vylepšovanie niektorých častí HTML tutoriálu. Kedy budú prístupné pre verejnosť zatiaľ netušíme :) Plánujeme viac tém spracovať.

Poznámka k autorstvu tutoriálov

Tieto tutoriály zamerané prevažne na tvorbu webu vznikli v rámci tímu programátorov a lektorov pôsobiacich na webe eduself.sk.
Tutoriály sú k dispozícii pre návštevníkov webu eduself.sk neobmedzene. Ich použitie či šírenie mimo tohto webu nie je bez písomného súhlasu hlavného autora povolené (rovnako ani šírenie žiadnej časti). Tutoriály sa neustále vyvíjajú (vylepšujú, opravujú sa chyby a pod.), skopírovaná verzia stratí rýchlo platnosť. Mnohé časti tutoriálov sú vytvorené lektormi, ktorí ich využívajú pri svojich vzdelávacích aktivitách, takže ide o súkromné dielo, na ktoré sa vzťahuje autorský zákon. V prípade citovania týchto tutoriálov je okrem odkazu vhodné uviesť aj dátum citovania.