Jak na webové stránky

Jednoduchý úvod do psaní kódu internetových stránek

Základní prvky webové stránky

Když píšete dopis, napíšete hlavičku (adresu a předmět), obsah a závěr. Podobné je to s webovou stránkou. Má obálku (html), hlavičku (head) a tělo (body).

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head profile="http://gmpg.org/xfn/1">
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" lang="cs" />
  5. <title>Květiny až ke dvěřím - Zahradnictví Tonda</title>
  6. <link rel="stylesheet" href="style.css" type="text/css" media="screen" />
  7. </head>
  8.  
  10. <h1>Zahradnictví Tonda</h1>
  11. <p>Vítejte v našem elektronické obchodě!</p>
  12. </body>
  13. </html>

Co znamenají které řádky?

  1. Obecná definice typu xml stránky. Tuto část jen slepě kopírujte, nemusíte jí rozumět. Podle adresy v tomto řádku uvedené se načte konfigurační doubor pro prohlížeč a ten podle něj bude interpretovat značky, které v kódu stránky použijete.
  2. Podobně jako v předchozím řádku.
  3. Zde začíná hlavička, sekce head. Píší se v ní informace, které se nezobrazují (až na titulek), ale které jsou nedílnou součástí každé stránky.
  4. Zde se určuje, v jakém kódování (způsob, jak počítač zapisuje znaky) stránku píšete. Kromě utf-8 se používá ještě windows-1250 a iso-8859-2. Když např. v PSPadu budete mít nastaven formát utf-8, ale stránku budete mít nastavenu na windows-1250, špatně se vám zobrazí diakritika. Nejvhodnější je používat utf-8.
  5. Mezi značky (tagy) title napíšete titulek stránky.
  6. Značka link vám umožní načíst například soubor kaskádových stylů. Pokud se soubor nachází ve stejném adresáři jako stránka, do níž jej načítáte, napíšete k atributu href jako hodnotu pouze název souboru CSS (style.css). Pokud je např. v adresáři css, který je umístěn paralelně se stránkou, napíšete tam css/style.css.
  7. Končí hlavička.
  8. Prázdný řádek pro přehlednost. Je jedno, kolik řádek naťukáte, prohlížeč je nebere v potaz. Důležité jsou značky.
  9. Začíná sekce body - tělo dokumentu. Do něj píšeme obsah stránky. Pro ukázku jsem tam nějaký napsal.
  10. Tag h1 značí Heading 1, neboli nadpis nejvyšší úrovně. Na stránce by měl být jen jeden.
  11. Normální text se uzavírá do značky p - paragraph (odstavec).
  12. Ukončení těla dokumentu.
  13. Ukončení html dokumentu.

Tento kód je užitečné si při psaní nové stránky zkopírovat a nepsat ručně nový.

Zpět nahoru

© Radovan Fišer