Lekce 3 - Šablony zdarma, placené a na míru
V předchozí lekci, Instalace WordPressu a základní nastavení, jsme si ukázali, jak Wordpress nainstalovat a některá jeho základní nastavení.
V této kapitole se zaměříme na šablony. Podíváme se na 3 typy a vícero možností, jak se dají skládat weby. Částečně zabrousíme i do pluginů, ale o těch se rozepíši spíše až v článku o pluginech.
Šablona, co to vlatně je?
Šablona jako taková je soubor funkcí a vlastností, které určují možnosti a obsah webu. Někdy vývojáři dají uživatelům celé podstránky v administraci, kde lze nastavit barevná schémata, menu, obsah patičky či hlavičky a mnoho dalšího.
Jindy naopak tvoříme sekce absolutně sami dle své vlastí fantazie, kdy ovšem v rukou laika weby dopadají většinou spíše hůře. To je dáno hlavně nepochopením webu jako takového.
V takový moment je tu pak člověk, co se vývojem na WordPressu zabývá a dokáže pomoci. Ať už se jedná o klikání v administraci na tlačítka nebo přímo psaní kódu.
Pojďme se tedy podívat na 3 typy/možnosti šablon.
Zdarma
Oficiální WordPress repozitář (wordpress.org) obsahuje na tisíce šablon zdarma. Avšak jak to tak u věcí zdarma bývá, valná většina z nich nevypadá nikterak lákavě, a přeci jen - vzhled prodává. Po detailnějším prohledávání nakonec zakotvíte u pár z nich, které jsou zajímavé. Nicméně to, co vás zajímá, je především kvalita kódu a možnosti, jež daná šablona nabízí.
Nastává tedy chvíle zkoušení a testování. Velmi výrazně doporučuji zkoušet šablony jak jen to jde a neskončit u první či druhé. WordPress je volně dostupný od toho, abyste měli volnost.
Další možností, kterou využít, jsou takzvané starter themes (v překladu startovací šablony), jejichž cílem je poskytnout podporu pro nejžádanější pluginy na trhu, ale neobsahovat zároveň téměř nic. Proč? Protože jejich cílem je nabídnout vizuální editor. Vizuálních editorů jsou jednotky (těch dobrých) a jedná se o pluginy. Opět, více se o nich budeme bavit v následujících dílech. Pro teď stačí říci, že weby si skládáme pomocí bloků, jejichž grafika je určitým stylem předdefinována a máme určitou vůli jim změnit atributy (barva, velikost, zarovnání, kulatost rohů, stíny apod).
Nejlepší vizuální editory mají propracované takzvané Drag & Drop systémy. V příštích dílech se budeme bavit především o Gutenbergu a Elementoru. Gutenberg je novinka v samotném WordPress (ze společnosti Automatic) a Elementor je plugin od externích vývojářů.
Tyto starter themes vás pak nechají vytvořit si sekce jako je hlavička, patička nebo sidebar. Těm přiřadíte obsah - logo, menu, tlačítka, obrázky nebo widgety - a zařadí se automaticky do příslušné pozice na webu.
Samotný WordPress pak nabízí sekci úprav nazvanou Customize, kde občas vývojáři mají různé sekce jako vlastní CSS, logo pro web, název webu atd. Od toho se však velmi často upouští kvůli zastaralosti a nepřehlednosti uživatelského rozhraní.
Placené
Oproti šablonám zdarma, jsou ty placené robustnější, mají více funkcí, jsou graficky lépe pojaté a sází na neznalost uživatelů. Lidem se prostě líbí video na pozadí, pěkné animace, přechody a přitom platí tak málo (odhadem od 500 Kč do 1 500 Kč).
Nicméně to by nebyl problém, kdyby.... - to velké kdyby je právě v
kvalitě šablon. Co na tom, že šablona má 5 MB v základu při
načtení menší stránky. Co na tom, že uživatel čeká 10
vteřin, než vůbec něco uvidí.
No a ono na tom je právě to, že Google náročné weby s hromadou bordelu prostě a jednoduše nemá rád. Má oficiální měřící nástroje (PageSpeed Insight, aka Lightouse), kterými analyzuje velikost HTML dokumentu, CSS, JS, jak dlouho trvá spustitelnost, kolik % CSS a JS je na dané stránce reálně použito oproti celkovému objemu apod. - těch kritérií je na desítky.
Poté, co si uživatel koupí jednu z TOP šablon na themeforest (největší portál skrze placené šablony pro WordPress) pak vidí čísla jako:
- Mobilní zařízení = 10/100
- Počítač = 50/100
A samozřejmě se zděsí. Neví, co se děje a logicky za to může zlý
WordPress. S tímto názorem se setkávám často. Například mé weby nemají
problém se vejít do 50 kB (HTML, CSS a JS) kdy pak vidím
95+ bodů ze 100 na měřících nástrojích, a to i
bez cachování či optimalizace obrázků.
Aby vývojáři placených šablon mohli mít nějaké zisky, musí zaujmout co největší počet uživatelů. A toho dosáhnou především tím, že nacpou do šablony tuny (doslova) funkcí, možných podstránek a dalšího obsahu. Na druhou stranu je i mnoho šablon, jenž jsou placené a přitom jejich kvalita je prvotřídní. Ty jsou však méně známé a využívají se především jako startovací šablony u vývojářských týmů, kde se weby dělají na míru. Ty pak dokáží z WordPressu vytáhnout mnoho funkcí a nabídnout perfektní grafiku, ovšem už ne za cenu do 1 500 Kč.
A to je kámen úrazu. Abyste mohli mít kvalitní web, potřebujete vědět, co je a co není kvalitní. A laik toto téměř nikdy poznat nemůže. Proto mé doporučení je jasné - najděte někoho, kdo vám poradí i za cenu toho, že bude chtít peníze. Tímto krokem si ušetříte velké množství problémů a možná se budete divit, ale sečteno a podtrženo nakonec i ušetříte. Pokud totiž pak najmete někoho na opravu šablony, tak zaplatíte mnohem a mnohem více, s tím, že výsledek může být nejistý, protože vy sami nedokážete posoudit kód jako takový.
Na míru
A tím se přesouváme k šablonám na míru. V tomto oboru dělám specificky já, kdy klient přijde s grafikou (popřípadě grafiku navrhuji já). Takové weby se často připravují tak, aby vyhovovaly klientovi, v co největším možném rozsahu, ale aby v ideálním případě klient web nemohl rozbít nebo překopat dle svých představ. Což u šablon placených je velmi snadné.
Ukázka výkonu webu, který je celý závislý na JavaScriptu a má více
jak 2 MB obrázků. Ovšem speciálně jsem dělal pouze v čistém
JavaScriptu a sehnal co nejmenší knihovny. Vše kromě obrázků má okolo
11 kB (po Gzip).
Proč nedat klientovi větší vůli? Klient je laik (velmi často, ne však vždy) a tudíž nechat ho nabarvit sidebar na svítivou žlutou, na to dát zelený text s tím, že jeho značka je založena na červené a tmavě modré, by vyústilo ve velmi nemilou situaci a pro dodavatele špatnou referenci.
Co tedy například dělám já je to, že technicky dávám klientovi možnost měnit web v rámci mezí. Nicméně barevné schéma, velikost textu, a další grafické přednosti webu jsou dány napevno v šabloně jako takové a nedovoluji je měnit. Změnit je pak lze pouze na základě domluvy, nové grafiky nebo jiného podnětu. Pokud tedy daný uživatel může vkládat textace a obrázky, neměl by nic pokazit a takové šablony vydrží i celé roky bez větších problémů.
Mám na mysli i s pravidelnými aktualizacemi WordPressu. Je jasné, že funkce se postupem času mění a je potřeba web jednou za čas aktualizovat z hlediska kódu, ale tomu se vyhnout nelze.
Negativní a zároveň pozitivní pohled na fakt, že si nemůže uživatel měnit úplně co chce, je jistota funkčnosti a konzistence. Nezkušení uživatelé mají tendenci přeplácávat systém a web se může pomalu zhoršovat.
Další rádoby nevýhodou je cena. Pokud si web necháte stavět od začátečníka za 200 Kč na hodinu, tak nelze očekávat kvalitní výsledek i kdyby cena webu byla celkově vysoká. Oproti tomu můžete investovat a zaplatit někoho nad 600 Kč na hodinu. Je zde určitá šance, že se vám dostane služeb, o kterých si u šablon zdarma/placených můžete nechat jen zdát.
Na určitých portálech jsou desítky specialistů, kteří zajistí, aby tvorba webu byla hračka. Pravidelná komunikace, doporučení na pluginy, které pomohou s vylepšením webu a léta zkušeností se samotným WordPress jen tak nějaká šablona nenahradí.
Ale jak říkám, platíte za kvalitu a menší weby startují klidně na 30 000 Kč (u někoho bez DPH). Máte však grafiku, kódování i WordPress šablonu na míru.
Závěr
Záměrně jsem se nepouštěl do ukázek šablon, jelikož nechci svádět a bude lepší, když si je projdete sami a zjistíte, co vám bude vyhovovat.
Nicméně zde doporučím šablony, vzhledem i k následujícím kapitolám, s nimiž můžete začít a prozkoumat WordPress jako takový, viz:
- WordPress oficiální
- Elementor Hello Theme , nutno doinstalovat plugin Elementor
- WooCommerce šablony , ideální pro e-shop na WordPressu
Nástroje pro kontrolu (načítání) webu, viz:
Ne vždy vyhodnotí vše na 100 %, ale dokáží určit problémy a navést na to, co je způsobuje. Pokud se tedy web načítá dlouho, jeden z těchto nástrojů vám může říci proč.
To je pro dnešní lekci vše.
Kdo stojí za článkem?
Ahoj, jmenuji se Pavel Mareš a od roku 2012 pracuji v digitálním prostředí. Prošel jsem si kódováním, vývojem webů, grafikou a v tuto chvíli pomáhám svým klientům tvořit kvalitní stránky na míru.
Nabízím služby - UX, UI (grafika), kódování (Gulp, SASS, HTML5, CSS3, JS) a nasazení webu na WordPress (vlastní šablony). Můžete se podívat na mé reference.
Rychlý kontakt: +420 776 256 020 / info@mares-pavel.cz
V příští lekci, Pluginy zdarma, placené a na míru, se podíváme na pluginy.
