Kurz je určen začátečníkům v oblasti vývoje webu. Tady zjistíš, co jsou to HTML soubory a z čeho se skládají. Naučíme tě, co jsou to HTML elementy, jak je definovat aby byly na stránce vidět. Seznámime se různymi elementy pro zobrazovaní textu a obrázků. Pak se podíváš na základy jazyka CSS. Tím budeš měnit styl elementů na stránce. A pro lepší pochopení jak jsou tyhle elementy vnímány prohlížečem ti vysvětlíme co je to box model. Po skončení tohoto kurzu budeš mít dobrý základ v práci s HTML a CSS. Na něm pak můžeš stavět v dalších kurzech v oblasti webového vývoje ale taky například v oblasti web scrapingu.
Studenti se uplatinili u firem jako jsou

časová náročnost

12 hodin

obtížnost

Vhodné pro začátečníky

rozsah kurzu

225 kapitol

Co je dobré znát předem

Dobrá zpráva! Nemusíš mít žádné předcházející znalosti. V tomto kurzu půjdeme od úplných začátků.

Osnova

  1. Lekce 1
    Úvod do HTML
    60 minut
    1. Co je to jazyk HTML?
    2. Anatomie HTML elementů
    3. Atributy HTML elementu
    4. Odstavce
    5. Ruční zalomení řádku
    6. Zvýraznění a zdůraznění textu
    7. Nadpisy
    8. Odkaz a jeho základy
    9. Otevření do nového okna
    10. E-mailové odkazy
    Zobrazit dalších 8 kapitol
    začít zdarma
  2. Lekce 2
    Přehled HTML tagů a jejich využití
    60 minut
    1. Základní (nečíslovaný) seznam
    2. Číslovaný seznam
    3. Obrázek a jeho základy
    4. Atribut alt
    5. Základní tabulka
    6. Složitější tabulka
    7. Doplňkové elementy tabulky
    8. Typy elementů
    9. Blokové elementy
    10. Řádkové elementy
    Zobrazit dalších 10 kapitol
    začít zdarma
  3. Lekce 3
    Základy CSS
    60 minut
    1. Co je to CSS?
    2. Vlastnosti vzhledu
    3. Deklarace stylů
    4. Přímý zápis stylu
    5. Pravidla v CSS
    6. Pravidla umístěná v kódu
    7. Pravidla umístěná v souboru
    8. Typové selektory
    9. Selektory tříd
    10. Násobné použití tříd
    Zobrazit dalších 11 kapitol
    začít zdarma
  4. Lekce 4
    CSS vlastnosti
    60 minut
    1. Barvy
    2. Vznik barev
    3. Pojmenované barvy
    4. Desítkový zápis barev
    5. Hexadecimální RGB zápis
    6. Složitost zápisů barev
    7. Úvod do délkových jednotek
    8. Absolutní měrné jednotky
    9. Relativní měrné jednotky
    10. Ukázky použití relativních jednotek
    Zobrazit dalších 16 kapitol
    začít zdarma
  5. Lekce 5
    Box model, viditelnost prvků, pozicování
    60 minut
    1. Box model
    2. Šířka a výška
    3. Zakulacené rohy
    4. Vnější a vnitřní okraje
    5. Typ elementů
    6. Rámeček
    7. Rámeček podél specifické strany
    8. Zkrácený zápis
    9. Skrývání elementů
    10. Průhlednost
    Zobrazit dalších 11 kapitol
    začít zdarma
  6. Lekce 6
    Responzivní web design
    60 minut
    1. Co je responzivní web design?
    2. Historický přehled
    3. Responzivní mód v prohlížeči
    4. Co je viewport?
    5. Nastavení viewportu
    6. Shrnutí
    7. Responzivní obrázky
    8. Vlastnost object-fit
    9. Obrázky na pozadí
    10. Element <picture>
    Zobrazit dalších 5 kapitol
    začít zdarma
  7. Lekce 7
    Responzivní web design II.
    60 minut
    1. Co jsou to media queries?
    2. Syntax media queries
    3. Breakpoints
    4. Breakpoints: standardní hodnoty
    5. Skrytí prvků
    6. Koncept Mobile First
    7. Co je framework?
    8. Jaké frameworky známe?
    9. Závěr
    10. Úkol č. 1
    Zobrazit dalších 3 kapitoly
    začít zdarma
  8. Lekce 8
    Úvod do flexboxu
    60 minut
    1. Co je flexbox?
    2. Nastavení flexboxu
    3. Flexbox a jeho osy
    4. Vlastnosti flexboxu
    5. Vlastnosti rodičovského elementu
    6. Flex-wrap
    7. Vlastnosti položek uvnitř rodičovského elementu
    8. Flex-grow
    9. Flex-shrink
    10. Flex-basis
    Zobrazit dalších 4 kapitoly
    začít zdarma
  9. Lekce 9
    Pokročilé vlastnosti flexboxu
    60 minut
    1. Zarovnávání položek flexboxu
    2. Vodorovné zarovnávání
    3. Zarovnání na začátek
    4. Zarovnání na konec
    5. Zarovnání na střed
    6. Zarovnání s mezerami
    7. Zarovnání okolo položek
    8. Vertikální zarovnání
    9. Zarovnání pomocí roztáhnutí položek
    10. Zarovnání na začátek
    Zobrazit dalších 9 kapitol
    začít zdarma
  10. Lekce 10
    Grid
    60 minut
    1. grid/mřížka
    2. Rozložení mřížky
    3. Rozdíl mezi flexboxem a gridem
    4. Mřížka ve vývojářských nástrojích
    5. Linie mřížky
    6. Nastavení mřížky
    7. Sloupce mřížky
    8. Řádky mřížky
    9. Mezery mřížky
    10. Umísťování položek v mřížce
    Zobrazit dalších 5 kapitol
    začít zdarma
  11. Lekce 11
    GIT
    60 minut
    1. Proč Git?
    2. Struktura a cíl lekce
    3. Co je to Git?
    4. IDE vs. Terminál
    5. Instalace Gitu
    6. Založení GitHub účtu
    7. Vytvoření a nahrání SSH klíče
    8. Založení repozitáře
    9. Stažení repozitáře
    10. Aktuální stav – terminál
    Zobrazit dalších 15 kapitol
    začít zdarma
  12. Lekce 12
    Hosting, doména
    60 minut
    1. Co je to doména?
    2. Výběr domény
    3. Registrace nové domény
    4. Co je to hosting?
    5. Výběr hostingu
    6. Přihlášení a nahrání souborů
    7. FTP klient
    8. Užitečné nástroje
    9. Google Material Icons
    10. Fotobanka Unsplash
    Zobrazit dalších 8 kapitol
    začít zdarma

Autoři kurzu

Kateřina Blatná

Katka pracovala několik let v oblasti PR & marketingu. Postupem času se začala zajímat také o vývoj webu a od základů HTML a CSS se dostala až k moderním frameworkům. Nyní pracuje na sdíleném pracovišti Masarykovy univerzity a ÚZIS a zpracovává požadavky na weby s tématikou zdravotnictví.

Martin Pešout

Externí lektor, Front-end engineer.

Martin působí v současnosti jako frontend vývojář ve společnosti ContentKing. Tvorbě webů se věnuje již od roku 2011. Miluje jednoduchý design a při své práci si potrpí na detaily. Dále spoluorganizuje brněnské srazy {F}rontendisti

Co říkají naši studenti

4.8 / 5
Přečti si více recenzí na Google
Petr Ševčík

Engeto Online kurzy jsou super pro samouky, začátečníky, i mírně pokročilé. Široká nabídka Python, Linux, Databází a dalších kurzů je zpracovaná hezky interaktivně. Dobře popsanou teorii doplňují praktické cvičení. U subscription je výhoda že si člověk může studovat vlastním tempem.

Marek Soukup

Zdaleka nejlepší vzdělávací kurz, s jakým jsem se setkal. Všechno má jasný účel a smysl, online podpora je vynikající. Pokud se za půl roku chcete posunout o 10 let dopředu, musíte se stavit u kluků z ENGETO.

Radim Zouhar

Engeto - to je skvělý tým ochotných lektorů. Vědomosti, zkušenosti a příležitosti Vám přinesou na talíři. Člověk musí mít jen otevřenou hlavu a poctivě se připravovat.

časová náročnost

12 hodin

obtížnost

Vhodné pro začátečníky

rozsah kurzu

225 kapitol

Co je dobré znát předem

Dobrá zpráva! Nemusíš mít žádné předcházející znalosti. V tomto kurzu půjdeme od úplných začátků.

PŘIDEJ SE K VÍC JAK

10 000

STUDENTŮM

začít zdarma