Ukázka realizace webu Happy Owl
Zaměření webu

Očekávání klientky

Klientka chtěla předat informace o svých lekcích a umožnit rezervace lekcí online, s co největší mírou automatizace.

Brand měla jasný, dle něj chtěla vytvořit web design. Stejně tak měla obsah - texty a brandové fotografie od Dany Štěpánové.

Stránky na webu

Web jsem vytvořil tak, aby klienty přirozeně provedl od prvního sběru informací až k rezervaci lekce. Informace jsou strukturované "pyramidově" - od nejdůležitějších k detailům. Na každé úrovni se návštěvník může rozhodnout, jestli chce vědět víc.

Tenhle přístup jsem podpořil vizuálně pomocí karet a sekcemi s jemně odstíněnými pozadími.

Vícejazyčný web jako základ pro mezinárodní publikum

Učíš-li češtinu cizince musí být tvůj web dostupný minimálně v angličtině. Pro řešení vícejazyčnosti jsem zvolil WordPress plugin Polylang, který nabízí skvělý poměr mezi funkcionalitou a jednoduchostí správy obsahu. Přepínání mezi jazyky jsem vyřešil elegantně přes vlaječku v hlavním menu (kromě vlaječek nabízí vlastní obrázky nebo texty).

Vždy vidíš jen jednu vlaječku - pro jazyk, do kterého můžeš přepnout. V české verzi tedy vidíš britskou vlaječku a po přepnutí do angličtiny zase českou). Žádné zbytečné prvky navíc.

Co mě na Polylangu baví nejvíc? Dává mi volnost v tom, jak budu s obsahem pracovat. Můžu mít:

  • V každé jazykové verzi totožný obsah.
  • Každou jazykovou verzi úplně jinou.

Druhý přístup se hodí když chceš návštěvníkům české verze vysvětlit něco jinak než návštěvníkům anglické verze.

Taky se to hodí u dvou jazyků, kde se dost liší délka jednotlivých slov - typicky třeba Němčina, kde je většinou potřeba původní design trochu “došťouchnout”, aby vypadal pořád dobře.

Nevýhodou je údržba dvou verzeí webu.

Polylang je zdarma, pokud na webu nemáš Woocomerce (plugin pro e-shop) a nepotřebuješ využívat pokročilé možnosti zobrazování URL, případně využívat automatické překlady (DeepL).

Menu a přepínač jazyků WordPress překladového pluginu Polylang
Přepínač jazyků
Řešení vícejazyčnosti na straně administrace
Správa jazykových verzí v administraci.

Jednoduché rezervace přes osvědčenou službu

Pro rezervace lekcí jsem zvolil externí službu Koalendar. Oproti konkurenci má jasnou finanční politiku - v základu je zdarma nebo za cca 2000 Kč/rok v plné palbě (platby Stripe, lepší branding, …).

Na Koalendaru si ceník minimalistického nastavení, ale se vším potřebným. Edit srpen 2026: Pro poslední weby používám WordPress plugin (viz tato případovka) - výhodou je vlastnictví dat, větší soukromí uživatelů a jednorázová platba.

Rezervace lekce je jednoduchá: klient/ka si vybere termín, čas, vyplní základní informace (jméno, e-mail), odsouhlasí podmínky a rezervaci potvrdí platbou kartou přes platební bránu Stripe. Stripe si bere 6,5 Kč fixně + 1,5 %. Nemusíš se ale s nikým handrkovat o ceně, připomínat platby… rozhodně za těch pár Kč stojí. Za to žádná virtuální asistentka pracovat 24/7 nebude. 😉

Dle daňařky poplatky za platební brány neuvádíš v přiznáních k identifikované osobě (jako třeba reklamy z FB, nebo platby za Mailerlite atd).

V Koalendaru jde i nastavit, co se má stát po úspěšné rezervaci - můžeš:

  • Klientovi poslat e-mail.
  • Přesměrovat ho na děkovací stránku, kde mu můžeš zobrazit další informace.
  • Odeslat webhook (internetová adresa, místo požadavku na odeslání webové stránky prohlížeči se vykoná nějaká akce). U Happyowl jsem nastavil, aby se webhook zachytil v n8n, zpracoval a odeslal do e-mailingového nástroj MailerLite, kde se spouští další automatizace.

Balíčky služeb

Pokud chce klient/ka využít výhodnější balíček více lekcí, domlouvá se už přímo s lektorkou na platbě převodem. Klient/ka pak dostane speciální kód, který vkládá do formuláře Koalendaru. S ním pak rezervuje lekce bez dalšího placení.

Systém je napojený na Google kalendář lektorky, takže vždy vidí skutečně volné termíny.

Rezervované lekce jdou přesouvat až do 24 hodin před začátkem lekce. Koalendar posílá automatické připomínky - 24 a 1 hodinu před lekcí. V potvrzovacím e-mailu klientovi/klientce přijde i odkaz na Zoom a odkaz na změnu termínu lekce.

Ceník a tlačítko na rezervaci lekce
Happyowl - Cesta klienta
Výběr data a času lekce v rezervačním systému Koalendar
HappyOwl - Koalendar

Přehledná cesta k rezervaci lekce

U nabídky individuálních lekcí byla největší výzvou struktura rezervace lekce a cesta klienta/ky. Klientka ve svých poznámkách k webu mezi tím nerozlišovala. Když jsem informace roztrhl, vše se zpřehlednilo.

Pro nové klienty je cesta jasná - začínají 20 minutovou zkušební lekcí zdarma. Po ní následuje možnost vyzkoušet si jednu placenou lekci, aby si byli jistí, že jim tento styl výuky vyhovuje. Teprve pak přichází nabídka výhodnějších balíčků.

Pro ty, kteří už vědí, že chtějí intenzivnější spolupráci, jsem vytvořil přehledné srovnání balíčků. Každý má svou kartu s jasně uvedeným počtem lekcí, jejich frekvencí a cenou. Použité ikony pomáhají rychle pochopit rozdíly mezi jednotlivými variantami.

HappyOwl - Cesta klienta/tky
HappyOwl - Cesta klienta/tky
Přehledný ceník balíčků s "podsunutím" 10 lekcí
Přehledný ceník balíčků s "podsunutím" 10 lekcí

Přitom lektorka preferuje balíčky 10 lekcí, které jsou klientovi/klientce “podsunuty” grafikou.

Podcast Čeština s Veronikou

Přímo na webu běží i podcast Čeština s Veronikou. Podcasty nahrané na web (přes administraci, velmi podobně tvorbě článků) se dají poslouchat přímo z webu, současně jsou distribuované na všechny velké podcastové platformy.

Rychlý a bezpečný web postavený na pevných základech

Web běží na spolehlivém (spíš prémiovém) hostingu exon.io.

Bezpečnost - několik vrstev ochrany: Wordfence pro aktivní zabezpečení, bezpečnostní hlavičky a vypnuté potenciální zranitelnosti jako třeba xmlrpc.

Data jsou chráněna automatickými týdenními zálohami na Google Disk.

Oxygen builder mi umožňuje tvořit čistý kód bez zbytečného balastu. Výsledkem je rychlý web - například stěžejní stránka individuální lekce má pouhých 30 kB CSS a bez analytických nástrojů jen 50 kB JavaScriptu. Asi jako malý obrázek.

Tím pádem není třeba sahat po řešení typu minifikace CSS nebo JavaScriptu.

Na webu běží analytika Matomo (žádný moloch typu Google Analytics) přímo na webu. Data nejsou odesílána někam na servery Google. Víc o různých měřeních návštěvnosti najdeš u mně ve článku Měříš návštěvnost webu? Vyzkoušel jsem čtyři nástroje najednou - tady jsou výsledky.

Pro ochranu před spamem jsem zvolil nenápadné, ale účinné řešení WP Armour. Oproti recaptcha nezabíjí web spoustou JavaScriptu.

Web je samozřejmě plně responzivní a obsahuje souhlasovou lištu pro soulad s GDPR.

Promyšlená e-mailová strategie a digitální marketing

Součástí webu je napojení na e-mailingovou platformu MailerLite:

  • Hlavním lákadlem do databáze je hodnotný e-book pro studenty češtiny, který návštěvníci získají výměnou za svůj e-mail. Obsahuje kurátorké tipy na podcasty, přizpůsobené knížky, videa atp. To pomáhá budovat databázi potenciálních klientů.
  • Pravidelný měsíční newsletter pak udržuje kontakt se zájemci o výuku a podporuje dlouhodobý vztah. Pro jeho odběr je na webu umístěn samostatný formulář.

Web není jen technické řešení

Web není jen technické řešení - je to komplexní nástroj digitálního marketingu. Od návrhu e-mailingové strategie až po jeho kompletní nastavení.

Klientka se po konzultaci se mnou rozhodla věnovat i e-mailingu, který si ode mne nechala nastavit. Díky tomu mohla naplno využít svůj potenciál a nestarat se o technickou stránku věci.

Celý projekt ukazuje, jak důležité je přistupovat k tvorbě webu komplexně. Nejde jen o hezký design nebo technické řešení - web musí především pracovat pro klienta a srozumitelně předávat informace.

Hledáš web, který pro tebe bude samostatně pracovat?

Rád ti pomůžu vytvořit řešení na míru tvým potřebám. Zaměřuji se na WordPress weby s důrazem na:

  • Strukturu
  • Opření se o redakční systém
  • Rychlost
  • Automatizaci rutinních činností
  • Propojení s marketingovými nástroji
  • Bezpečnost a spolehlivost

Ozvi se mi a probereme, jak by mohl web pomoct právě tobě.

Reference

Ukázka realizace webu Happy Owl
Tom má kromě technických znalostí i neuvěřitelné množství trpělivosti a je velmi kreativní. Vděčím mu za svůj web, do kterého vnesl své vlastní nápady a posunul tak celý koncept na mnohem vyšší úroveň, než jsem si vůbec dokázala představit. Dodaným textům vymyslel zajímavé grafické uspořádání, z fotek potom vybral ty nejvhodnější a zkombinoval s texty tak, aby stránky působily přirozeně a zajímavě. Ke všem mým připomínkám se citlivě vyjadřoval a naší vzájemnou diskuzí tak vznikal mnohem zajímavější koncept, než bylo moje původní zadání. Tuto Tomovu nápaditost a trpělivost velmi oceňuji a vnímám jako klíčovou při komunikaci s klienty bez zkušeností s tvorbou webu. Stránky, které Tom pro mé podnikání vytvořil, jsou rychlé, adaptované na různé obrazovky, designované pro více jazykových mutací a naprosto klíčové pro moji pracovní budoucnost. Ještě jednou děkuji a vřele doporučuji!
Veronika S.
linkedin facebook pinterest youtube rss twitter instagram facebook-blank rss-blank linkedin-blank pinterest youtube twitter instagram