NaviFlow Logo NaviFlow Kontaktujte nás
Kontaktujte nás

Profesionální navigace pro české weby

NaviFlow s.r.o. se věnuje designu a implementaci sticky navigací. Naše řešení zajišťují, aby se menu choval inteligentně — změní se při scrollování, objeví se když potřebujete, a nikdy nebude blokovat obsah stránky.

Moderní pracovní prostor webového designéra se zaměřením na navigační prvky

Práce s navigacemi, která se liší od normy

NaviFlow s.r.o. vznikla v roce 2019, když jsme si uvědomili, že české weby běžně řeší sticky navigace špatně. Buď jsou příliš robustní a zabírají místo, nebo jsou příliš jednoduché a neslouží skutečným potřebám uživatelů.

Začali jsme pracovat s malými českými firmami a agentury. Zjistili jsme, že nejsou potřeba složitá řešení — potřebují se inteligentní chování. Menu, které se změní při scrollování. Navigace, která se objeví, když se vrátíte nahoru. A prvky, které nebudou blokovat obsah, na který se chcete podívat.

Dnes máme v portfoliu přes 300 projektů. Pracujeme s webovými agenturami, e-shopem a corporate weby. A každý projekt nás učí něco nového o tom, jak by se měla navigace chovat.

Čtyři oblasti, které řešíme každý den

Není to jen o CSS a JavaScriptu. Jde o to pochopit, jak se navigace chová v reálném světě — na mobilu, na tabletu, při rychlém scrollování i když čeká uživatel.

Zmenšování headeru

Header, který se postupně zmenšuje při scrollování. Ušetří místo na obrazovce, ale zůstane funkční. Logo se změní, menu se zkrátí, ale klíčové prvky zůstanou přístupné.

Reveal-on-scroll

Navigace se schová při scrollování dolů a objeví se při scrollování nahoru. Užitečné pro mobily, kde každý pixel počítá. Uživatel si ji můžete vzít zpátky, když ji potřebuje.

Responzivní hamburger

Overlay menu na mobilu a tabletu. Nemá fixní výšku, kterou byste museli ošetřovat. Přizpůsobí se obsahu, zůstane čitelné a bude se snadno zavírat při kliknutí mimo.

Bez blokování obsahu

Sticky prvky se nikdy nebudou překrývat s důležitým obsahem. Obsah se posune, aby měl místo. A pokud je prvek zbytečný, schová se sám od sebe.

Řešení, která se testují v praxi

Neplánujeme navigaci na papíře a pak ji programujeme. Prototypujeme přímo v prohlížeči. Testujeme na různých zařízeních, různých rozlišeních a různých typech obsahu. Zjistíme, kde se menu chová špatně, a opravíme to.

Pracujeme s čistým JavaScriptem nebo React komponentami — podle toho, co váš web potřebuje. CSS je přesný, bez hacků. A kód je připravený na to, aby se snadno upravil, pokud se váš design změní.

Wichtig pro nás je, aby se navigace chovala stejně na Chrome, Firefoxu, Safarim i na Edge. Neděláme řešení, která fungují “jen na Chrome”. Musí fungovat všude.

Detailní pohled na vývoj navigačního kódu s testováním v prohlížeči

Co nás řídí při každém projektu

Máme několik jednoduchých principů. Nejsou to slogany — to jsou věci, které skutečně děláme.

Mobile first není slogan. Navigace se navrhuje pro mobil. Pak se rozšíří na tablet a desktop. Když to funguje na mobilu, bude fungovat všude.

Výkon není volba. Sticky navigace se musí chovat hladce. Když se menu trhá nebo lag, uživatel to pocítí. Optimizujeme JavaScript a CSS, aby bylo vše plynulé.

Přístupnost není doplnění. Menu musí být přístupné z klávesnice. Barvy musí mít dostatečný kontrast. Čtečky obrazovky musí pochopit strukturu. To všechno řešíme od začátku.

Dokumentace je samozřejmostí. Když vám odevzdáme projekt, dostanete kód, který můžete pochopit. A máme návody, jak ho upravit, pokud se váš design změní.

Důležité poznámky

Informace na tomto webu jsou určeny pro vzdělávací a informační účely. Obsahují obecný přehled technologií a přístupů k návrhu navigace. Každý projekt je jedinečný a skutečné výsledky závisí na specifických požadavcích vašeho webu, jeho struktuře a cílové skupině. Doporučujeme konzultaci s kvalifikovaným webovým vývojářem, aby se zajistilo, že zvolené řešení odpovídá vašim potřebám. NaviFlow s.r.o. nenese odpovědnost za aplikaci informací bez odborné asistence.