HTML Hypertext Markup Language



Podobné dokumenty
Tvorba webových stránek

Tvorba WWW stránek. Mojmír Volf

Tvorba www-stránek. Příkazy jazyka HTML. Budeme pracovat následovně: Základní struktura webové stránky. Příkazy sekce HEAD

HTML - Úvod. Zpracoval: Petr Lasák

Uspořádání klient-server. Standardy pro Web

22. Tvorba webových stránek

Základy informatiky. HTML, tvorba WWW stránek. Daniela Szturcová Část převzata z přednášky P. Děrgela

NSWI096 - INTERNET. Úvod do HTML

Základy informatiky. 03, HTML, tvorba WWW stránek. Daniela Szturcová Část převzata z přednášky P. Děrgela

WWW a HTML. Základní pojmy. Ivo Peterka

Úvod do jazyka HTML (Hypertext Markup Language)

Zá klady HTML. Tag HTML <HTML> Párová značka, který definuje webovou stránku. Obsah stránky končí značkou

Tvorba webových stránek

Úvod do tvorby internetových stránek v jazyce HTML

Vývoj Internetových Aplikací

APLIKACE XML PRO INTERNET

Čtvrtek 11. dubna. Základy HTML. Obecná syntaxe HTML. Struktura HTML

12. Základy HTML a formuláře v HTML

Hlavička dokumentu. mezi <head> a </head> obsahuje informace vztažené k dokumentu metadata <title> - název stránky, povinná párová značka

HTML XHTML JavaScript PHP ASP.Net Zajímavé odkazy

Základy informatiky. 03 HTML, tvorba webových stránek. Kačmařík/Szturcová/Děrgel/Rapant

Základy WWW publikování

Název DUM: VY_32_INOVACE_2B_14_ Programovací_jazyk_HTML

Tvorba webu. Úvod a základní principy. Martin Urza

(X)HTML-TAGY. VOŠ a SŠT Česká Třebová

Tvorba webových stránek pomocí HTML kódu v příkladech. M. Seménka, 2014

13. Vytváření webových stránek

<html> - párový tag, uzavírá celý dokument <head> - párový, určuje hlavičku dokumentu <body> - párový, uzavírá tělo dokumentu Př. Základní struktura

Mgr. Vlastislav Kučera přednáška č. 1

<link> - definuje vztah k jiným XHTML dokumentům, typicky

XHTML 1. Značkovací jazyky (mark-up): Součastí prostředků je systém m značek

Základy HTML. Obecná syntaxe HTML. Struktura HTML

Internet a tvorba WWW stránek

Základy HTML. Obecná syntaxe HTML. Struktura HTML

Mgr. Vlastislav Kučera lekce č. 2

Základy HTML. Autor: Palito

Mgr. Vlastislav Kučera přednáška č. 2

(X)HTML, CSS a jquery

Dokument ve formátu webové stránky vytvořený pomocí XHTML a CSS

Stránka se dá otevřít dvěma způsoby

HTML. HyperText Markup Language Josef Steinberger

Tvorba stránek v HTML ve Wordu

Základy programovacího jazyka HTML. Autor: Ing. Jan Nožička SOŠ a SOU Česká Lípa VY_32_INOVACE_1133_Základy programovacího jazyka HTML_PWP

Škola: Gymnázium, Brno, Slovanské náměstí 7 III/2 Inovace a zkvalitnění výuky prostřednictvím ICT Název projektu: Inovace výuky na GSN

Mgr. Vlastislav Kučera přednáška č. 1

HTML. HTML- HyperTextMarkUpLanguage (nadtextový značkový jazyk) TAGY

(X)HTML. Internetové publikování

Dnešní téma. Oblasti standardizace v ICT. Oblasti standardizace v ICT. Oblasti standardizace v ICT

Tvorba internetových stránek

Základy (X)HTML. WWW stránka WWW stránka dokument (soubor) s informacemi a pokyny pro jejich zobrazení

Základy HTML (2. přednáška)

TVORBA WEBOVÝCH STRÁNEK

9. Tagy tvorba www stránky pomocí tagů

NSWI096 - INTERNET. CSS kaskádové styly. Mgr. Petr Lasák

HTML - pokračování. Co už víme?

Jemný úvod do HTML. Co je HTML značka? Web nezná text formátovaný mezerami a konci řádku! Ale já potřebuji psát více mezer a určovat zalomení řádku!

Internet 02 - Tvorba statických www stránek za pomoci HTML tagů

Mgr. Stěpan Stěpanov, 2013

IE1 jazyk HTML a kaskádové styly

Mgr. Vlastislav Kučera Struktura stránky, hlavička,

Tvorba WWW stránek. přehled technologií používaných na webu principy jednotlivých technologií a možnosti jejich vzájemného kombinování

IE1 jazyk HTML a kaskádové styly

Inovace výuky prostřednictvím šablon pro SŠ

Úvod do aplikací internetu a přehled možností při tvorbě webu

1. Struktura stránky, zásady při psaní kódu, MVC pattern. Web pro kodéry (Petr Kosnar, ČVUT, FJFI, KFE, PINF 2008)

v laboratořích CERN ve Švýcarsku byl zahájen projekt WWW (T. Barners-Lee přichází s projektem distribuovaného hypertextového systému)

1 Úvod. 2 Tvorba internetových prezentací. 2.1 Nástroje pro tvorbu prezentace. Stránka 1

Základy informatiky. 03 HTML, tvorba webových stránek. Kačmařík/Szturcová/Děrgel/Rapant

Internet 1 vývoj, html, css

Co je HTML. 1. Párový tag má začátek a konec: 2. Nepárový tag nemá ukončovací značku:

Internet WEB stránky HTML, Hypertext MarkUp Language - nadtextový jazyk - Místo příkazů obsahuje tagy - značky

INTERNET A SÍTĚ. Role při tvorbě webových aplikací. Rozhodovací vrstvy při tvorbě webových aplikací. povrch kostra struktura obsah strategie

Webové stránky. 2. Úvod do jazyka HTML. Datum vytvoření: str ánk y. Vytvořil: Petr Lerch.

Tvorba jednoduchých WWW stránek. VŠB - Technická univerzita Ostrava Katedra informatiky

Úvod do tvorby internetových aplikací

Název: VY_32_INOVACE_PG4116 SEO, standardy, sémantika kódu, přistupnost

Jak vytva r et webove stra nky pomocı XHTML a CSS.

Základy webových aplikací ZWA Přednáška č. 2 HTML. Martin Klíma

Základy informatiky. HTML, tvorba WWW stránek. Daniela Szturcová Část převzata z přednášky P. Děrgela

1 Tvorba WWW stránek pomocí programu Microsoft FrontPage

Internetové publikování

HTML. ICT_01., 02. konzultace; 2. ročník 1/6

Tvorba WWW stránek. Mgr. Petr Jakubec. Katedra fyzikální chemie Univerzita Palackého v Olomouci Tř. 17. listopadu

Tvorba jednoduchých WWW stránek. VŠB - Technická univerzita Ostrava Katedra informatiky

Inovace výuky prostřednictvím šablon pro SŠ

Základy informatiky. HTML, tvorba WWW stránek. Daniela Szturcová Část převzata z přednášky P. Děrgela

HTML. Úvod do (X)HTML. Tagy značky. Slouží ke strukturování dokumentu (párové a nepárové) <tag atribut1= hodnota atributu > text </tag>

Výukový materiál KA č.4 Spolupráce se ZŠ

Bloky. Tag Význam Párový. p odstavec nepovinně. br řádkový zlom ne. div oddíl ano. center vycentrování ano. h1 nadpis 1.

Tomáš Herout

Tvorba jednoduchých WWW stránek

PŘÍRUČKA. Správa obsahu webové prezentace. Formátování textu

Microsoft Office SharePoint Server 2007

Přehled základních html tagů

TNPW1 Cvičení aneta.bartuskova@uhk.cz

14. Jazyk HTML (vývoj, principy, funkce, kostra stránky). Jazyk XML, XHTML. Algoritmizace - cyklus for, while a do while, implementace v jazyce

Poznámka v (x)html Všechno, co je v (x)html souboru obaleno značkami <!-- a -->, je považováno za poznámku a nezobrazuje se.

Tvorba fotogalerie v HTML str.1

Jazyky XHTML, DHTML, CSS a WML

Transkript:

HTML Hypertext Markup Language je jazyk určený na publikování a distribuci dokumentů na Webu velmi jednoduchý jazyk používá ho mnoho uživatelů má výkonné prostředky (příkazy) k formátování dokumentů (různé typy a velikosti písma hlavičky, seznamy, tabulky, rámy (dělení stránky,?) umožňuje vytvářet hypertextové odkazy na jiné Web stránky (na jiném Web serveru) umožňuje vkládat na Web stránky multimediální soubory (prezentace) obrázky (mohou být hypertextovým odkazem na další Web stránky), animace, audio, video umožňuje interakci s uživatelem pomocí formulářů Formulář má ve skutečnosti dvě složky: HTML (Web) stránku definující formulář. Ta představuje viditelnou část a zajišťuje styk s uživatelem když prohlížeč získá Web stránku, která obsahuje formulář, zobrazí jej uživateli a umožní mu prostřednictvím nejrůznějších vstupních polí a tlačítek zadat požadované informace. Obslužný skript když se odešle vyplněný formulář, prohlížeč pošle serveru URL (adresu) obslužného skriptu a předá mu uživatelovy informace z adresáře. Skript je převezme, provede s nimi (na serveru), co je zapotřebí a vytvoří HTML stránku, obsahující odezvu na zaslané informace. Ta je pak uživateli prohlížečem zobrazena jako výsledek formuláře.

Vývoj HTML Klán, P., Jindřich, J. WWW pro zelenáče. Neokortex 2002 Softwarové noviny //2003 Dočkáme sa očisty HTML 90 léta široké použití jazyka HTML pro publikování a distribuci dokumentů, rozšiřování a modifikace původního návrhu jazyka HTML 1997 snaha o standardizaci (konsorcium W3C) HTML 3.2 Reference Specifications 1997 verze HTML 4.0 1999 verze 4.01 vývoj HTML je ukončen 1998 nástup jazyka XML (Extensible Markup Language) rozšířit možnosti zpracování dat na Webu nad rámec toho, co umožňuje HTML. XML metajazyk uživatel má možnost si sám definovat vlastní značky; soubor pravidel, pomocí kterých je možné navrhnout konkrétní aplikační jazyk. 2000 Konsorcium W3C zveřejňuje doporučení XML 1.0 XHTML 1.0 (Extensible Hypertext Markup Language) A Reformulation HTML 4 in XML 1.0 značky v XHTML jsou shodné (až na malé výjimky) se značkami v HTML 4 používá se syntax jazyka XML XHTML = HTML + XML (jazyk XHTML využívá výhody XML i HTML)

Rozdíly mezi HTML a XHTML všechny značky musí být psány malými písmeny např. <table>, <br />,... všechny značky musí být ukončeny (každá počáteční značka musí mít koncovou značku) u párových značek <h1>rozdíly mezi HTML a XHTML</h1> <p>text</p> u nepárových značek značka musí být ukončena /> <br /> <img src= logo.gif width= 200 height= 200 alt= znak /> hodnoty atributů značek musí být v uvozovkách <a href= http://dfjp.upce.cz/akreditace >Akreditace</a> vnoření značek se nesmí křížit <strong><h1>xhtml</h1><strong>

Pevná struktura XHTML dokumentu <?xml version="1.0" encoding= windows-1250"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/tr/xhtml1/dtd/xhtm11-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head > <title> Výuka XHTML </title> <meta http-equiv="content-type" content="text/html"; charset="windows-1250"> </head> <body> <strong> <h1 align= center >XHTML</h1></strong> <p><strong><h2 >Struktura XHTML dokumentu</h2></strong></p> <p><h3>základy formátování textu</h3></p> <p> </p> <hr /> </body> </html> <?xml version="1.0" encoding= windows-1250"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/tr/xhtml1/dtd/xhtm11- Transitional.dtd"> tzv. preambule deklarace verze XML, kódování nepovinný řádek DTD typ dokumentu (obsahuje seznam všech prvků a atributů, které je možné v dané verzi XHTML použít jazyk XHTML 1.0 definuje tři typy dokumentů: Strict (přesné) nepodporuje tzv. zapovězené značky a rámy, k formátování písma vyžaduje kaskádové styly

Transitional (přechodné) umožňuje snadný přechod od HTML dokumentů k XHTML podporuje tzv. zapovězené značky, nepodporuje rámy, nevyžaduje kaskádové styly Frameset (rámcové) jde o přechodný typ rozšířený o možnost použití rámců <html xmlns="http://www.w3.org/1999/xhtml"> začátek XHTML dokumentu atribut xmlns specifikuje tzv. jmenný prostor (namespaces) jedná se o názvy všech použitelných značek a jejich atributů založený na HTML 4.01. Podobně </html> ukončuje XHTML dokument <head > <title> Výuka XHTML </title> <meta http-equiv="content-type" content="text/html" charset="windows-1250" /> </head> hlavička dokumentu další informace k dokumentu, titulek (popisek) stránky (title), kódování (pro starší prohlížeče) <body> <strong> <h1 align= center >XHTML</h1></strong> <p><strong><h2 >Struktura XHTML dokumentu </h2></strong> </p> <p><h3>základy formátování textu</h3></p> <p> </p> <hr /> Tělo XHTML dokumentu vkládá se sem obsah stránky, která má být vidět v prohlížeči </body> </html> Soubor s XHTML dokumentem má příponu htm resp. html.

formátování písma Tvorba jednoduchého XHTML dokumentu typ zobrazovaného písma se nastavuje v prohlížeči Web stránek můžeme nastavit zvýraznění textu (značky udávají zvýraznění přímo prohlížeči) <b>tučné písmo</b> <i>kurzíva</i> jejich kombinace (vnoření) a další logické zvýraznění textu (zvýraznění je závislé na prohlížeči) <em> </em> většinou výsledkem je kurzíva <strong> </strong> tučné zvýraznění nadpisy <h1> (nejdůležitější) až <h6> (nejméně důležitý) dolní <sub> a horní <sup> index velikost, barva a typ písma značka <font> s atributy size, color, face <font size= 7 color= blue face= Arial >Dobrý den</font> odstavce a zarovnání textu atribut align a jeho hodnoty left, right, center, justify <h1 align= center >Tvorba WWW stránek</h1> značka <div> pro zarovnání více odstavců zároveň <div align= center > <p>xhtml</p> <p>tvorba WWW stránek</p> <p>zarovnání textu</p> </div> zalomení řádku <br /> pevná mezera seznamy nečíslovaný seznam <UL> (odrážky), atribut type udává tvar odrážky (hodnoty disc, circle, square ) číslovaný seznam <OL>, atribut type udává způsob číslování (hodnoty 1, I, i, A, a)

položky seznamu <li> vnořené seznamy odkazy <a href= http://ct.upce.cz/machalik/inf_ii >Informatika II</a> obrázky tabulky <table> <tr> <td>prvek 11</td> <td>prvek 12</td> <td>prvek 12</td> </tr> <tr>... </tr> </table> rámy? formuláře a jejich obsluha