Web Design

Obsah Stránka pro netrpělivé.............................................. 3 Předmluva .......................................................... 5 Typografické konvence............................................... 7 Obsah............................................................... 8 I Design stránky a serveru 17 1 Jak psát pro Web 19 2 Jak psát pro Web II 21 2.1 Vědět pro koho píši........................................... 21 2.2 Prodává obsah ................................................ 22 2.3 Stručnost..................................................... 23 2.4 Přehlednost čili strukturovanost.............................. 24 2.5 Univerzalita.................................................. 25 2.6 Rychlost...................................................... 27 2.7 Obrácená pyramida............................................. 31 2.8 Desatera...................................................... 32 3 Úprava textu 35 3.1 Znaky obyčejné a speciální.................................... 35 3.2 Vodorovné mezery.............................................. 37 3.3 Řádkový zlom.................................................. 40 3.4 Odstavce ..................................................... 43 3.5 Svislé mezery................................................. 46 3.6 Zarovnání textu............................................... 474 Jak se co píše 51 4.1 Pomlčky...................................................... 51 4.2 Čísla, číslice, jednotky..................................... 52 4.3 Interpunkce, závorky a všeliké značky ....................... 56 4.4 Matematické vzorce .......................................... 58 5 Písmo 65 5.1 Druhy a parametry písma...................................... 65 5.2 Vyznačování.................................................. 69 5.3 Písmo na stránkách........................................... 74 5.4 Nadpisy...................................................... 77 5.5 Výroba nadpisů v praxi....................................... 81 5.5.1 Nadpis se stínem....................................... 81 5.5.2 Svítící nadpis......................................... 82 5.5.3 Vyříznutý nadpis....................................... 82 5.5.4 Nápis vystřižený z obrázku............................. 83 5.5.5 Závěrečné upozornění .................................. 83 5.6 Další informace.............................................. 83 6 Speciálně formátovaný text 85 6.1 Odsazení bloku čili úzké řádky .............................. 85 6.2 Seznamy...................................................... 88 6.3 Ukázky souborů a programů.................................... 93 6.4 Poznámky..................................................... 95 6.5 Vícesloupcový text........................................... 98 6.6 Básně........................................................100 6.7 Divadelní hra neboli drámo...................................102 97 Barvy 105 7.1 Špetka teorie...............................................105 7.2 Bezpečné barvy..............................................109 7.3 Vnímání barev...............................................111 7.4 Harmonie a kontrast.........................................113 7.5 Barvy na stránkách..........................................115 7.6 Další informace.............................................118 8 Tabulky 119 8.1 Nebezpečí tabulek ..........................................119 8.2 Rámečky ano či ne? .........................................122 8.3 Tipy pro přípravu tabulek...................................126 8.4 Mezery mezi buňkami.........................................128 8.5 Stránkotvorné tabulky.......................................131 8.6 Kouzla a čáry............................•...................135 9 Rámy 139 9.1 Rámy nebo tabulky?..........................................140 9.2 Přece jenom rámy............................................141 9.3 Další informace.............................................144 10 Čeština na stránkách 145 10.1 Řešení primitivovo..........................................145 10.2 Řešení futuristovo .........................................146 10.3 Řešení Indiánovo............................................147 10.4 Řešení Pytlíkovo............................................147 10.5 Řešení prodavače disků .....................................148 10.6 Jak pracovat s češtinou ....................................149 10.7 Další informace.............................................150 10 Web Design11 Navigace 151 11.1 Odkazy ......................................................151 11.2 Navigační prvky stránky......................................156 11.3 Navigační lišty..............................................158 11.4 Orientační mapa..............................................161 11.5 Vyhledávání..................................................162 11.6 Podpůrné programy............................................163 11.7 Externí hledači a spolupráce s nimi..........................164 12 Návrh serveru či prezentace 167 12.1 Základní principy............................................168 12.2 Struktura prezentace.........................................170 12.3 Prototypy a standardní postupy...............................171 12.4 Komunikace s uživateli.......................................173 II Grafika a multimédia 175 13 Grafické formáty 177 13.1 GIF..........................................................178 13.2 JPEG.........................................................182 13.3 PNG..........................................................184 13.4 Firemní formáty .............................................188 13.5 Který je nejlepší?...........................................188 13.6 Další informace..............................................190 14 Grafika pro Web 191 14.1 Proč nepoužívat knihovny ikon................................191 14.2 Obrázkové CD-ROMy............................................193 14.3 Digitalizační nářadí.........................................194 14.4 Koncové úpravy vzhledu.......................................195 14.5 Vrhání stínu ................................................198 1114.6 Hladké hrany čili antialiasing................................200 14.7 Zmenšování objemu dat.........................................201 14.8 Obrázky pro ty ostatní aneb ALT...............................203 14.9 Grafika na pozadí stránky................................... . 205 14.10Další informace...............................................207 15 Obrázky s klikou 209 15.1 Klasika ......................................................210 15.2 Klika u klienta...............................................212 15.3 Jak ji obejít.................................................213 15.4 Podpůrné programy.............................................215 15.4.1 MapThis ..............................................216 15.4.2 Live Image............................................217 15.4.3 MapEdit...............................................218 16 Animace 219 16.1 Animované GIFy................................................219 16.1.1 Microsoft GIF Animator................................222 16.1.2 Ulead GIF Animator....................................223 16.1.3 WhirlGif .............................................224 16.2 Filmové klipy.................................................225 16.3 Alternativní metody...........................................227 17 Slova, hudba, šumy, svisty 229 17.1 Způsoby ukládání zvuku........................................230 17.2 Prostředky pro práci..........................................231 17.2.1 GoldWave..............................................231 17.3 Zvuk na stránkách.............................................233 12 Web DesignIII Aktivní stránky 235 18 Common Gateway Interface (CGI) 237 18.1 Jak pracuje.................................................237 18.2 Hegemon zvaný Perl..........................................240 18.3 Vstup programu .............................................240 18.4 Výstup......................................................244 18.5 Telefonní seznam - metoda GET...............................245 18.6 Dopis správci - metoda POST ................................247 18.7 Ladění CGI..................................................249 18.8 CGI a bezpečnost............................................253 18.9 Další informace.............................................256 19 Formuláře aneb příručka vyzvědače 257 19.1 Samotný nebo vestavěný?.....................................258 19.2 Koncepce....................................................259 19.3 Konstrukce formuláře .......................................262 19.4 Předávání souborů...........................................264 20 JavaScript a Java 269 20.1 JavaScript..................................................269 20.2 JavaScript na stránkách.....................................270 20.3 Java........................................................272 20.4 Java na stránkách ..........................................273 20.5 Další informace.............................................274 IV Nástroje 275 21 Adresy informací čili URL 277 21.1 Uniformní Rodinka...........................................277 21.2 Základní tvar URL...........................................278 1321.3 Nejběžnější schémata............................................281 21.3.1 HTTP.................................................. 281 21.3.2 FTP....................................................281 21.3.3 Gopher .........................................282 21.3.4 Mailto.................................................283 21.3.5 News...................................................283 21.3.6 NNTP...................................................284 21.3.7 Telnet.................................................285 21.3.8 File ..................................................285 21.4 Relativní URL ..................................................286 21.4.1 Jak určit základní URL................................287 21.4.2 Analýza relativního URL..............................288 21.4.3 Neobvyklosti a nebezpečí...............................290 22 HyperText Markup Language verze 3.2 291 22.1 Struktura dokumentu ............................................291 22.2 Značky, atributy, symboly.......................................292 22.3 Záhlaví stránky.................................................294 22.4 Tělo stránky a komentáře........................................298 22.5 Písmo...........................................................299 22.6 Strukturování a formátování textu...............................302 22.7 Odkazy ........................................................305 22.8 Seznamy.........................................................306 22.9 Obrázky....................................................... 309 22.10Aplety..........................................................311 22.11 Tabulky........................................................312 22.12Formuláře a spolupráce s CGI programy...........................317 22.13Klientova klika.................................................323 22.14Další informace.................................................324 14 Web Design23 Kaskádové definice stylu 327 23.1 Základy CSS ..................................................328 23.2 Selektory ....................................................329 23.3 Vazba stylu a stránky.........................................334 23.4 Dědičnost a kaskádování.......................................337 23.5 Formátování...................................................339 23.6 Vlastnosti....................................................343 23.6.1 Písmo..................................................344 23.6.2 Barva a pozadí.........................................346 23.6.3 Text...................................................349 23.6.4 Vlastnosti bloku.......................................351 23.6.5 Klasifikační vlastnosti................................355 23.7 CSS a klienti.................................................357 23.8 Další informace...............................................358 24 Rozšíření HTML a kaskádových stylů 359 24.1 Tabulky.......................................................360 24.2 Rámy..........................................................364 24.3 Vkládání dalších prvků na stránky.............................374 24.4 Vrstvy........................................................376 25 HyperText Transfer Protocol (HTTP) 379 25.1 Základní model................................................379 25.2 Dotaz a odpověď...............................................381 25.3 Metody........................................................382 25.4 Základní hlavičky.............................................384 25.5 Vylepšené dotazy . ..........................................385 25.6 Vyrovnávací paměti ...........................................386 1526 Programové vybavení 389 26.1 WWW klient................................................ 389 26.1.1 Netscape Communicator................................390 26.1.2 Microsoft Internet Explorer..........................391 26.1.3 Amaya................................................392 26.1.4 Arachne..............................................394 26.1.5 Lynx.................................................394 26.2 WWW server..................................................394 26.2.1 Apache ..............................................395 26.2.2 Microsoft Internet Information Server................396 26.3 Editor......................................................396 26.3.1 vim (vi improved) ...................................397 26.3.2 Microsoft FrontPage................................. 398 26.4 Kontroly a prověrky.........................................398 26.4.1 weblint .............................................399 26.5 Výroba obrázků..............................................399 26.5.1 Adobe Photoshop .....................................400 26.5.2 Corel PHOTO-PAINT....................................401 26.5.3 Paint Shop Pro.......................................401 26.5.4 GIMP.................................................402 27 Doprovodný CD-ROM 403 28 Zajímavé odkazy 405 Literatura 407 Rejstřík 409 16 Web Design