Pouze tento týden sleva až 80% na e-learning týkající se Kotlinu. Zároveň využij akci až 30 % zdarma při nákupu e-learningu - Více informací.
Hledáme nové posily do ITnetwork týmu. Podívej se na volné pozice a přidej se do nejagilnější firmy na trhu - Více informací.
discount week 30

Responzivní webdesign - Online kurz

V tomto kurzu najdeš lekce zaměřené na tvorbu moderního webu s tzv. responzivním designem, tedy stránek, které se budou vhodným způsobem zobrazovat na všech možných zařízeních. Dozvíš se také, co jsou to přístupy mobile-first či desktop-first.

13 lekcí

1 vědomostních testů

Certifikát absolventa

Proč se zabývat responzivním designem?

Více než polovina lidí, jež se dnes připojují na různé webové stránky, tak dělá přes mobilní zařízení. Zdaleka tedy už nestačí, abychom při vytváření webových stránek mysleli na uživatele PC a doufali, že to na mobilu bude "jakž takž čitelné". Chceme, aby naše stránka vypadala dobře na jakémkoliv zařízení. Stránka musí vypadat dobře mobilu, který je menší a na výšku, na tabletu, na malém notebooku i velkém monitoru u stolního počítače. Doba, kdy bychom takovou výzvu řešili vytvářením dvou variant týchž stránek je také pryč. Proč si koneckonců přidávat práci? A proto chceme od počátku vytvářet stránky, které budou svým rozložením a vzhledem přizpůsobivé, vždy dobře čitelné, přehledné a úhledné. Nejjednodušší cesta k porozumění, jak se takový web tvoří, je přitom přes následující lekce.

Co tě tento kurz naučí?

Pro tento kurz se předpokládá, že budeš už umět základy HTML a CSS. K nim kurz přidává novou a velmi důležitou dovednost, a to sice používat tyto značkovací jazyky moderním a správným způsobem, díky čemuž budou výsledné stránky vizuálně příjemné a uživatelsky přívětivé na každém zařízení, nehledě na jeho rozměry a rozlišení. Takovému webdesignu se říká responzivní a právě v prvních lekcích se dozvíš více k tomuto pojmu i k tomu, proč je dnes důležitý. Hned z kraje se přitom dozvíš, co jsou tzv. mobile-first a desktop-first přístupy a proč je dnes více preferován první zmíněný. Díky ukázkám a srozumitelnému vysvětlení se dozvíš, jak takový mobile-first design vytvářet.

Dále přikročíme k praktickým věcem. Základem je přitom vytváření responzivního menu, které slouží k základní orientaci návštěvníka po webové stránce a se kterým se dnes setkáme na prakticky všech moderních webech. Budou ti ukázány různé podoby, jaké takové menu může mít, součástí pak jsou i tipy k jeho vizuálnímu ozvláštnění. V následujících lekcích se dozvíš o responzivním formátování obrázků. Nechceš přeci, aby se kupř. fotografie, grafiky nebo třeba screenshoty objevovaly na počítači příliš malé či na mobilu přetékaly za okraj obrazovky. Rovněž si řekneme, jak docílit toho, aby se obrázky ze serveru nenačítaly příliš dlouho.

Následně se dozvíš, co to jsou tzv. gridy a jaké jsou dva nejznámější. Těmto je věnována pozornost v závěru kurzu. Po jeho dokončení budeš bezpečně vědět, co je to responzivní web a jaké jsou jeho zásady, díky čemuž bude jakýkoliv tvůj webový projekt vypadat moderně. Samozřejmostí je ovšem také možnost absolvování kvízu, za nějž obdržíš certifikát.

Budeš-li se chtít responzivním webem zabývat dále a podrobněji, je zde kurz přímo zaměřený na framework Bootstrap. Pokud tě bude všeobecně zajímat vizuální oživení webu, můžeš pokračovat v kurzech CSS3, kde se mimo CSS styly probírají také CSS animace, HTML5 či třeba grafiky v Photoshopu.

Lekce

-15% Cena: 175 Kč 150 Kč (60 bodů)

Začít kurz zdarma Koupí PRO verze kurzu získáš trvalý přístup k lekcím, cvičením a testům označeným štítkem PRO

Hotové responzivní komponenty

Responzivní menu SogoCZE
Vydáno: 2015
 1 197x


 

Aktivity