Základy html pro úplné začátečníky
Terminologie (nelekejte se a čtěte dál ) URL - Unique Resource Locator – internetová adresa html - Hyper Text Markup Language - značkový jazyk, kterým se zapisují webové stránky html soubor – soubor psaný jazykem html, má příponu html nebo htm (je to obyčejný textový soubor) html kód (zdrojový kód) – zápis html jazyka (kombinace textu a „značek“) tag – „značka“ html jazyka, odděluje text; zapisuje se do <> (např.: <p>,</p>,<h1>); existují párové a nepárové tagy atribut tagu – nastavuje příslušné parametry tagu html editor – program, ve kterém vytváříme webové stránky wysiwyg - What you see is what you get (např. FrontPage) – ty používat nebudeme strukturní editory – např. htmlEditor, PSPad, PHPeditor, …
Tag tagy nejsou v prohlížeči (MS Internet Explorer, Firefox, Mozilla, Opera, …) vidět tagy říkájí prohlížeči (překladači html jazyka), co a jak se má na stránce zobrazit tag se zapisuje do <> párový tag začíná <> a končí </> (například: <u>text</u> → výsledek bude: text) nepárový tag např. <br /> (zalomení řádku) tagy se mohou psát velkými <P> nebo i malými <p> písmeny; raději budeme volit písmena malá (proč? … no, možná později ;-)
Základní tagy – nadpis Nadpis se uvozuje párovým tagem <h1>sem se napíše nadpis</h1> html má 6 typů nadpisů od největšího po nejměnší ↓ <h1>Nadpis1</h1> <h2>Nadpis2</h2> … <h6>Nadpis6</h6>
Základní tagy – odstavec Odstavec (paragraf) většina delších textů se uvozuje párovým tagem <p>mezi se píše text, který bude vidět</p> při psaní odstavců se řádky zalamují podle potřeby a šířky stránky; enter a tabulátor je chápán jako mezera více mezer nebo prázdných řádků za sebou je chápán jako jedna mezera odstavec (i nadpis) lze dále formátovat pomocí atributů – příště …
HTML Editor http://editor.2b.cz/ - na této adrese si můžete stáhnout freeware HTML editor, který se nemusí instalovat, stačí „rozpakovat“ (je nutné mít nějaký software, který umí rozbalit zip soubory např. Winzip, Winrar, Ultimatezip, ale umí to i Total Commander) do nějakého adresáře a spustit soubor editor.exe k tvorbě webových stránek však bohatě stačí Poznámkový blok, který je součástí Windows (start → všechny programy → příslušenství → poznámkový blok); při ukládání souborů je nutné zvolit příponu html, nebo htm nebo jiný editor např.: phpEditorIDE (který používám)
První stránka 1 spustit HTML Editor uložit (zatím prázdný) soubor na námi požadované místo soubor → uložit jako název souboru: index typ souboru necháme uložit nahoře v hlavní nabídce HTML → nová HTML struktura → normální dokumet a na monitoru by mělo být to, co je na další stránce spustit poznámkový blok (pokud nemáte HTML Editor, nebo jiný editor) uložit (zatím prázdný) soubor na námi požadované místo soubor → uložit jako název souboru: index.html typ souboru změníme na „všechny soubory“ uložit do souboru opište html strukturu, která je na další stránce
Struktura souboru html Vysvětlivky celý soubor je ohraničen párovým tagem nahoře – začátek <html> dole – konec </html> (koncové tagy mají / ) mezi párovým tagem <head> </head> je hlavička html stránky, která se nezobrazuje; píší se tam informace o stránce (a další důležité věci); nám zatím bude stačit tag <title></title>, kde se píše název stránky mezi tag <body></body> se píše vlastní tělo (obsah) stránky <html> <head> <title>název stránky</title> </head> <body> vlastní obsah stránky </body> </html>
První stránka 2 mezi tag <body> </body> do připraveného souboru pvložíme již známé tagy pro nadpis a odstavec – například takto <body> <h1>Moje první stránka</h1> <p> Tak už umíme, napsat první řádky html. Zatím nic moc, ale žádný učený z nebe nespadl. Časem se toho naučíme mnohem více. Příště si ukážeme, jak tuto stránku umístíme na internet. Seznámíme se s dalšími tagy a dozvíme se něco o atributech tagu. </p> jak vypadá tato stránka na internetu se můžete podívat na www.kurz06.wz.cz (reklamy nahoře si nevšímejte)