1 Základy HTML (2. přednáška)2 WWW World Wide Web Sestává ze tří stavebních bloků Síť informačních zdrojů Universal Resource Identifier jednotný způso...
Síť informačních zdrojů Sestává ze tří stavebních bloků Universal Resource Identifier — jednotný způsob jak “adresovat” zdroje, (URL) protokoly pro přístup ke zdrojům (HTTP, FTP, ...) HTML — formát textových zdrojů umožňující je vzájemě propojovat (založen na SGML)
URI — Universal Resource Identifier
Typicky má následující tvar: schema:[//][username@]host[:port][/path[?query]] (obsah hranatých závorek je nepovinný) Příklady: http://google.cz/search?q=uri mailto:[email protected] ftp://[email protected] http://localhost:8080/index.html Více viz RFC 2396 (http://www.ietf.org/rfc/rfc2396.txt).
Protokoly — HTTP (HyperText Transfer Protocol) Později ...
GET / HTTP/1.1 Host: google.cz User-Agent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/53 Cookie: TZ=-120; HTTP/1.1 200 Ok. Date: Mon, 08. Oct 2012 23:46:26 Server: Apache Set-Cookie: SESSION=askdfj123KLKJ23KJ1LK3J123kjas32 Content-Length: 14371 Content-Type: text/html; charset=utf-8
SGML — Standard Generalized Markup Language Formát HTML je speciálním případem (tzv. aplikací) SGML SGML bylo původně navrženo ke sdílení strojově čitelných dokumentů 60. léta, Charles Goldfarb, Edward Mosher, and Raymond Lorie, IBM ISO standard (ISO 8879:1986) “aplikace” SGML sestává z: DTD (document type definition) — strojově čitelná definice formátu Style Sheet — určuje jak dané dokumenty zobrazovat Document Instance — konkrétní dokumenty
nejznámější aplikace XML HTML
DTD — Document Type Definition
Specifikuje formát dokumentu dokument má “stromovou” strukturu (DOM) dtd sestává ze seznamu elementů tří základních typů: ENTITY — definuje základní stavební kameny pro výstavbu složitějších prvků ELEMENT — definuje prvky dokumentu (každý prvek odpovídá uzlu v DOM stromu) ATTLIST — definuje vlastnosti jednotlivých uzlů
Příklad <meta http-equiv="Content-Type" content="text/xhtml; charset=utf-8" /> <meta name="keywords" content="set theory, topology, winter school, hejnice, forcing" /> Winter School in Abstract Analysis, section Set Theory & Topology
Link Element —
/>
Atributy href URI+ #name rel stylesheet — odkazuje na soubor se styly alternate — ve spojitosti s atributem media (resp. hreflang) umožňuje mít různé varianty pro různá “média” (resp. v různých jazycích) next,prev,contents,. . . — umožňuje navigaci ve větším souboru dokumentů type formát odkazovaného obsahu (např. text/css, text/javascript) media pro které médium je odkazovaný obsah relevantní (např. print) Poznámka Lze použít pouze uvnitř prvku . Neobsahuje další prvky.
HTML — Značkování/formátování textu h1, . . ., h6 nadpisy/sekce/kapitoly em, strong zdůraznění (em typicky italikou, strong typicky bold face) cite odkazy na literaturu blockquote, q citace (má atribut cite, jehož hodnotou je URI dokumentu, odkud citace pochází) sub, sup horní a dolní index ul, ol nečíslovaný a očíslovaný seznam (jednotlivé položky jsou v
...
prvcích) dl slovníkový seznam (definované slovo v
...
prvku, definice v
...
prvku) ins, del změny v dokumentu (ins — vložené pasáže, del — vypuštěné pasáže) br vynucený konec řádky p odstavec
Obrázky —
Atributy src url obrázku alt textový popis obrázku (povinný) width šířka obrázku height délka obrázku (důležité, umožní prohlížeči zobrazit stránku před načtením obrázku) Příklad
Tabulky —
...
Atributy cellspacing cellpadding Obsahuje prvky caption — popisek tabulky thead — záhlaví tabulky tbody — tělo tabulky tfoot — patička tabulky tr — řádek tabulky th, td — buňka tabulky
Tabulky —
...
Atributy rowspan sloučí buňky vertikálně colspan sloučí buňky horizontálně align horizontální zarovnání obsahu buňky (left, center, right, justify, char) valign vertikální zarovnání obsahu buňky (top, middle, bottom, baseline) headers id buňky, kde je nadpis sloupečku, ke kterému daná buňka náleží
Tabulky — příklad
Oceans
Area
Mean depth
million km<sup>2
m
Arctic
13,000
1,200
Atlantic
87,000
3,900
Indian
75,000
3,900
Southern
20,000
4,500
Total
361,000
Mean
72,000
3,800
Table : Oceans Arctic Atlantic Indian Southern Total Mean
Area million km2 13,000 87,000 75,000 20,000 361,000 72,000
Mean depth m 1,200 3,900 3,900 4,500 3,800
Shrnutí HTML je formát pro "značkování" textů a jejich vzájemné provázání je to "potomek" tzv. SGML formální specifikace je částečně daná strojově čitelným dtd dokumentem, částečně standardem sestává z tzv. prvků, které tvoří stromovou strukturu (DOM) prvky můžou mít vlastnosti (atributy) a potomky vizuální prezentace dokumentu (jak vypadá) je určena pomocí css stylů (viz dále) K dalšímu studiu ... https://developer.mozilla.org/en-US/docs/HTML http://www.w3.org/TR/html4/ http://docs.webplatform.org/