Zobrazení webu Czechia2026, pro full HD, notebook, tablet a mobil
Zaměření webu: 

Když Česká republika získala roli čestného hosta (Czechia2026) na Frankfurtském knižním veletrhu 2026, Moravská zemská knihovna potřebovala web, který důstojně představí českou literaturu mezinárodnímu publiku.

Výsledkem je komplexní prezentační platforma s pokročilými filtry a vyhledáváním, třemi jazykovými verzemi a stovkami akcí rozložených do tří programových celků. Web spojuje technické řešení s vizuální identitou projektu - včetně charakteristické animované vlny, která doprovází navigaci.

Zadání

Web má sloužit jako hlavní informační zdroj pro knižní profesionály, média i širokou veřejnost z celého světa.

Klíčové požadavky projektu:

  • Prezentace autorů pozvaných na veletrh, jejich knih přeložených do němčiny a překladatelů.
  • Komplexní kalendář akcí rozdělený do tří programových celků: Rok české kultury (před veletrhem), Frankfurt 2026 (hlavní program) a ECHO (akce po veletrhu).
  • Tři plnohodnotné jazykové mutace (čeština, němčina, angličtina).
  • Pokročilé filtrace a vyhledávání napříč všemi sekcemi.
  • Postupné spouštění webu v několika fázích podle přípravy obsahu.
  • Moderní design s charakteristickou animovanou vlnou z vizuální identity projektu.

Webdesign vytvořilo grafické studio Bušek+Dienstbier. Mým úkolem byla technická realizace - převedení návrhu do funkční webové aplikace s důrazem na výkon, použitelnost a snadnou správu obsahu pro několik editorů.

Řešení

Organizace obsahu pomocí Custom Post Types

Projekt vyžadoval strukturovanou prezentaci různých typů obsahu s vazbami mezi nimi. Pro každou kategorii jsem vytvořil vlastní typy příspěvků se spoustou políček (ACF) pro snadné plnění obsahem.

Autorstvo a Překládající - profily s medailonky, fotografiemi a seznamy děl. V medailoncích se zobrazují akce, na kterých vystoupí (svázané se stránkou program).

Na obou stránkách je textové vyhledávání.

Současné knižní překlady do němčiny - databáze knih přeložených do němčiny v letech 2024–2026. Každá kniha obsahuje informace o autorovi, překladateli, českém a zahraničním nakladateli včetně odkazů na jejich e-shopy.

Knihy se dají filtrovat podle roku vydání, žánru a textového vyhledávání.

Dramaturgická rada a Tým - členové dramaturgické rady a organizačního týmu. Jednodušší struktura s fotografií, medailonkem a kontakty.

Tým Czechia2026 pro čestné hostování na knižním veletrhu ve Frankfurtu nad Mohanem
Czechia2026 - nakladatelství - pro čestné hostování na knižním veletrhu ve Frankfurtu nad Mohanem

Nakladatelství pro Frankfurt ve formě jmenného rejstříku s vyhledáváním.

Každá jazyková mutace má synchronizovaný obsah s možností drobných lokalizačních úprav podle cílového publika.

V menu je také fulltextové vyhledávání napříč webem.

Pokročilý systém filtrace programu

Program – nejkomplexnější stránka s bohatou strukturou ACF polí. Každá akce obsahuje datum a čas, typ akce (čtení, divadlo, výstava, koncert, debata, přednáška, festival a další), místo konání, vystupující autory (jako vazbu na jejich medailonky) a externí účastníky (textové pole se středníkem jako oddělovačem). Každá akce generuje odkaz pro přidání do Google Calendar.

Program akcí představoval největší technickou výzvu. Stovky událostí rozložených do tří časových období (Rok české kultury, Frankfurt 2026, ECHO) vyžadovaly intuitivní rozhraní pro orientaci.

Vytvořil jsem AJAX filtrační systém se čtyřmi současně fungujícími kritérii:

  • Typ akce - rozbalovací roletka (select) s možností výběru mezi čtením, divadlem, výstavou, koncertem, debatou, přednáškou a festivalem atp.
  • Vystupující - dynamicky generovaný seznam všech autorů z databáze i externích účastníků, abecedně seřazený a cachovaný (aktualizuje se při publikování nebo změně akcí v programu).
  • Datum - kombinace select boxů a Flatpickr kalendáře pro přesný výběr časového rozsahu.
  • Lokace - filtrování podle místa konání, která si vkládají copíci projektu.

Nad rámec těchto filtrů je checkbox „pouze aktuální", který automaticky skrývá proběhlé akce. Všechny filtry fungují společně - uživatel může například najít všechna čtení s konkrétním autorem v Berlíně v určitém období.

Technická implementace využívá:

AJAX načítání - změna jakéhokoli filtru okamžitě aktualizuje výpis akcí bez přenačtení stránky. Request obsahuje všechny aktivní filtry a vrací pouze relevantní výsledky.

  • URL tracking - stav filtrů se ukládá do URL parametrů. Uživatelé mohou sdílet odkaz na konkrétní filtrovaný výpis. Při načtení stránky se filtry automaticky nastaví podle URL.
  • Inteligentní paginace - při procházení stránek se zachovávají všechny aktivní filtry. Odkazy na stránkování obsahují URL parametry filtrace, takže uživatel nepřijde o nastavení.
  • Vzájemné vylučování s vyhledáváním - při použití vyhledávání se filtry resetují a naopak, aby nedocházelo k matoucím kombinacím.
  • Podobný filtrační systém jsem v jednodušší podobě implementoval i na stránkách autorstva, překládajících a současných překladů - všude s AJAX načítáním a zachováním uživatelského nastavení.

Animovaná vlna v menu

Vizuální identita projektu Czechia2026 pracuje s motivem vlny - odkazem na slogan projektu "země na pobřeží". Grafický návrh počítal s animovanou vlnou v navigačním menu, která musela fungovat plynule bez zatížení webu.

Implementoval jsem java script animaci, kde se tvar vlny počítá jakou součet několika sinusovek - vlna tak není statický SVG soubor, ale dynamicky generovaná křivka. Po každém sjetí/vyjetí menu se generuje trochu jiný průběh animace.

Navigační systém a přístupnost

Menu webu má víceúrovňovou strukturu - hlavní položky obsahují několik úrovní vnořených podnabídek. To vyžadovalo pečlivé řešení ovládání a přístupnosti:

  • Různé chování podle zařízení - na desktopu se submenu otevírá při najetí myší (s 300ms timeoutem proti náhodnému otevření), na mobilech vyžaduje kliknutí. Detekce probíhá podle dotykových schopností zařízení.
  • Klávesová navigace - kompletní podpora ovládání šipkami nahoru/dolů pro procházení položek, Enter pro otevření/aktivaci a Escape pro zavření menu. Správně nastavené ARIA atributy pro čtečky obrazovky.
  • Automatické zavírání - menu se zavře při scrollování (na desktopu) nebo kliknutí mimo navigaci, aby nepřekáželo prohlížení obsahu.

Optimalizace výkonu

S velkým množstvím java scriptu pro animace, filtraci a navigaci bylo kritické zajistit, aby se načítal pouze tam, kde je potřeba.

Web jsem postavil na WordPress s Oxygen Builderem (nástroj pro vizuální stavbu stránek). Pro snadné a rychlé plnění webu obsahem jsem v administraci připravil řadu vlastních typů příspěvků s vyplnitelnými políčky. Copíci se tak starají jen o plnění webu obsahem a ten se dynamicky zobrazuje na webu.

Vícejazyčnost řeší Polylang, který vytváří oddělené verze každý typ příspěvku. Jazykové verze jsou čeština, němčina a angličtina.

Export akcí do Google Calendar řeším přes speciální formát odkazu - není potřeba žádná knihovna, pouze správně sestavený URL string s parametry události.

Výsledek

Web Czechia 2026 byl spuštěn postupně v několika fázích:

  • Únor 2025 - nultá verze s jednou statickou stránkou informující o projektu.
  • Květen 2025 - první fáze se statickými stránkami.
  • Červen 2025 - spuštění dynamických částí: program akcí s pokročilou filtrací, databází autorů a překladatelů, současné překlady. AJAX filtrace plně funkční napříč všemi sekcemi.
  • Červenec 2025 - dokončení všech tří jazykových mutací, doladění překladů a finální optimalizace výkonu.

Čtrnáct dní před hostováním (23. září 2026) web obsahuje obsahuje:

  • Skoro 400 akcí desítky akcí (x3 jazyky).
  • 75 medailonů autorů (x3 jazyky).
  • 34 překládajících (x3 jazyky).
  • Skoro 250 novinek (x 3 jazyky).
  • 192 knih přeložených do němčiny.
  • 38 nakladatelství.
  • 20 grantů/možností podpory.
  • 100 partnerů.

Moravská zemská knihovna získala moderní prezentační platformu, která důstojně reprezentuje českou literaturu v mezinárodním kontextu. Copíci přidávají nový obsah přes intuitivní WordPress rozhraní s ACF poli. Návštěvníci se orientují díky pokročilým filtrům a vyhledávání.

Web běží na mém vlastním VPS, kde blokuji útoky, které na web míří a postupně se zvyšujícími se nároky (návštěvností) mu přidávám výpočetní výkon.

Potřebujete web pro kulturní instituci nebo mezinárodní projekt?

Pokud hledáte web s pokročilými filtracemi, strukturovanou prezentací obsahu nebo vlastními funkcemi nad rámec standardních šablon, rád vám pomůžu s realizací.

Kontaktujte mě a probereme váš projekt.

linkedin facebook pinterest youtube rss twitter instagram facebook-blank rss-blank linkedin-blank pinterest youtube twitter instagram