Poznámky z WebExpo 2018: AMP, variabilní fonty, performance a spousta dalšího

Pár stručných zápisků z letošního ročníku WebExpo.

Moje přednáška o AMP

Velmi stručně o tom, proč AMP potřebujeme a jak AMP funguje:

• Kdo AMP v Česku používá: Ukázky od Alza.cz, Relaxos, Cuketka.cz a dalších. Občas i čísla.
• AMP je super pro obsahové stránky webů v oborech, kde je vysoká konkurence a obsah není až tak unikátní.
• Nasazujte AMP tak, abyste z něj využili co nejvíce – tedy i komponenty.
• Nedělejte dvě verze webu – designérsky ani funkčně.
• Až AMP nasadíte, nezapomeňte ho dobře měřit (AMPClientID v Google Analytics).
• Chcete AMP zkusit? Udělejte Split Test v Google Ads.
• Slajdy a odkazy k přednášce

Jan Charvát: Variable fonts

Tematicky k věci, obsahově hodně nabušené a s nadhledem a nadšením odprezentované. Představte si, že namísto různých řezů a souborů s písmem máte jen jeden. Varianty jsou v něm uložené tak, že se matematicky odvozují z „master“ křivek. Počkejte si na video nebo nějaký můj článek. Zatím pár poznámek:

• Varianty mohou být různé: Od „tučnosti“ přes optickou velikost až třeba ke stencil.
• Ušetří se tím datový objem, zredukuje počet souborů potřebných pro zobrazení webu.
• Je to ale pro designéry i vývojáře náročnější z pohledu potřebných typografických znalostí.
• Jde o formát woff2-variations. Kromě IE má skoro plnou podporu.
• Odkazy: AxisPraxis, v-fonts.com, Firefox 62 Font Inspector
• Web přednášky

Tim Kadlec: The Long-Tail of Performance

Pro mě samozřejmě nejužitečnější přednáška. Tim sypal tipy z rukávu rychlostí rychle jedoucí parní lokomotivy.

• Pokud sledujete rychlost svých uživatelů pomocí RUM metrik, soustřeďte se na 90. percentil, nikoliv medián nebo průměr. Prožitek uživatele s horším zařízením je obvykle děsný a snadněji s ním vylepšíte UX celé škály uživatelů.
• Nejrychlejší optimalizace obsahových webů font-display: fallback.
• FOIT vs. FOUT
• Font Style Matcher - porovnání systémových fontů s vlastními. Jaký systémový font vybrat jako fallback? Potřebuji vůbec vlastní font?
• Nespoléhejte u obsahových webů na JavaScript! Říkám to furt. Například: Chrome for Android may start disabling JavaScript on 2G connections
• S latencí bude potíž vždy. Dvouvteřinové čekání na request při cestování vlakem mezi Washingtonem a New Yorkem mluvilo za vše.
• Web přednášky

Co mě dále zaujalo?

• Dan Saffer: Jak designují Twitter tak, aby se mu (a společnosti) vedlo dobře. Pro mě nejlepší přednáška z kategorie „inspirace“, tedy neočekávané posuny v myšlení. A navíc – už zase věřím, že je Twitter rozvíjený s rozumem v hrsti.
• Vojtěch Mikšů o CSS v JS: Na začátku přednášky se ukázalo, že velká část přítomných nezná základní principy CSS – že rozhoduje pořadí v CSS kódu. Vzhledem k tématu dost příznačné. Pardon, ironie – ještě se k tomu doufám vrátím, abych vše vysvětlil. Na přednášku ještě jednou juknu ze záznamu, už jsem byl dost unavený.
• Behshad Behzadi o mluvících rozhraních: Actions on Google chápu jako napojení vašeho obsahu do Google Asistenta.
• Kinneret Yifrah o microcopy: Při psaní užíváme složitější tvary než v mluvení. Uživatelské rozhraní je třetí cesta. Bližší by měla ale být k mluvení.
• Michal Juhás o vzdělávání: Online kurzy mají průměrnou míru dokončení jen 15 procent. A  ještě – brzy vzniknou profese typu „education designer“ pro lidi, kteří budou navrhovat formu vzdělávání pro týmy a jednotlivce na míru.

Bylo toho daleko víc. Odborně jsem se pár věcí naučil, ale hlavně diskutoval se starými i novými známými a dostal hodně velkou dávku témat k přemýšlení. Takže díky organizátorům, spíkrům a všem, se kterými jsem se potkal. Zase za rok ahoj!