Text vyšel původně na autorově blogu.

Autorem knihy Vzhůru do (responzivního) designu je Martin Michálek, významná osobnost české frontendové scény. Martin je specialista na CSS a responzivní design. Aktivně píše na svém blogu Vzhůru dolů, spoluzaložil a vede spolek Frontendisti.cz. Je také autorem e-booku Vzhůru do CSS3.

Cílová skupina

Martin hned v úvodu přiznává, že jeho původním záměrem bylo vytvořit technickou příručku pro kodéry. Záhy ale zjistil, že psát o technologiích a zamlčet jejich vazbu na design je v případě responzivního designu nemožné. Vypůjčím si jeho slova:

HTML, CSS a design jsou zrátka spojené nádoby. Jsou to odvětví, která spolu úzce souvisí a musí se doplňovat.

Vznikla tak publikace, která na 272 stránkách nabízí množství praktických ukázek a rad. Oslovit by měla širokou škálu čtenářů. Primárně je psaná pro kodéry, kteří využijí největší část knihy. Získají zde přehled o postupech a technologiích používaných pro tvorbu dnešních responzivních webů. Čerpat z knihy mohou však i designeři, grafici a marketéři. Pro ně jsou naopak určeny texty týkající se statistik, návrhu rozhraní a responzivních navigací.

Pokud občas čtete Martinovy články, jistě poznáte jeho rukopis. Martin si moc nepotrpí na košatá souvětí. Má rád jednoduché věty a přímá sdělení. Texty sem tam doplní svým osobitým humorem. To je přesně jeho styl. V podobném duchu je i celá tato kniha. Díky tomu, že jsou texty značně zjednodušené, měla by být kniha snadno stravitelná i pro začátečníky, kteří se k tvorbě webů dostali teprve nedávno.

Pokročilejší čtenář může být zklamaný, když zjistí, že složitější techniky a nástroje nejsou v textu příliš rozebírány. Je to tak trochu daň za veliké zjednodušování. Na podrobnější zdroje je ale vždy odkazováno. Je ponecháno na čtenáři, zda si sám bude chtít nastudovat podrobnosti. Podle mého názoru to ničemu nevadí, ba naopak. Kniha se o to snadněji čte, lépe se v ní orientuje a každý čtenář si tak přijde na své.

Oblasti, kterým se kniha věnuje

Kniha se postupně dotýká celé řady témat, se kterými by měl přijít do styku každý dnešní web v průběhu svého vývoje. Obsah je rozdělen do následujících kapitol:

1. Úvod do tvorby webu
2. Dokument jako základ
3. Viewport na mobilech
4. Rychlost načítání
5. Obrázky a další média
6. Návrh rozhraní v éře mobilů
7. Design komponent rozhraní
8. Media queries a layout
9. Responzivní navigace
10. Testování responzivních webů

Kniha s vlastním dějem

Do knihy se podařilo dostat zajímavou dějovou linku. Martin zde popisuje, jak by budoval pomyslný eshop s outdoorovým vybavením ForestKid.cz. Jednotlivé kroky začíná návrhem uživatelského rozhraní. Čtenáři radí, jak se neunáhlit a neskočit rovnou na kódování jednotlivých částí. Společně tak procházíme jakousi výzkumnou fází projektu. V dalších kapitolách směřujeme k tvorbě samotného dokumentu a po částech budujeme produktovou stránku eshopu. Výzkumnou fázi tak postupně nahrazují praktické části. Texty jsou navíc doplněny o příklady umístěnými na CodePen. Ukázky je tak možné si vyzkoušet přímo v prohlížeči.

Designování v prohlížeči

V knize vás může překvapit, že při budování ukázkového eshopu nedochází k přípravě grafických souborů designerem a k jejich následnému oživení v prohlížeči. Postup, který je zde použit, se nazývá designování v prohlížeči. Vytváříme nejprve hrubou kostru aplikace, kterou v několika iteracích zpřesňujeme a vylaďujeme do finální podoby. Cílem je, dostat obsah co nejdříve do prohlížeče a odhalit včas případné problémy při návrhu.

Martin je velkým propagátorem tohoto přístupu a hovořil o tom např. na WebExpo 2015. Jak však sám v knize uvádí:

„Není dobrého nebo špatného pracovního postupu. Důležitý je vždy výsledek.“

Je zde ale zřejmé, že při designování přímo v prohlížeči se dobře vysvětlují principy responzivního designu.

Celkové dojmy

Ze Vzhůru do (responzivního) webdesignu jsem opravdu nadšený. Na řadě knih o webdesignu mi vadilo, že buď postrádají dostatek praktických ukázek nebo ukázky nepřináší nic nového. Opakují věci, které jsou zkušenějším kodérům známé. Martin jde o trochu dál. Jako bonus nabízí čtenářům vlastní know-how. Abyste pochopili, co tím myslím, zde je jeden příklad:

V knize najdete odkaz na zátěžový test typografie. Jedná se o připravený dokument obsahující všechny myslitelné i nemyslitelné HTML elementy, které mají různou délku a jsou do sebe různě zanořené. Jako kodér si ho můžete stáhnout, přidat k němu vlastní CSS a snadno tak otestovat, zda jste ve vašem stylopisu na nic nezapomněli. Je to děsně jednoduché a ušetří to práci. I já jsem už tento zátěžový test ve svém projektu použil.

Ze začátku čtení jsem měl trochu obavu, aby celá kniha nepůsobila jako referenční příručka. V první půlce knihy je v textech často odkazováno na témata, která se teprve budou probírat v následujících kapitolách. Navíc zde nacházíme množství odkazů na články umístěné na blogu. Musím ale uznat, že jak jsem pokračoval ve čtení, přestal jsem toto naprosto vnímat. Jakmile jsem měl pocit, že bych si potřeboval víc nastudovat, použil jsem odkaz a přešel na blog Vzhůru dolů. Zde je krásně vidět, jak se Martinovi zúročuje jeho intenzivní psaní článků z posledních let, kterými pokrývá různá témata z oblasti webdesignu.

Přeci jen musím zmínit jednu oblast, která by podle mého názoru zasloužila větší pozornost. Jedná se o přístupnost při psaní dokumentu webu. V knize sice najdete zmínky o použití HTML5 tagů a WAI-ARIA atributů. Dočtete se, že dodávají sémantickou informace a můžou pomoci např. zrakově hendikepovaným v lepší orientaci na webu. Tím zde popis končí a čtenář je pro bližší informace odkázán na blogový článek. Nějaká drobná kapitola na toto téma by se hodila. Kdo ví, třeba se v budoucnu dočkáme dalšího pokračování.

Pár slov závěrem

Kniha se podle mě opravdu povedla. Snadno se čte a jedná se o cenný zdroj informací nejen pro kodéry, ale i další lidi figurující v procesu budování webu. Místo v mé knihovně zatím ještě nezabere. Ale jen z toho důvodu, že by se tam na ní zbytečně prášilo, a tak ji nosím při sobě a v případě potřeby do ní nahlédnu. Pokud uvažujete o nějaké formě sebevzdělávání v oblasti webdesignu, mohu vám ji vřele doporučit.

Pokud máte s knihou podobnou (nebo odlišnou) zkušenost, podělte se o ni v komentářích.

Údaje o knize

Název: Vzhůru do (responzivního) webdesignu
Autor: Martin Michálek
Počet stran: 272
Rok vydání: 2017
ISBN: 978-80-88253-00-6
Vydal: autor vlastním nákladem (knihu nenajdete v obchodech, koupíte ji jen u autora)
Formát: Brožovaná i e-kniha
Ukázky z knihy: vzhurudolu.cz