Chcete si vytvořit webové stránky k vlastní fotografické prezentaci? Na workshopu vám Honza Barbořík vysvětlí pravidla tvorby stránek počínaje výběrem a koupí domény, zřízením webhostingu, instalací wordpressu a jeho nastavením. Ukáže vám práci se šablonami a pluginy a především s vlastním obsahem stránek.

1. Tvoříme fotografický web
ve WordPressu
aneb jak na funkční web?
Jan Barbořík

2. Jan Barbořík, marketér s duší grafika
Pomáhám živnostníkům, malým a středním firmám s online i offline
marketingem. Jsem tu pro vás, když nestíháte udržovat firemní web a
sociální sítě. Pomůžu, když je vaše firma málo vidět a neví si rady s
propagací. Umím vytvořit firemní grafiku, propagační materiály nebo
webové stránky. Podnikám pod značkou Devenio. Občas napíši nějaký
článek pro TyInternety nebo magazín Starting Up.
Blog o marketingu a grafice: www.janbarborik.cz
Firemní web: www.devenio.cz
Telefon: 608 400 855 | E-mail: jan.barborik@devenio.cz
Najdete mě:

3. 1.
Co znamená z marketingového pohledu formulace “funkční web”?
2.
V čem spočívají výhody a úskalí tvorby webu pomocí WordPressu
a proces tvorby takových stránek.
3.
Potřebuji nutně odborníka nebo si jej zvládnu udělat sám?
Co je cílem besedy?

4. Začneme úplně od začátku

5. Vlastní identita
• Definice mě, jako profesionála.
• Zkušenosti, přístup, specifika.
• Profesní příběh.
• Lokalita.

6. Vlastní identita
• Ne každý si tvoří business plán, ale aspoň nějak jej snad nosí v hlavě
každý, kdo se pustí do podnikání.
• Je fajn si to zformulovat písemně a na základě toho pak přistupovat k
jednotlivým marketingovým aktivitám.
• Pomůže to v marketingu, ale i třeba při přijímání / odmítání zakázek,
nastavování cenové politiky, vymezování se vůči konkurenci.

7. WHO - WHAT - HOW
(kdo jsou mí zákazníci - co jim chci říci - jakým způsobem je oslovím)

8. Pro koho chci pracovat?
• Kdo je můj cílový zákazník?
• Využití person při úvahách.
• Příprava cenové politiky.
• Návrh komunikační strategie.

9. Jakou práci dělám / chci dělat?
• Definice toho, co umím, co mně baví, co chci
dělat.
• Konkrétní formulace - ne obecné. Při propagaci
potřebujeme popisovat konkrétní nabídku pro
hledající zákazníky.
• Současný stav - jde to hned nebo to, co chci dělat
nejvíc, nabídnout jako jednu ze služeb a postupně
ji nechám růst?

10. Sebeprezentace na internetu
• Oborové nebo firemní katalogy
• Sociální sítě
• Weby
• Pronájem služby (webová galerie - portfolio)
• Pronájem webu (krabicové řešení)
• Tvorba webu na zakázku (vlastní řešení
/ open source)
• Tvorba webu svépomocí

11. Web je jen jeden z
komunikačních kanálů na
internetu
“Marketing je i to, jak pozdravíte zákazníka po telefonu.”

12. A stále existuje i svět mimo
internet…

13. Jak to funguje (pro jistotu)

14. Jaké jsou hlavní možnosti mít
vlastní web?

15. Pronájem portfolia
Klady
• Rychlé řešení
• Zvládne i laik
• Oborově zaměřeno
• Levné
Zápory
• Minimální přizpůsobivost
(vzhled, překlady)
• Nepřenositelnost obsahu
• Ne příliš přátelské pro
vyhledávače
• Nemožný další rozvoj
Rychlé a snadné řešení přímo pro fotografy, díky šablonám víte, jak bude portfolio
vypadat. Jste odkázáni na systém, pokud vám nevyhovuje, moc s tím neuděláte.
Zvládne i laik. Řešení není vhodné jako hlavní marketingový nástroj.

16. Pronájem webu
Klady
• Rychlé řešení
• Zvládne i laik
• Levné
• Dílčí úpravy většinou možné
Zápory
• Nepřenositelnost obsahu
• Nemusí být vhodné pro portfolio
fotografa
• Cena se v čase může nasčítat na vyšší
částku než je tvorba webu na míru
• Ne vždy jde web rozvíjet
Rychlé a snadné řešení, díky šablonám víte, jak bude web vypadat. Určitá míra
úprav je možná (za úplatu), obsluhu a zřízení zvládne i laik. Je nutno počítat s
tím, že pokud přestanete platit nebo službu využívat, přicházíte o data.

17. Tvorba webu na zakázku
Klady
• Připraveno na míru
• Tvoří a spravují profesionálové
• Možný další rozvoj webu
• Kvalitní prezentace
Zápory
• Tvorba zabere nějaký čas
• Nákladnější
• Může se stát že je web nuceně
hostovám u tvůrce
• Potenciálně obtížná výměna
správce webu
Vývoj webu na zakázku je časově náročnější, ale je vytvořen přímo pro vás a plně
respektuje vaše nároky a požadavky. Může se stát, že v rámci vlastního know-how
tvůrce web chce hostovat u sebe a díky tomu máte vlastně předchozí variantu, ale
připravenou na míru.

18. Tvorba webu pomocí
OpenSource
Klady
• Variabilita vzhledu i funkcí
• Možný rozvoj, šablony, pluginy
• Zastupitelnost ve vývoji a správě
stránek
• Nižší cena
• Lze vytvořit i svépomocí
• Podpora v komunitě a FAQ
Zápory
• Bezpečnost může být rizikem
• Pro funkce vyloženě na míru je
nutný programátor se
zkušeností s daným systémem
• Stránky jde udělat i hodně “blbě”
• Vyskytují se chyby, jejichž
odstranění trvá
Levnější varianta tvorby webu na míru, nadšenci si můžou stránky vytvořit
sami. Snadná práce s pluginy a šablonami. Zastupitelnost ve velkém počtu
profesionálů ovládajících tyto systémy. Výborná podpora v komunitě.

19. Specifika open source CMS
• Základní instalace obsahuje administrační rozhraní, základní šablonu a
moc toho neumí.
• Zdrojový kód je veřejně dostupný a distribuován zdarma.
• Na jádro je napojena tvorba pluginů/modulů (ty dávají webu funkce nad
rámec základního publikování) a šablon vzhledu.
• Základní obsluha bez nutnosti znalosti programování.
• Odlišná podpora a různé množství dostupných rozšíření.
• Existují i speciální open source webová řešení (fotogalerie,
ticketovací systémy, helpdesky, rezervační systémy,
e-shopy, redakční systémy…).

20. Co to je WordPress a proč on?
• Nejpoužívanější redakční systém na světě
• Podpora pluginů pro rozšíření funkcí
• Podpora témat vzhledu
• Lze vytvářet hierarchii (strom) stránek
• Integrovaná galerie médií
• Vyhledávání v rámci webových stránek
• Typografický filtr pro formátování a styl textu
• Možnost zařazovat příspěvky do kategorií, štítkovat
• Podpora více uživatelských účtů s odlišnými oprávněními

21. Funkční web

22. Jaký má být funkční web?
Má plnit cíl, pro
který byl vytvořen.

23. DESIGN
OBSAH
Jaký má být funkční web?

24. K čemu má web vlastně sloužit?
Vše o vás na jednom místě.
Rozcestník projektů, sociálních sítí a prezentací.
Na vlastním webu je vše plně pod kontrolou.

25. Technicky vzato
• Má odpovídat současným technickým standardům, které se vyvíjí a v
čase mění (správný kód, HTTPS, přátelský k sociálním sítím, ošetřené
chybové stránky, přesměrování, hezké adresy).
• Responsivní - tj přátelský pro zobrazení jak na počítači, tak na mobilních
zařízeních.
• S originálním obsahem.
• Rychle se načítající - optimalizovaný.
• Bezpečný a spolehlivý.
• Dohledatelný ve vyhledávačích.
• Vyhodnocovaný a měřený (aktivní analytika).
• Marketingově podporovaný.

26. Zvládne použitelný web vytvořit i
laik?
• V případě odpovídajícího zájmu mám za to, že ANO. Zdrojů k samostudiu
je všude na internetu spousta. Ale chce to čas.
• Samostatné studijní obory pro webdesignery v současné době u nás
nejsou, jediná možnost jsou soukromé kurzy a samostudium.
• Je důležité se zajímat o související obory - grafika, marketing,
programování…
• Existuje dostatek nástrojů, které umožní věnovat se tvorbě formy a obsahu
i bez znalosti programování.

27. Specifika webu pro fotografa
• Návštěvníka musíte zaujmout svou prací (fotografiemi) velmi rychle, jinak z
webu odchází. Musí ho prostě ohromit.
• Krátké, stručné, jasné titulky. Dlouhé texty a povídání jsou jako hlavní
sdělení nepoužitelné.
• Je nutné jasné zaměření - lidé hledají fotografa pro konkrétní situaci,
kterou řeší (svatba, produktové foto, glamour, těhotenské foto…).
• Kontakt vždy na očích. Uvádět působnost.
• Jasná nabídka, pokud komunikujeme ceny - ať se zákazník nemusí složitě
rozhodovat.

28. Takže ten WordPress…

29. Postup tvorby
1. Zajištění domény a webhostingu s patřičnou konfigurací!
(PHP a MySQL odpovídající verze)
2. Instalace WordPressu
(některé webhostingy nabízí “one-click instalaci”)
3. Výběr, koupě (tvorba) a instalace šablony
4. Instalace potřebných pluginů
5. Tvorba struktury a plnění obsahem
6. Nutná nastavení před spuštěním webu
(Google Analytics, SEO plugin, povolení indexace atd)

30. Výběr šablony a jeho úskalí
Šablony zdarma
• omezené možnosti
přizpůsobení
• ne vždy dodržují
standardy
• často chybný kód
• obsahují reklamní
a jiné odkazy
Šablony koupené
• tvořené
profesionály
• v ceně šablony
bývá podpora
• je potřeba dobře
vybírat
• často lokalizace
Šablony na míru
• jsou vytvořené
přesně pro vás dle
konkrétního
grafického návrhu
• jejich kvalita je
závislá na
schopnostech
tvůrců :-)

31. Parametry šablon
• Velké množství šablon odlišného stáří a kvality (např. na Themeforestu jich
je pro WordPress téměř 11 000)
• Existují různé šablony - univerzální, tématické, pro e-shopy… Některé jsou
s téměř neměnnou grafikou, ale jsou i šablony velmi modulární.
• Vždy je nutno pečlivě přečíst: popis, funkce, datum poslední aktualizace,
hodnocení zákazníků, počet prodejů, náhled do diskuse na komentáře.
• Při koupi obvykle získáte: adresář se soubory šablony (hlavní i child),
dokumentaci, připojené pluginy, licenční klíč, demo data, občas i PSD
grafiky.

32. Parametry šablon

38. Instalace šablony a samotná
tvorba
• Instalace probíhá velmi snadno nahráním zakoupeného archivu se
soubory šablony přes administraci.
• Vhodné používat “child theme” - dětskou šablonu pro vlastní úpravy, aby
zůstaly zachovány i při aktualizacích.
• Import demo dat a úprava obsahu podle nich nebo rovnou “z čisté vody”.
• Dopřeložení nelokalizovaných slovních spojení (buď rovnou v šabloně
nebo pomocí pluginu).

39. Tvorba obsahu
• Myšlenková mapa obsahu a struktury ještě před
vlastní tvorbou. (Snadno to pak sklouzne ke hraní si
se šablonou a výsledek je jiný, než bychom chtěli).
• Příprava textů v elektronické podobě (klidně
poznámkový blok) a obrázků (patřičně
optimalizovaných pro web) + dalších souborů
pojmenovaných bez diakritiky a mezer malými
písmeny.
• Stručné, jasné, vypovídající informace. Není třeba
psát slohovku, spousta informací se dá vyjádřit
vizuálně - např. ikonkami s popisky.

40. Důležité pluginy
• SEO - (All-in-one SEO, Yoast SEO, Google Tag Manager for
WordPress…)
• Zabezpečení adminu a webu (Wordfence Security, WP Limit Login
Attempts)
• Zálohování (BackWPup) - ideálně řešit na úrovni webhostingu
• Lokalizace (Loco Translate) a multijazyčnost (Polylang)
• Page builder (Page Builder by SiteOrigin, Visual Composer, Divi)
• Přesměrování (Quick Page/Post Redirect Plugin)
• Zrychlení (WP Super Cache, WP Optimize)

41. Důležité nastavení
• Vyplněná metadata pro každou stránku.
• Dostupnost pro vyhledávače - povolit indexaci.
• Správně pojmenované adresy stránek a
příspěvků.
• Napojení na Google Analytics + Search
Console.
• Kontrola kontaktních formulářů, že fungují.
• Promazání možných zbytkových demo stránek
a nepublikovaného obsahu.
• Smazání neaktivních šablon a pluginů.

42. Vlastní spuštění webu
1. Povolení indexace a kontrola předchozích bodů.
2. Žádost o indexaci v Search Console.
3. Žádost o indexaci na Seznamu.
4. Další práce se zpětnými odkazy
(sociální sítě apod.).
5. Tvorba obsahu a další rozvíjení webu.

43. Spuštěním webu to nekončí
• Pouhým spuštěním nového webu se vlastně nic nestane, pokud se o něm
lidé nedozví.
• Aby web fungoval, je potřeba být aktivní - na něm i mimo něj.
• Je potřeba web udržovat (aktualizace a následná kontrola).
• Sledování a vyhodnocování chování návštěvníků na webu + jejich reakcí
(a to jak pomocí analytických nástrojů, tak zjišťováním osobně od nových
klientů).

44. Co vše by měl dodat
profesionál?Když si web na WordPressu objednáte u profesionála, měl by:
• zajistit doménu a webhosting (a napsat je na vás)
• navrhnout a konzultovat s vámi strukturu stránek
• navrhnout (vytvořit) vhodnou šablonu
• podílet se na formě a revizi obsahu
• naplnit web obsahem a připravit jej na spuštění
• zaškolit vás k obsluze v potřebném rozsahu
• napojit jej na analytiku a nasdílet vám plné přístupy
• je fajn, když hlídá aktualizace a reviduje a řeší případné problémy

45. Zdroje
• www.google.cz - UTFG
• www.separatista.net - web české komunity WordPress, diskusní fórum
• www.wplide.cz - seznam českých WordPress profesionálů
• www.navolnenoze.cz - katalog nezávislých profesionálů (vč. WordPress)
• Google Digitální Garáž - kurz on-line marketingu zdarma
• www.udemy.com - placené on-line kurzy
• XMind.net - užitečný nástroj na tvorbu myšlenkových map
• www.afop.cz - připravujeme kurz WordPressu pro začátečníky (11/2017)