Seniorní expert frontend designu

Pomáhám webům dýchat skrz fotografie

14 let ve světě responzivních galerií, lightboxů a optimalizace výkonu. Dnes vedu tým v GalerieFluid s.r.o. a učím ostatní, jak správně navrhnout galerii, která funguje na všech zařízeních.

Napsat mi zprávu Mé články

Jak to všechno začalo

Od prvních CSS layoutů k moderním galeriím

Začalo to na konci 2000. let. Měl jsem koníček — experimenty s CSS a JavaScriptem. Tehdy jsme se ještě učili Float layouty a kombinovali jQuery pluginy. Nikdo nevěděl, co dělá. A právě to bylo zajímavé.

Postupně jsem si uvědomil, že galerie nejsou jen o tom, aby se obrázky zobrazily. Je to o tom, aby se uživatel bez problémů procházel fotografiemi na mobilu, tabletu i desktopovém počítači. A když se člověk vrací k projektu za rok, chce si pamatovat, jak to funguje. To byl ten moment, kdy se galerie staly mojí hlavní doménou.

Na bakalářském oboru Informační technologie na ČVUT jsem se naučil fundament. Ale skutečné dovednosti jsem získal řešením desítek projektů pro české a evropské agentury. Každý projekt přinesl nový problém — jak optimalizovat výkon pro mobilní zařízení, jak implementovat lazy loading bez blikání, jak umístit popisky tak, aby se čitelnými a nenarušovaly композицию fotografie.

Od roku 2019 vedu vývoj vlastní platformy v GalerieFluid s.r.o. Není to jen o kódování. Je to o tom vytvořit nástroj, který ostatním usnadní práci. Věřím, že dobrý design galerie není sexy jen proto, že vypadá hezky. Je sexy, protože funguje.

let v designu a frontend vývoji

50+

projektů na galerie a lightboxy

let vedení týmu v GalerieFluid

Co dělám nejlépe

Speciality, které řeším každý den

Neučím teorii. Učím to, co funguje v praxi na skutečných webech pro skutečné lidi.

Responzivní mřížky galerií

Fluidní, adaptivní, elegantní. Mřížky, které se chují správně na 320 pixelech i na 2560 pixelech. Bez skákání obsahu, bez pixelových chyb, bez kompromisů.

Lightbox a fullscreen overlay

Otevření fotografie v plné velikosti bez toho, aby to bylo frustrující. Swipe navigace, klávesové zkratky, zachování pozice scrollu. Všechno to musí být hladké.

Lazy loading a optimalizace

Obrázky se načítají jen když je potřebuješ vidět. Správná velikost pro správné zařízení. Web, který se tváří chytře a není pomalý. To je podstata.

Popisky a typografie

Popisek pod fotkou není dekorace. Je to důležitá část obsahu. Jak jej umístit, jakou použít barvu, jak ho dělat čitelným bez toho, aby se ztrácelo v pozadí obrázku.

Mobilní-první přístup

Začínáme od mobilu. Vždy. Desktop je jen rozšíření. Galerie, která funguje na telefonu, bude fungovat všude. Opačně to není pravda.

Přístupnost a WCAG

Galerie, kterou nemůžou používat lidé s poruchou zraku nebo tělesným postižením, je prostě špatná galerie. Alt texty, klávesová navigace, správný kontrast. To není volba.

Filosofie práce

Čím věřím a jak pracuji

Fotografie jsou star

Galerie není o designu. Galerie je o tom, aby fotografie vypadala skvěle. Veškerý design slouží fotografiím — neměl by jim konkurovat. Když navrhuji galerii, myslím na to, aby se obrázky mohly vyjádřit plně.

Výkon není možnost

Pomalá galerie je špatná galerie. Neměl by jsem se bavit o “optimalizaci” jako o něčem extra. Je to základní povinnost. Lazy loading, správná komprese, WebP formáty — to všechno musí být automatické.

Jednoduchost vítězí

Nejlepší galerie nejsou ty s nejvíce efekty. Jsou to ty, které uživatel pochopí bez návodu. Swipe, klikni, zavři — hotovo. Neměl bych uživatele nutit přemýšlet.

Všichni uživatelé se počítají

Někdo bude procházet galerii na starém Androidovi, někdo na iPadu, někdo bude mít pomalý internet. Všichni by měli mít stejný zážitek. Pokud někomu nefunguje, nefunguje všem.

Co právě teď píšu

Články o tom, co dělám

Sdílím svoje poznatky z praxe. Ne teoretické články. Věci, které jsem řešil na skutečných projektech.

Vytvoření fluidní mřížky fotografií

Jak navrhnu mřížku, která se hladce adaptuje na jakoukoliv šířku obrazovky bez přerušování obsahu. CSS Grid vs. Flexbox, AspectRatio a Clamp funkce.

Lightbox overlay a fullscreen zoomování

Otevření fotografie v plné velikosti bez ztráty vzhledu. Swipe navigace, klávesové ovládání a jak správně blokovat scroll stránky bez chybovosti.

Líné načítání obrázků a optimalizace výkonu

Načítej obrázky až když je uživatel potřebuje. Intersection Observer API, správná velikost pro správné zařízení a jak měřit skutečný výkon.

Strategie umístění a designu popisků

Popisek pod fotkou nebo nad ní? Jakou barvu a velikost? Jak zajistit čitelnost bez toho, aby se ztrácel v pozadí obrázku a nesnižoval jeho dojem.

Máš projekt s galerií?

Pomůžu ti ji správně navrhnout. Nebo ti ukážu, jak ji udělat sám. Bez mlhavých slibů — jen praktické řešení.

Napsat mi zprávu