705/2040

Kurz HTML -- 2. ročník

Tato stránka vznikla jako podpora pro ty, co se začínají učit HTML a CSS.

Pro naši práci budeme potřebovat textový editor a webový prohlížeč.

Pro psaní zdrojových kódů doporučuji textový editor Vim nebo Emacs. Dobře vám poslouží i Notepad++ nebo PSPad. Pro prohlížení HTML stránek doporučuji Firefox. Pro kontrolu validity kódu je dobré si Firefox rozšířit o HTML validátor.

Užitečné odkazy

Kde hedat informace a inspiraci?
Jak psát web
Web tvorba
LinuxSoft -- HTML tutorial
LinuxSoft -- CSS
LinuxSoft -- JavaScript
Velice užitečné postřehy Pavla Satrapy
Open source web design
Vše o WWW -- Jiří Kosek
Jak pohodlně udělat menu bez použití rámců?
Jak se dostat do vyhledávače?
Jak udělat web pro všechny?
Pravidla pro tvorbu přístupného webu
Přístupný web
Dogma W4D
Přístupný web -- stručně
Bezpečné barvy
Generátor barevných schemat
Další věci okolo
Co je to Lorem Ipsum
Co je to Pangram
Generátor Lorem Ipsum
Pixy
Generátor "dummy" textu

Užitečné části kódu

DTD HTML 4.01 Transcional
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
DTD XHTML 1.0 Strict
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
Znaková sada
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
Klíčová slova
<meta name="keywords" content="klíčová, slova">
Připojení stylového souboru
<link href="styles.css" rel="stylesheet" type="text/css">
Favicona
<link rel="shortcut icon" href="images/favico.png" type="image/png">

Kostra XHTML stránky

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <meta http-equiv="Content-Type" content="text/html; 
    charset=UTF-8" />
  <meta name="keywords" content="klíčová, slova"/>
  <link href="styles.css" rel="stylesheet" type="text/css" />
  <link rel="shortcut icon" href="images/favico.png" 
    type="image/png" />
  <title>titulek stránky</title>
  ...další údaje hlavičky...
</head>
<body>
  ...tělo stránky...
</body>
</html>
Základ pro PHP
zaklad-php.tar.gz
HTML stránka na pokusy
HTML
XHTML

Ukázky

Zadání závěrečné práce

Grafická forma stránky -- stránka bude obsahovat:
hlavičku, grafické logo
patičku
menu
vzhled bude popsán v externím CSS souboru
použité barvy budou dostatečně kontrastní
v CSS bude změněn vzhled prvků <hX>, <a:>, <li>
bude použita vlastnost background-image, float a overflow
Stránka bude obsahovat tyto prvky:
nadpisy alespoň dvou úrovní
seznamy
odstavce
odkazy
obrázky
Technické požadavky
webová stránka bude validní dle standardů W3C, DTD XHTML 1.0, CSS 1.0
obsah stránky bude logicky členěn pomocí tagů <div>

Něco málo k Javascriptu

| navigace |

No Facebook Valid XHTML 1.1 Valid CSS! Powered by Debian GNU/Linux Powered by Apache Powered by Perl