Webařina se rozrůstá a udržet krok se všemi technologiemi se již nějakou dobu nedá. Proto se člověk spíše specializuje. Já postupem času dospěl k názoru, že moje parketa je kódování, neboli frontend. Zkrátka to, co je vidět. Ne že bych na ostatní části nějak zanevřel a už se jim nevěnoval, ono to ani moc dobře nejde, protože všechny jsou provázány, ale už nejdu do takových podrobností a raději práci deleguji.

Frontend posledních dní úzce souvisí s responzivním zobrazením webů. Weby se snažím maximálně přizpůsobit mobilům, tabletům, desktopům, ale stále jsem si říkal, že by bylo fajn podívat se pod pokličku špičce v oboru u nás – Martinu Michálkovi – a něčemu se přiučit. Letos konečně k tomu došlo a já se vydal na jeho školení – Responzivní design. Jaké bylo? Komu je určeno? Čtete dále.

Školení se konalo v příjemném prostředí GreenPointu na Praze 10 – cca 2 zastávky od konečné metra Depo Hostivař. Maximálně 10 účastníků je tak akorát. Nás se sešlo 9, 1 nedorazil – jeho škoda. Většina účastníků byli lidé, kteří s responzivem chtěli začít a já v tu chvíli začal uvažovat, zda se Martin nebude věnovat jen úplným začátkům, tj. něčemu, čím jsem si prošel už poměrně dávno. Nevěnoval. Po úvodním seznámení na nás začal sypat jednu informaci za druhou a já kolikrát nestačil psát ani poznámky. Ostatně 5 listů A5 hustě popsaných hovoří za vše. Druhou otázku z úvodu tedy můžu s klidem zodpovědět: školení je vhodné jak pro úplné responzivní začátečníky, tak i pro pokročilé samouky, kteří hledají cestu, jak práci udělat lépe, jak se zdokonalit. Začátečníci si díky Martinovu workflow nemusí vyšlapávat cestu a mohou rovnou přejít k efektivní práci, pokročili si pak jen říkají, proč já to už dávno nedělám tak jako on, ušetřil bych si čas.

responzivni-design-2Školení je rozděleno na 12 částí – mobilní prostředí, principy RWD, fluidní média, media queries, layout, viewport, device-pixel-ratio, typografie, navigace, vektory, bitmapové obrázky a debugování. Na začátku jsme do ruky dostali desktopovou statiku, řekli si základy, a následně si na statice mohli jednotlivé body zkoušet. Přiznám se, že zkoušení jsem po chvíli vzdal. Když jsem se soustředil, co napsat do počítače, už jsem jaksi dál nevnímal rozšiřující informace. Ostatně většinu úprav jsem už v minulosti dělal, takže jsem neměl potřebu. Zkoušel jsem jen věci, které jsem viděl poprvé. Příkladem budiž automatická aktualizace provedených změn při psaní kódu. Již delší dobu pracuji s preprocessory a gruntem, který mi soubory kompiluje a rozdistribuje tam, kam potřebuji. Provedl jsem úpravu, v příkazové řádce zkompiloval, obnovil okno prohlížeče, zkontroloval změny. Díky Martinovi jsem si osahal automatizaci, kdy odpadá kompilace a obnovení okna. Nyní mi stačí mít v jednom okně editor kódu, v druhém okno prohlížeče a o nic víc se nestarat. Příkazová řádka běží na pozadí a stará se o vše potřebné. Okno prohlížeče se pravidelně aktualizuje. Úžasná věc.

Další informace, které mi dost pomohly, byly ty o typografii. Responzivní zobrazení jsem doteď bral jako vzhled, který se přizpůsobí dané obrazovce. Ono to tak docela není. Je to o myšlení, představení si, jak který uživatel s webem pracuje. Jde i o typografii, kdy jsou například definované doporučené počty znaků na danou šířku tak, aby se návštěvníkovi dobře četlo. Vím např. o zarovnání písma (na webu není vhodné zarovnávat do bloku, protože se to hůře čte), ale že pro desktop je doporučeno pro pohodlné čtení 66 znaků (min 45 – max 75) na řádku s výškou řádku 1.5 a pro mobil pak 40 znaků ( min. 35 – max. 50) s výškou 1.4 jsem nevěděl. A tak bych mohl pokračovat.

Co se mi maximálně líbilo, bylo upozorňování na zpětnou kompatibilitu. Martin ukázal nějaký prvek a následně hned ukázal, jaká je jeho podporovatelnost v prohlížečích. Pro lepší představu pak na 3 reálných webech ukázal procentuální zobrazení lidí, kteří s prvkem nemají problém.

Osobně tak včerejší školení hodnotím velmi pozitivně a mohu jej směle doporučit nejen začátečníkům s responzivním designem, ale i velmi pokročilým. Martin ze svého workflow (a že má co ukázat) ukáže opravdu hodně. Teď je na každém, jak informace využije. Já určitě.

 

Zaujal Vás článek? Informujte ostatní