Nela Hrabcová

Základy HTML

Doprovodný text k 1. dílu
videoseriálu Dokážeš cokoli.

Začít je snadné

Je červen 2017 a začít je opravdu snadné. Je mi 7 let, tak už píšu na počítači, a taťka říká, že už můžu začít dělat vlastní webstránky. A co je ještě lepší, že o tom budeme točit videa. Nejdřív se vždycky něco pořádně naučím a pak vám o tom natočím video a něco sem o tom i napíšu. Časem dokážu na internetu programovat i vlastní hry. A vy také. Pokud to se mnou vydržíte.

Co je potřeba

Abyste mohli programovat, potřebujete počítač a v něm textový editor. Stačí vám jakýkoli počítač s Windows a jakýkoli textový editor, třeba obyčejný Notepad, co je v každém Windows. Je ale mnohem lepší používat nějaký programátorský editor.

Visual Studio Code

Editor Visual Studio Code od firmy Microsoft vyhovuje dokonale našim potřebám. Je úplně zdarma a zná syntaxi (správný zápis) mnoha programovacích jazyků. My budeme nejprve psát pouze kód HTML, pak budeme stylovat (kód CSS)) a postupně se pustíme i do opravdového programování (JavaScript). A všechno tohle (a mnohem víc) zvládá Visual Studio Code skvěle.

Pozor! Nepleťte si Visual Studio Code a zcela jiný editor Visual Studio, což je plnohodnotný editor pro programátory. Taťka ho používá na kdeco. Visual Studio my ale zatím vůbec k ničemu nepotřebujeme, má mnoho složitých a pro nás zatím zbytečných funkcí, které by nás jen pletly. Taťka říká, že ho budu používat později. Mnohem později.

Psaní je základ

Abyste mohli psát kód, musíte se naučit psát na počítači. Já píšu denně. Spíš dost pomalu datluju, ale každým dnem jsem rychlejší. Je to jako když hrajete na klavír. To taky cvičím každý den, na což dohlíží mamka a je dost drsná.

Jak psát speciální znaky

Některé znaky se na klávesnici špatně hledají, na různých klávesnicích jsou na různých místech, a pak je tu to otravné věčné přepínání mezi českou a anglickou klávesnicí. Existuje řešení: Naučte se (a tohle mi fakt jde) číselné kódy pro určité "těžké" znaky. Stačí stisknout levý Alt (furt ho držte), na numerické klávesnici vyťukat číselný kód, a pustit levý alt. A znak se sám napíše. Kouzlo. Vyzkoušejte to:

Znak     Kód
-------------
!   Alt + 33
"   Alt + 34
#   Alt + 35
$   Alt + 36
%   Alt + 37
&   Alt + 38
'   Alt + 39
(   Alt + 40
)   Alt + 41
:   Alt + 58
;   Alt + 59
<   Alt + 60
=   Alt + 61
>   Alt + 62
?   Alt + 63
@   Alt + 64
<   Alt + 60
[   Alt + 91
\   Alt + 92
]   Alt + 93
^   Alt + 94
_   Alt + 95
{   Alt + 123
|   Alt + 124
}   Alt + 125

Základní kostra HTML dokumentu

Teď už pro nás nebude problém napsat první HTML kód, pro začátek kód úplně prázdné stránky. Následující kód je dobré mít někde uložen, abyste ho nemuseli psát při zakládání každého nového HTML dokumentu.

<!DOCTYPE html>
<html>
 <head>
  <title></title>
 </head>
 <body>
 </body>
</html>

Jaký prohlížeč

Stránky se dělají pro lidi. V současnosti (tohle píšu v roce 2017) většina lidí používá prohlížeč Google Chrome. Je to dobrý prohížeč. U nás doma ho používáme všichni. Jako tvůrci stránek bychom si ale měli nainstalovat všechny významnější prohlížeče, abychom se mohli kdykoli snadno podívat, jak v nich naše stránky vypadají. Takže je třeba nainstalovat si alespoň Firefox a Internet Explorer. A možná i prohlížeče Safari a Opera, které já už neřeším. Jsem pracovitá, ale odsaď pocaď.

Zbytek je ve videu

Podívejte se na mé video (níže) a pamatujte, že si to všechno (a mnohem víc) musíte prožít a osahat sami. Naštěstí v tom nikdy nejsme sami. Internet je plný návodů, a to i v češtině. Ty moje jsou jen kapka v moři informací. Tak příjemnou plavbu a rozšiřujte si obzory.