webspecialista.cz Pluginy, šablony, recenze, návody – prostě vše ze světa WordPressu

CSS moderní layout: Kniha, která nesmí chybět ve vaší dev knihovně

C

Mám rád knihy a nebojím se to přiznat (a klidně mě označte za knihomola, nevadí mi to). A nejvíc mám rád ty, které mě něco naučí a je s nimi sranda. Jasně, mezi kodéry a front-endisty moc zábavy nenajdete, protože všichni bereme svou práci táááááák strašně vážně. Nicméně u knihy CSS moderní layout jsem se přesvědčil, že humor (nenásilně vložený) a vývoj webů jde spojit dohromady.

Kniha CSS moderní layout vám vysvětlí pojmy jako grid, flexbox nebo layout. Stačí ji otevřít
Upoutávka na knihu CSS moderní layout

A co že mě na knize tolik pobavilo nebo donutilo zavzpomínat si na své kostkovaně košilaté rande s hárem před prvními láskami svého dospívání? Hned v úvodu vás Martin zavede do počátků návrhu layoutů stránky a s pomocí malé seznamky vás krátce seznámí s dobou, kdy se layouty tvořili s pomocí tabulek a v rádiích nám hráli Depeche Mode nebo Nirvana jako novinky letních hitparád. A to vás přece jenom donutí k úsměvu na tváři a vzpomínkám na to “své mládí”.

A to je docela příjemné, ne? Jenže to vás samozřejmě nic nenaučí a už vůbec vám nevysvětlí, co že to vlastně layout je a proč o něm musela vzniknout celá kniha. Pojďme si to tedy vyjasnit.

Co je to layout?

Laicky řečeno, jsou to kusy kódu, které tvoří strukturu stránky. Je to směs příkazů, které prohlížeči říkají, kde se v struktuře stránky nachází záhlaví/zápatí webu a ostatní důležité prvky obsahu. A ve spojení s CSS pak samotnému prohlížeči návštěvníka webu říkají, kde a jaký prvek v okně zobrazit.

Tuto strukturu si v samotné prohlížeči může běžný uživatel sám prohlédnout. Ale klasickému uživateli internetu, který si čte ranní zprávy nebo kontroluje příchozí poštu nebude takto zobrazený kód nic říkat. Je to jako nahlédnout do motoru auta bez znalosti o tom, kde je svíčka nebo rozvody pro blinkry.

Pro koho je kniha CSS moderní layout určena?

Z výše uvedených důvodů je tedy kniha určena především kodérů a vývojářům, kteří mají psaní kódu v malíku a vědí, co zkratky grid, flexbox a multicol znamenají. A přirozeně by neměla chybět v knihovně ani těm, kteří o těchto zkratkách ví, ale neznají podrobnosti o jejich používání v dennodenní praxi kodéra.

Obsah kapitol

Když jsem knihu CSS Moderní layout poprvé otevřel, překvapila mě počtem stran a svou komplexností. V knize je 440 stran, které jsou naplněny nejen praktickými příklady, náhledy layoutů ale i skvělými souhrny na konci každé kapitoly, které vám ujasní (a mnohým i připomenou), o čem jste v dané kapitole četli.

Kapitola 1: Začínáme s layouty

V první části je již zmíněný historický exkurz a ještě vtipnější seznamka. Ne se sličnými dívkami, ale historií vývoje webů/layoutů. Autor přidal i krátkou historii CSS layoutů.

Kapitola 2: Layoutové dotazy

Tady se seznámíte s důležitou částí návrhu layoutů – Media Queries. Je na místě zmínit se o novince s podobným názvem – Container Queries, která zatím není tolik podporována v prohlížečích a implementace je v plenkách. A do třetice všeho, No Queries.

Kapitola 3: Příklady použití

Zatím co v předchozích kapitolách byla důležitá teorie, v třetí kapitole se vrhnete do ještě důležitější praxe. Užijete si pojmy jako svatý grál mezi layouty (kdo by ho neznal, že..), nebo layouty s bočním panelem, případně “Pancake Stack” (velká kupa lívanců). A hlavně nezapomeňte na Bootstrap.

Jako praktické příklady jsou uvedeny formulář pro vyhledávání, responzivní galerie nebo galerie bez Media Queries.

Kapitola 4: Flexbox

Ve čtvrté kapitole najdete první referenční příručku. Jak název napovídá, jedná se o flexbox a dozvíte se detaily vlastností flexboxu a vše, co by jste si o něm měli pamatovat. Pokud již flexbox znáte, můžete tuto kapitolu klidně vynechat.

Kapitola 5: Grid

Druhou referenční příručku najdete v páté kapitole a na téma grid. Jak sám autor uvádí, bere to hodně dopodrobna, takže očekávejte opravdu detaily. A pro větší zapamatovatelnost je dobré rovnou zkoušet i ukázky z praxe v aplikaci CodePen, které autor k tématu přichystal.

Kapitola 6: Vícesloupcový layout

Třetím typem layoutu je ten s více sloupci, který vyniká především v sazbě textu a obrázků. Jak jinak taky, když právě pro tohle byl navržen.

Kapitola 7: Zarovnání boxů

To, bez čeho se žádný návrh layoutů neobejde, je zarovnávání boxů, což je obsahem sedmé kapitoly. Tuto techniku znají především znalci flexboxu, protože právě odtud pochází. Nakonec byla ale natolik rozšířena, že ji lze použít mnohem šířeji. Je jen škoda, že podpora v prohlížečích je tak malá.

Kapitola 8: Co ještě vědět?

V osmé kapitole se dozvíte spoustu doplňujících informací o nástrojích, které každému kodérovi pomůžou při jeho práci. Dozvíte se informace o podpoře CSS v prohlížečích, zjistíte, jak je to s rychlostí webů a přístupností webů.

A konečně dostanete odpověď na to, jak to je teda s tím Internet Expolorerem. Fakt už je mrtvý?

Kapitola 9: Související nástroje a vlastnosti

Poslední kapitola je opravdu doplňující. Je to kapitola ve stylu “Co se jinam nevešlo” a zkušení matadoři na poli vývoje ji mohou vynechat. my, méně zkušení, si ji v některých částech prostudujeme během čtení knihy, protože na ni v některých kapitolách “vedou odkazy”.

Najdete zde různé vlastnosti CSS. Třeba používání různých jednotek, jako jsou %, em, rem atd a přímé uvedení, kdy a jak tyto jednotky používat. Díky za to!

Jak vidíte z nadpisů jednotlivých kapitol, kniha je nabušená nejen díky její teorii, ale taky díky příkladům z praxe, které Martin během své praxe vyzkoušel.

A pokud se ptáte, zda má kniha i nějaký mínus, pak říkám ano, i když je to sporný a subjektivní. Kniha je natolik nacpaná informacemi, že se nedá přečíst “jedním dechem”. A není to kniha do kapsy, protože je prostorná a tlustá (zde je na místě připomenout, že existuje i v elektronické verzi).

Kdo je autor Martin Michálek?

Martin není žádné ořezávátko, které vám v kanclíku nabrousí tužku k poznámkovému bloku, ale profesionální webový expert s dvacetiletou praxí. Kromě poradenství pro zlepšení rychlosti načítání webů (pod projektem pagespeed.cz) píše příspěvky pro svůj blog Vzhůru dolů. Tam si také můžete koupit jeho předchozí knihy (o technologii AMP nebo referenční příručku o CSS), nebo koupit několik návodných videí s tématikou kódování/optimalizace rychlosti webů.

Závěrem pár slov

Takových knih pro kodéry a front-endisty v česku nevzniká mnoho. Nakladatelé v tom nevidí smysl a výdělek, protože informace rychle zastarávají a knihu nelze aktualizovat jako článek na internetu. Proto většina z nás musí zapojit angličtinu (ne že by to byl problém) nebo navštívit kurzy, abychom se dozvěděli víc o kodéřině a moderních postupech.

Proto je kniha CSS moderní layout skvělou příležitostí, jak se vzdělávat v rodném jazyce a bez toho, aby jste stále museli vyhledávat na Google a “zírat” do modře zářícího monitoru. Jděte do ní, stojí zato.

Obálka knihy CSS moderní layout ve své plné kráse.
Obálka knihy
  • Název knihy: CSS moderní layout
  • Autor: Martin Michálek
  • Počet stran: 440
  • Počet praktických ukázek: 170
  • Rok vydání: 2022
  • Formát: tištěná (plnobarevná), e-book (EPUB, MOBI a PDF)
  • Cena knihy: kompletní balík (tištěná + ebook) – 899 Kč

A jaký máte názor na knihu vy? Četli jste ji? Líbí se vám, nebo vám v ní něco chybí? Dějte mě a autorovi vědět do komentáře. Zajímá nás váš názor. A pokud vás zajímá další obsah blogu, přihlaste se k odběru newsletteru.

10

CSS moderní layout

Kniha je nabušeným průvodcem pro všechny, kteří si chtějí oprášit své znalosti o moderním návrhu layoutů webů.
Ukázkovou kapitolu knihy si můžete stáhnout na stránkách autora

PS: Tato recenze byla sepsána po domluvě s autorem a následným darováním recenzního výtisku.

A pokud by jste potřebovali poradit s vašim WordPress webem, najdete mě na sociální síti LinkedIn nebo jako administrátora ve skupině WordPress CZ/SK – Lekce pro začínající uživatele. Nebo mi jednoduše napište zprávu přes kontaktní formulář.

O autorovi

Miroslav Bartík

Jmenuji se Miroslav Bartík a jsem tvůrce, editor a administrátor webů na redakčním systému WordPress. Kromě tvorby webů a jejich administrace mě baví běh a občasné hraní her. Mám rád zelený čaj a dobrý film.

Přidat komentář

Tato stránka používá Akismet k omezení spamu. Podívejte se, jak vaše data z komentářů zpracováváme..

webspecialista.cz Pluginy, šablony, recenze, návody – prostě vše ze světa WordPressu

O autorovi

Miroslav Bartík

Jmenuji se Miroslav Bartík a jsem tvůrce, editor a administrátor webů na redakčním systému WordPress. Kromě tvorby webů a jejich administrace mě baví běh a občasné hraní her. Mám rád zelený čaj a dobrý film.

Kategorie blogu

Štítky

Instagram