Rozdíly
Zde můžete vidět rozdíly mezi vybranou verzí a aktuální verzí dané stránky.
Následující verze | Předchozí verze | ||
html:vytvor_web [2021/09/29 10:30] – vytvořeno admin | html:vytvor_web [2023/11/15 20:54] (aktuální) – upraveno mimo DokuWiki 127.0.0.1 | ||
---|---|---|---|
Řádek 1: | Řádek 1: | ||
- | == Vytvoř web - zadání == | + | ==== Vytvoř web - zadání |
- Zvol si nějaké téma které tě zajímá - může to být tvůj koníček, sport, počítačová hra, oblíbený autor knih... | - Zvol si nějaké téma které tě zajímá - může to být tvůj koníček, sport, počítačová hra, oblíbený autor knih... | ||
- Vytvoř alespoň tři propojené [[html: | - Vytvoř alespoň tři propojené [[html: | ||
- | - sjednoť vzhled stránek pomocí sdíleného [https:// | + | - sjednoť vzhled stránek pomocí sdíleného |
- [[https:// | - [[https:// | ||
- bonus: zkontroluj, že stránka neobsahuje tvoje osobní informace a zkus ji publikovat skrze nějaký webhosting, například [[https:// | - bonus: zkontroluj, že stránka neobsahuje tvoje osobní informace a zkus ji publikovat skrze nějaký webhosting, například [[https:// | ||
Řádek 12: | Řádek 12: | ||
* [[krouzek: | * [[krouzek: | ||
* W3schools: [[https:// | * W3schools: [[https:// | ||
+ | * Akademie programování: | ||
+ | |||
+ | |||
+ | ==== Podrobnosti ==== | ||
+ | ==== Soubory ==== | ||
+ | [{{: | ||
+ | Bylo by dobré pochopit, co je v počítači **soubor** a jak funguje adresářový strom - každý adresář, krom toho kořenového (ve Windows " | ||
+ | |||
+ | [{{ : | ||
+ | Soubory jsou mnoha typů, ve Windows se od sebe odlišují příponami (ve jméně souboru část za poslední tečkou). Příklady typů souborů: PDF (dokument.pdf), | ||
+ | |||
+ | Některé typy souborů jsou **binární**. Co nejefektivněji tak ukládají data pro která je typ určen - například obrázkové formáty obsahují metody komprese obrázků. Pokud zobrazíte takový soubor v textovém režimu, objeví se většinou změť znaků zdánlivě bez systému. | ||
+ | |||
+ | Existují ale i soubory **textové**, | ||
+ | |||
+ | A jak takový soubor zobrazit či editovat textově? Na Windows je ve standardní výbavě // | ||
+ | |||
+ | === Vytvoření souboru ve Windows === | ||
+ | * zapnout " | ||
+ | * zaplnit nově vytvořený (Bez názvu) soubor nějakým obsahem - například [[krouzek: | ||
+ | * Soubor -> Uložit jako | ||
+ | * v ukládacím dialogu zvolit | ||
+ | - kde v systému souborů (ve kterém adresáři) bude soubor uložen | ||
+ | - **Název souboru**: Jak se soubor bude jmenovat (nezapomenout na správnou příponu, například .htm) | ||
+ | - **Uložit jako typ**: " | ||
+ | - **Kódování**: | ||
+ | - a potvrdit tlačítkem **Uložit** -> vytvoří soubor | ||
+ | |||
+ | === Příklad adresáře s webem === | ||
+ | [{{ : | ||
+ | Jak může vypadat váš adresář s webem: tři .htm soubory, .css soubor a .js soubor - pro oddělení HTML, CSS a Javascriptového kódu. (pokud se nezobrazují koncovky: Možnosti složky -> Zobrazení -> " | ||
+ | |||
+ | ==== Propojení souborů ve stránce ==== | ||
+ | Připojení [[https:// | ||
+ | <code html> | ||
+ | < | ||
+ | </ | ||
+ | |||
+ | Připojení javascriptu (kdekoliv): | ||
+ | <code html> | ||
+ | < | ||
+ | </ | ||
+ | |||
+ | Vložení obrázku (někde v ''< | ||
+ | <code html> | ||
+ | < | ||
+ | </ | ||
+ | |||
+ | Odkaz na jinou stránku (někde v ''< | ||
+ | <code html> | ||
+ | <a href=" | ||
+ | </ | ||
+ | |||
+ | Odkaz na jiný soubor (někde v ''< | ||
+ | <code html> | ||
+ | <a href=" | ||
+ | </ | ||
+ | |||
+ | ==== Adresářová struktura ==== | ||
+ | U složitějšího webu je nepřehledné mít všechny soubory ve stejné složce, proto lze vytvořit podadresáře. Struktura pak může vypadat třeba takhle: | ||
+ | |||
+ | * web/ | ||
+ | * design/ | ||
+ | * obrazky/ | ||
+ | * pozadi.png | ||
+ | * about.jpg | ||
+ | * styl.css | ||
+ | * scripty/ | ||
+ | * hlavni.js | ||
+ | * stranka1.htm | ||
+ | |||
+ | Odkazy v html pak budou vypadat například: | ||
+ | <code html> | ||
+ | < | ||
+ | </ | ||
+ | (takzvaná relativní cesta) |