Základy moderního layoutu - bezplatný kurz od Hexlet, školení 9 hodin, Termín: 5. prosince 2023.

Různé / by admin / December 06, 2023

click fraud protection

Dozvíte se více o značení HTML a možnostech moderního standardu HTML5. Získáte také základní znalosti o stylování pomocí CSS: naučíte se propojovat styly, používat selektory a pracovat s kaskádováním. Kromě HTML a CSS se naučíte pracovat s vestavěnými nástroji pro ladění rozložení v prohlížeči, zejména s Google Chrome DevTools. Díky tomu se naučíte používat značkovací jazyk HTML k rozvržení textu na webu a také se seznámíte se základními pravidly používání CSS a stylingu textu.

Své nové dovednosti budete moci okamžitě uplatnit v praxi – nastudujeme si pro ně layout editory a pluginy. Na konci každé lekce najdete malé samostatné úkoly. Jsou zaměřeny na praktičtější pochopení probíraného tématu, a proto se velmi doporučují k implementaci.

Základy layoutu se vám budou hodit, pokud se rozhodnete studovat webový vývoj bez ohledu na směr. Znalosti z tohoto kurzu pomáhají programátorům označit data a zobrazit je na webu. Tento kurz je vhodný pro začátečníky a vývojáře, kteří se nesetkali

Úvod
Kurz „Základy moderního rozvržení“ je základem pro osvojení si základů HTML a CSS rozvržení webových stránek. V této lekci si krátce povíme, co se v kurzu naučíme a jak lze tyto znalosti uplatnit v praxi.

instagram viewer

Úvod do HTML
Lekce je věnována rozvržení HTML od začátku. Mluvíme o roli atributů a studujeme obecné schéma pro popis HTML tagů.

Blokový model
Které prvky jsou zodpovědné za rámec stránky a které pomáhají v procesu její stylizace nebo přidávání funkčních částí? Pojďme se seznámit s blokovými a inline HTML elementy a prostudovat si vliv stylů na konečnou šířku elementů.

Sémantické HTML
Hlavním cílem jakéhokoli rozvržení HTML je zprostředkovat význam bloků. V této lekci prozkoumáme sémantické možnosti nejnovějšího standardu HTML5 a dozvíme se o přístupnosti webu.

Základní struktura HTML dokumentu
Jakýkoli dokument HTML má základní strukturu sestávající ze značek a prvků služeb. Prohlížeč je potřebuje ke správnému zobrazení informací. V této lekci se podíváme na každý řádek této struktury.

Základy CSS
Jazyk CSS byl vytvořen pro vizuální design webové stránky. Studujeme základní možnosti jazyka, zjišťujeme, jak je používat společně s HTML. Učíme se zařazovat CSS soubory a seznamujeme se se základními typy selektorů.

Kaskádování v CSS
Co je kaskádování a jak to funguje v CSS? Lekce je věnována rozdílům v prioritách selektoru a schopnosti použít je ve vašich projektech.

Chrome DevTools
Při rozvržení webu je důležité najít chyby včas nebo pochopit, jak správně převést blok, který potřebujeme. Dříve se to dělalo především ručně. V dnešní době mají moderní prohlížeče funkci webového inspektora. Podívejme se na možnosti jednoho z nich - Chrome DevTools.

Editory kódu
Chcete-li uložit svou práci, potřebujete editor kódu. V této lekci se podíváme na to, jak nainstalovat Visual Studio Code. Jedná se o výkonný nástroj, který lze použít nejen pro rozvržení, ale také pro programování v jakémkoli jazyce.

Mravenec
Pojďme si prostudovat jeden z nejužitečnějších pluginů pro návrháře layoutů – Emmet. Urychlí to značkování HTML kódu a odstraní většinu rutinních kroků.

Publikace na internetu
Chcete-li umístit projekt na internet, musíte použít hosting - speciální server, který bude ukládat soubory a poskytovat k nim přístup prostřednictvím názvu domény. V tomto tutoriálu se podíváme na bezplatný hosting GitHub.

Grafický editor
Na trhu je několik významných editorů. Některé z nich jsou specifické pouze pro jeden operační systém, jiné lze nainstalovat na kterýkoli z nich. V této části se podíváme na hlavní kroky, kdy návrhář rozvržení pracuje s online editorem Figma.

Samostatná práce
Doplňkové úkoly, které umožňují upevnit nabytou teorii

Doplňkové materiály
Články a videa kurátorem týmu Hexlet. Pomůže vám ponořit se hlouběji do tématu kurzu

Štítky cloud

Různé

Hodnocení

Zobrazení

Komentáře