Jak udělat web jednoduše, rychle a dobře?

Můj osvědčený postup tvorby stránek. Začni obsahem, zaměř se na strukturu a testujte. Grafika až nakonec. Důležitá je funkčnost a kvalitní informace.

Ahoj markeťáku!

Jedna z hlavních věcí, které dělám poslední skoro dvě desítky let, jsou weby. Dneska bych se s tebou chtěl podělit o svůj přístup k tvorbě. Za ty roky jsem si ho zjednodušil a zautomatizoval tak, že i když je potřeba udělat web s nízkým rozpočtem, výsledek bude co nejlepší.

Konec konců jako marketér nebo podnikatel se dřív nebo později dostaneš do situace, kdy budeš potřebovat (další) nový web. Ať už půjde o microsite pro kampaň nebo nové firemní stránky. A ne vždy máš k dispozici tým specialistů a velkorysý rozpočet.

Naštěstí žijeme v době, kdy existuje spousta nástrojů, které ti práci usnadní. Tvorba webu už není otázkou programování, ale zejména skládání obsahu.

Zapomeň na grafiku, začni obsahem

Když se řekne „nový web“, spousta lidí začne okamžitě řešit, jak by měl web vypadat. Jaké bude mít barvy, kde bude logo, jaké budou animace. Stop! To je přesně opačný postup, než jaký potřebuješ. Web je především nosič informací. Málokdy je úspěšnost webu závislá na jeho grafice. Lidé se na web nechodí kochat. Chodí tam pro odpovědi a řešení svých problémů.

V mém vidění světa musí stránky fungovat i černobílé, v základním fontu.

Když budeš mít dobře udělanou strukturu, perfektně popsané a nafocené produkty nebo služby které nabízíš, web prostě bude muset fungovat. A to, jestli bude modrý nebo červený už ti nic víc zásadně nevydělá. Naopak pokud se budeš soustředit jen na grafiku a obsah bude stát za prd, web bude k ničemu.

Jasně, ať to není ostuda, esteticky ať je učesaný, přizpůsobený oboru ve kterém se pohybuješ i tvému vizuálu. Ale to až nakonec.

Struktura jako základ

Prvním krokem při tvorbě webu by tedy mělo být vytvoření myšlenkové mapy. V ní si rozkreslíš, jaké stránky web bude mít a co na nich bude za obsah.

Pro každou stránku si poznač, jaké informace by měla obsahovat, jaké prvky tam chceš mít (formuláře, galerie, reference...) a co má návštěvník na stránce udělat. Tohle ti dá jasnou prvotní představu o rozsahu projektu. Tím se bude tvorba webu řídit.

Já používám pro tvorbu aplikaci MindMeister, který lze snadno sdílet s týmem nebo s klientem.

Potom si připrav informace

S připravenou strukturou je čas na přípravu podkladů. Alespoň těch faktických a hrubých. Potřebuješ texty, fotky, reference, kontakty... zkrátka vše, co bude tvořit obsah webu. Zkus si připravit maximum hned na začátku. Nemusí to být finální a dokonalé texty. Ale měl bys mít třeba jen v bodech, o čem budou. Pokud nemáš všechny materiály, poznač si alespoň, co tam bude a v jakém asi rozsahu. Stačí i amatérské fotky, pokud ty profi budou později.

Rychlý prototyp ukáže víc než plánování

Jakmile máš podklady, můžeš začít tvořit. Díky nástrojům jako je WordPress (téměř výhradně používám šablonu Divi) můžeš rychle sestavit funkční prototyp webu. Já si nejprve nainstaluju čistou instalaci WordPressu s DIVI, začnu tvořit strukturu stránek, vytvořím menu a navkládám nahrubo bez jakéhokoliv stylování podklady, které mám.

Neřeš v této fázi grafiku - jde o to, aby ti informace jako celek i jejich uspořádání dávaly smysl. Výhoda je, že s minimálním úsilím vidíš reálný web, můžeš si jej proklikat a lépe si představíš finální podobu. A zavčasu máš prostor případně přehodnotit nebo upravit, jak na něm co bude.

Můžeš si i na skutečných lidech otestovat, jestli dává smysl struktura, jestli nechybí nějaké důležité informace, jestli se na webu dá snadno orientovat a jaký rozsah textů budeš kde potřebovat. Je mnohem snazší dělat úpravy v této fázi, než když máš hotovou grafiku.

Doladění obsahu

Pokud je vše tak, jak potřebuješ, je na čase zapracovat na konečné podobě obsahu. Naplnit finální podobou textů, nahrát správné fotky, pohrát si s textací odkazů, tlačítek, s formuláři… Nastavit náhledové fotky k článkům. Prostě aby při procházení už návštěvník viděl obsah, který tam nakonec má být.

Když se nad tím zamyslíš, weby jako ten od Apple, Notionu, Basecampu nebo Dropboxu vlastně moc grafiky nemají. Jsou učesané, s pěknou typografií…ale zbytek je minimalistický. Jsou postavené na super textech a vymazlených fotkách. Vidíš, že na kvalitu sdělení ty barvičky až tak vliv nemají?

Grafika až jako poslední krok

Takže až teprve, když máš potvrzený a otestovaný obsah, pusť se do grafických úprav. V tuto chvíli už přesně víš, co styluješ - znáš délky textů, počty obrázků, různé typy obsahu. Můžeš buď rovnou stylovat přímo na webu a grafiku tvořit “za pochodu”, nebo si připravit grafický návrh podle vývojové verze stránek a tu pak nastylovat.

Ačkoliv jsem zastáncem přístupu "content first", neznamená to, že by grafická podoba webu nebyla důležitá. Je to jako se stavbou domu - nejdřív potřebuješ funkční dům, ve kterém lze bydlet, a pak jej můžeš vymalovat a zařídit. Web musí být v konečné podobě vizuálně atraktivní a profesionální. Ale toto je až poslední krok v procesu.

Proto i když na webu má pracovat grafik, zadáním pro něj by měla být ta konečná podoba obsahu. Aby věděl, co navrhuje. Jinak bude tvořit naslepo - a možná i zbytečně. Nebo ty se pak budeš snažit svůj obsah násilně naroubovat do návrhu, který byl vytvořený bez kontextu.

Proč tento přístup funguje?

Pokud bys měl tým profíků, dělal bys to všechno taky. Jen odděleně. Nejprve průzkum a rešerše, strukturu, návrh drátěných modelů a testování, pak copywriting, grafický návrh a podle něj by se programoval web.

Takto jsi s minimální časovou intenzitou schopný mít živý prototyp webu s hrubým obsahem k testování. Díky současným nástrojům (no-code / low code) je technická stránka tvorby webu mnohem jednodušší než dřív.

Skutečnou výzvou je vytvořit kvalitní a funkční obsah. A právě na to by ses měl při tvorbě webu soustředit především. V tom vidím hlavní úlohu současného marketéra.

Tvým zákazníkům a návštěvníkům stránek bude nakonec vlastně i úplně jedno, na jaké běží platformě nebo kolik stály peněz. Půjde jim o to, jestli najdou to, co hledali. A jestli je zaujmeš.

To je ve zkratce můj přístup k tvorbě stránek.

🔍 Google odhalil, co jsme letos hledali

Google opět vydal svůj tradiční přehled trendů ve vyhledávání za uplynulý rok. A je to fascinující náhled do toho, co lidi v roce 2024 nejvíc zajímalo. Není to jen statistika - je to vlastně takový digitální otisk naší společnosti.

Letos poprvé nabízí Google data v interaktivní podobě, kde si můžeš procházet trendy jak celosvětově, tak lokálně pro Česko.

Co je zajímavé? Google nezveřejňuje nejvyhledávanější výrazy (tam by totiž každý rok vévodila slova jako "počasí" nebo "facebook"), ale ukazuje výrazy, které zaznamenaly největší meziroční nárůst v počtu vyhledávání.

Zajímavý je třeba příběh Tracy Chapman a její písně "Fast Car" z roku 1988. Díky cover verzi od country zpěváka Luka Combse se dostala mezi nejhledanější písně roku 2024, přestože sama Chapman už 16 let nevydala žádné album. Její měsíční poslechovost na Spotify vzrostla o více než 16 % na 12,7 milionu posluchačů a originální verze písně se blíží magické hranici miliardy přehrání.

V oblasti sportu dominovaly velké fotbalové turnaje Copa América a UEFA European Championship. A mezi nejhledanějšími zprávami vévodily americké volby - však také letos šlo k volebním urnám téměř 50 % světové populace.

Mimochodem - ve světě vyhledávání se děje ještě jedna zajímavá věc. Studie analyzující 332 milionů vyhledávání odhalila, že pouhých 148 klíčových slov generuje 15 % všech vyhledávání. To je docela překvapivé číslo, co myslíš? 🤔

💡 Tip na užitečný nástroj: FontJoy

Řešíš občas výběr písma pro web nebo grafiku? Existuje skvělý bezplatný pomocník jménem FontJoy, který ti pomůže najít harmonické kombinace fontů.

Stačí kliknout na tlačítko "Generate" a nástroj ti navrhne tři vzájemně ladící písma. Myslím tím zejména písma pro nadpis a odstavcové texty. Pokud se ti některé z nich líbí, můžeš si ho "zamknout" a nechat si generovat alternativy k ostatním.

Díky možnosti editovat zobrazený text rovnou vidíš, jak budou fonty vypadat s tvým obsahem. FontJoy je užitečný pomocník pro každého, kdo nechce trávit hodiny zkoušením různých kombinací písem.

Za dva týdny jsou tu Vánoce, tak ti přeju, ať se ti daří všechno včas dokončit, naladit se do odpočinkové atmosféry a užít si trochu klidu.

Honza Barbořík
marketér s duší grafika