Tvorba WWW stránek ÚVOD IKT 4.ročník
Obsah Webová (HTML)stránka Kód HTML Tvorba HTML kódu Webové prohlížeče Základní termíny v HTML Struktura webové stránky
Webová (HTML)stránka HTML stránka je textový soubor obohacený o tagy a atributy, které určují význam textu a vzhledu celé stránky Soubory mají příponu htm, html a slouží jako návod pro sestavení webové stránky Adresářová struktura: hlavní adresář – WEB - index.htm (default.html) - první.htm zdrojový kód - druha.htm podadresáře – IMAGE - FOTO binární data - DOCUMENT
Webová stránka vznikla roku 1989 ve výzkumném středisku CERN v Ženevě (tedy k výzkumným účelům) Autor Tim Berners Lee (přišel na to jak vzájemně provázat pomocí odkazů více dokumentů na různých počítačích a potom vytvořili první prohlížeč pomocí kterého se mohli dokumenty snadno prohlížet a přecházet od jednomu dokumentu k druhému) O standarty HTML stará konsorcium W3C doporučuje nové standarty HTML a tagy které by se měli a které neměli používat Jazyk HTML se neustále vyvíjí, standardní verze HTML: 3.2, 4, 4.1, a XHTML 1.0, XHTML 2
Kód HTML H – hyper T – text M – markup L – language HTML je značkovací (nikoliv programovací) jazyk Kód popisuje grafickou podobu stránky v prohlížeči Má textový formát, na binární data jen odkazuje Má přesnou syntaxi, kterou je důležité dodržovat a zároveň se přizpůsobuje
Tvorba HTML kódu ASCII textový editor - POZNÁMKOVÝ BLOK - WordPad - MS WORD Editor HTML kódu - editory WYSIWIG - MS FrontPage - Max html Beauty++ - 1st page 2000 - HTML builder XP - editory pracující s kódem - Allaire HomeSite
WYSIWYG What You See Is „Co vidíš, to dostaneš.“ Get
Webové prohlížeče Program zobrazující webové stránky Dekóduje HTML kód Převádí HTML kód do grafické podoby MS Internet Explorer Netscape Navigator Opera Mozilla
SHRNUTÍ 1 Co bude potřeba? jednoduchý textový editor ASCII poznámkový blok (notepad) editory s podporou HTML MS FrontPage strukturní editor Allaire HomeSite internetový prohlížeč Internet Explorer, Mozilla, Opera a Netscape
SHRNUTÍ 2 Co nebude potřeba? připojení k internetu, www stránky můžete vytvářet a publikovat z jiného počítače s připojením. pro umístění stránek na internet nebudete potřebovat vlastní domému, protože freeweby vám poskytnou prostor pro vaše stránky zdarma. na vytváření www stránek není potřeba výkonný počítač klidně postačí i starší.
Základní termíny v HTML TAG - Základní značka jazyka html zapisuje se do < > (je větší a je menší) ATRIBUT – je zapsán přímo do tagu a nastavuje nějakou jeho vlastnost ELEMENT - vše mezi úvodním a ukončovacím tagem <p>tento text je tedy element</p> <h1>nadpis je také element</h1>
Struktura webové stránky <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>titulek html dokumentu</title> </head> <body> tělo stránky (vše co se na stránce zobrazí) </body> </html> index.htm index.htm
Verze HTML První řádka <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> určuje o jakou verzi HTML se jedná <html> <head> <title>titulek html dokumentu</title> </head> <body> tělo stránky (vše co se na stránce zobrazí) </body> </html>
Webová stránka Celá stránka se začíná párovým tagem <html> a ukončuje se tagem </html> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>titulek html dokumentu</title> </head> <body> tělo stránky (vše co se na stránce zobrazí) </body> </html>
Hlavička HTML se skládá z hlavičky a hlavička se zapisuje mezi párové tagy <head> a </head> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>titulek html dokumentu</title> </head> <body> tělo stránky (vše co se na stránce zobrazí) </body> </html>
Tělo stránky HTML se skládá z těla stránky a tělo stránky se zapisuje mezi párové tagy <body> a </body> (tělo stránky je vše co se na stránce zobrazí) <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>titulek html dokumentu</title> </head> <body> vše co se na stránce zobrazí </body> </html>
Nadpis stránky V hlavičce se určuje název stránky a zapisuje se mezi párové tagy <title> a </title> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>titulek html dokumentu</title> </head> <body> tělo stránky (vše co se na stránce zobrazí) </body> </html>
SHRNUTÍ 3 Struktura webové stránky? Webová stránka <html>, </html> Hlavička <head>, </head> Titulek <title>, </title> Tělo <body>, </body> Vše psát na nové řádky