Testování webu před jeho puštěním do ostrého provozu vyžaduje pořádnou péči. Odbýt ho znamená riskovat, že se vám to časem vymstí. Seznamte se v tomto článku s vhodnými postupy při testování – ať už nového webu, nebo webových stránek, které procházejí rekonstrukcí. Uvnitř na vás čekjí také dva užitečné checklisty.
Obsah
Proč je testování webu důležité
Otestovat web před zveřejněním je stejně důležité, jako třeba zkontrolovat si hloubku rybníka, než do něj skočíte. Když kontrolu odfláknete, můžete tvrdě narazit a zadělat si na zbytečné potíže.
Vy i vaši zákazníci, klienti, odběratelé využíváte různé typy zařízení, různý software a různé prohlížeče. A webové stránky se na nich mohou chovat a zobrazovat odlišně. Proto je dobré otestovat průchod webem a hlavně jeho klíčovými částmi a cestami v co nejvíce možných kombinacích zařízení a prohlížečů. Dokud je web v testovacím režimu, všechny případné chyby a nedokonalosti vidíte jen vy a vývojář a můžete je řešit. Půjde to sice i na publikovaném webu ale už s rizikem, že na chybu narazí váš zákazník.
Co obsahuje testování webu před spuštěním
Při testování webu se můžete zaměřit na řadu oblastí od vizuální shody webu s grafickým návrhem, přes chování webu při změnách velikosti okna až po kontrolu funkčnosti odkazů nebo propojení s externími službami jako je CRM, platební brána či databáze e-mailů pro odběr newsletteru.
Víc očí víc vidí a víc hlav víc ví. Proto u nás testovací web kontroluje web developer, který web vyvíjel, druhý web developer, UX designer, který web navrhl, a projektový manažer. Následně by měl kontrolu poctivě provést i klient. To je velice důležité, protože se na celý web dívá jinak než profesionálové, kteří s webovými stránkami pracují denně. Postup kontroly neděláme náhodně. Máme zpracovaný checklist, podle kterého postupujeme a odpovídáme si na důležité otázky.
Checklist kontroly testovacího webu
- Je finální grafika shodná s navrhovanou grafikou?
- Obsahuje web všechny navržené stránky?
- Jsou aktivní a neaktivní prvky webu dobře rozlišitelné a disponují hover efekty?
- Odpovídají animace webu představě designéra, jsou plynulé a nebrání použitelnosti webu?
- Jsou podstránky klikatelné a naplněné obsahem?
- Sedí funkce a moduly webu s objednávkou?
- Funguje kontaktní formulář včetně (validace obsahu polí, varovné hlášky, odeslání)?
- Funguje vyhledávání na webu a ignoruje diakritiku?
- Jsou všechny interaktivní prvky a tlačítka funkční ve všech běžných vyhledávačích (Chrome, Firefox, Edge, Opera, Safari) i na mobilu?
- Splňuje web parametry Google Mobile Friendly testu?
- Je rozložení prvků/textů takové, že se navzájem nepřekrývají a nepřesahují?
- Dává struktura nadpisů na stránkách smysl?
- Je funkční propojení s platební bránou?
- Je funkční propojení se sociálními sítěmi?
- Je funkční propojení s účetním systémem?
- Obsahuje web zákonné informace (název firmy, právní forma, sídlo, IČO, spisová značka)?
- Jsou vyřešené všechny errory podle HTML validátoru?
- Má HTML kód logickou strukturu?
- Jsou obrázky nahrané ve velikosti, která odpovídá jejich velikosti na webu?
- Je funkční nadesignovaná stránka pro chybu 404?
- Jsou nainstalovány pluginy pro tracking úprav obsahu a přesměrování stránek?
- Je struktura administrace webu logická a je v ní editovatelné to, co by mělo být?
- Je zajištěna cookies lišta?
- Obsahuje web relevantní návody pro tvorbu příspěvků, stránek a vkládání obrázků?
Ve chvíli, kdy si na všechny otázky (pokud jsou pro daný web relevantní) odpovíme ANO, je web připravený na publikování.
Přečtěte si také, jak za 5 vteřin odhalíte slabiny vašeho webu.
Checklist kontroly testovacího webu ke stažení
Stáhněte si interaktivní checklist kontroly testovacího webu v PDF. Splněné položky si můžete odškrtávat v PDF prohlížeči, nebo si checklist vytisknout.
Nástroje pro předávání zpětné vazby k webům
Pro předávání zpětné vazby k webům jsme si oblíbili platformu MarkUp. Do ní pouze vložíte adresu testovacího webu (nebo i živého) a platforma si ho nahraje v podobě, jakou vidí uživatelé, včetně prolinkování stránek. Poté můžete na jakékoliv místo otisku webu přidávat komentáře včetně screenshotů a dalších příloh. Každý komentář je možné označit za vyřešený, a tak si vlastně odškrtávat položky jako na checklistu.
Co následuje po spuštění webu
Web máme otestovaný, přenesli (migrovali) jsme ho na zvolený hosting a nasměrovali na něj veřejně dostupnou doménu. Co následuje? Rozhodně ještě není všem kontrolám konec. Je potřeba opět zkontrolovat některé klíčové funkce a dokončit napojení na služby třetích stran, které nám pomůžou v dalším rozvoji webu.
Opět je potřeba si zodpovědět několik otázek:
- Jsou podstránky klikatelné a naplněné obsahem?
- Je funkční propojení s platební bránou?
- Je funkční propojení s účetním systémem?
- Funguje kontaktní formulář?
- Jsou implementovány požadované měřící nástroje Google Analytics 4, Google Tag Manager, Google Search Console, Microsoft Clarity a zkontrolována jejich funkčnost?
- Odpovídá rychlost načítání webu podle Google PageSpeed Insights standardům?
- Je náhled stránky při sdílení na sociálních sítích aktuální?
- Je povolena indexace webu prohlížeči?
- Je správně poskládaná struktura URL podstránek?
- Jsou přístupy k webu zálohovány na určených místech?
- Je záloha webu uložena na určeném místě?
- Má web nastavené Strict-transport-security?
- Je web zadán do seznamu webů s HSTS?
- Je nainstalován a aktivován nástroj pro zabezpečení administrace a provedena kontrola napadení?
- …a nezapomenout na podpis Uniferu v patičce!
Checklist kontroly webu po spuštění ke stažení
Stáhněte si interaktivní checklist kontroly webu po spuštění v PDF. Splněné položky si můžete odškrtávat v PDF prohlížeči, nebo si checklist vytisknout.
Časté chyby před spuštěním webu
Doporučujeme při testování nic nepodcenit a zvlášť ne kontrolu funkcí a prvků vedoucích ke konverzi (nákupu, kontaktu, …). Na co klienti obvykle zapomínají?
- Vyzkoušet kontaktní, poptávkový nebo objednávkový formulář – jestli jim e-maily chodí do správné schránky a jestli jsou v nich všechny požadované informace.
- Prohlédnout si web na jiném zařízení, než běžně používají.
- Doplnit si na web povinné informace o společnosti (tj. název firmy, právní forma, sídlo, IČO, spisová značka).
- V případě, že má web více jazykových mutací, ověřit, že všechny relevantní stránky a všechny texty jsou přeložené.
- V případě, že web se stejnou adresou už existoval před aktuálním redesignem, přesměrovat všechny staré URL na aktuální, aby nedocházelo k tvorbě stránek s chybou 404.
- Vyplnit správné odkazy do všech připravených editovatelných tlačítek.
- A také na to, že většina úprav, které musí vyřešit vývojář, se dá nejefektivněji řešit pohromadě v rámci jednoho balíku.
Jak tvoříme weby v Uniferu
Tvorba webu u nás, to je důsledný proces od úvodní rešerše až po navazující údržbu spuštěného webu a jeho další rozvoj. Podrobněji se postupu tvorby webu věnujeme v našem článku Jak vznikají webové stránky. Začínáme úvodním workshopem, kde si ujasníme, jaký web budeme tvořit nebo redesignovat. Následuje analýza současného stavu, konkurence, zákazníků, podle potřeby realizujeme analýzu klíčových slov, která lidé používají při hledání vašich služeb či produktů. A pak se pouštíme do postupné skladby vašeho webu – od struktury stránek, přes wireframe a grafický návrh webu po nakódování celého webu k otestování a následné spuštění do ostrého provozu.
Spuštěním webu práce nekončí
Často se setkáváme s domněním klientů, že když mají nový web, nemusí se o něj starat a bude jim dobře sloužit dalších několik let. Je to ale asi jako s autem – když s ním chcete jezdit a mít jistotu, že jste v něm v bezpečí, potřebujete pravidelně navštěvovat servis, sem tam vyměnit součástku nebo provozní kapalinu. A když s sebou chcete převážet kola, přikoupíte nosiče nebo si pořídíte vozík na větší náklad.
Podobně to funguje i s údržbou a rozvojem webů. Pravidelným servisem zajistíte, že jednotlivé komponenty budou stále kompatibilní s aktuálními nároky prohlížečů i uživatelů a minimalizujete riziko, že mají bezpečnostní díry, do kterých by mohl proniknout malware. Autoři pluginů by měli vydávat pravidelné aktualizace, a pokud to nedělají, vyskakuje varovná kontrolka, že je potřeba plugin vyměnit za jiný. A protože vaším cílem je spokojený zákazník, který si raději vybere vás před konkurencí, chcete mu stále vylepšovat zážitek z procházení webem – přidat funkci, usnadnit nákup, rozšířit web o stránku zaměřenou na nový produkt… Tvoříme weby tak, aby byly připravené na další rozvoj a vy jste se nemuseli omezovat.
Jak propagovat nový web
Máte nový web a chcete, aby se o tom lidé dozvěděli. Naskočit na vlnu energie, kterou vám nový web dodal, a vytěžit z toho maximum. Jak na to?
Publikujte příspěvek na sociálních sítích. Dejte svým sledujícím vědět o tom, že máte nový web a nalákejte je na to, co na něm můžou najít. LinkedIn, Facebook, Instagram, X – všechny sítě, které používáte, využijte a přizpůsobte jim znění článku. Doplňte příspěvek obrandovaným bannerem a samozřejmě nezapomeňte přidat odkaz na web. Můžete přidat i výzvu, aby vám lidé reagovali, jak se jim nový web líbí.
Pošlete newsletter vašim zákazníkům. Nejlepší způsob, jak to udělat, je využít e-mailingový nástroj a v něm vytvořenou databázi e-mailových kontaktů vašich zákazníků a lidí, kteří souhlasili se zasláním marketingových zpráv nebo se dokonce přihlásili k odběru vašeho newsletteru. Popište jim, co užitečného je na novém webu čeká a nezapomeňte přidat odkaz na web.
Nasaďte PPC reklamu. Placenou reklamou nejrychleji dostanete web do popředí ve vyhledávačích i na sociálních sítích. Nevynechejte ani bannerovou reklamu. U tohoto typu propagace se zaměřte na téma, které bude lákat lidi ke kliknutí na reklamu. Propagujte třeba nový ceník, šíři nabídky produktu nebo služeb, pohodlnější nákup, e-book ke stažení zdarma nebo zvýhodněnou nabídku pro prvních několik zákazníků. Pouhé oznámení o tom, že máte nový web, v tomto případě nestačí.
Slovník klíčových pojmů při spouštění webu
S blížícím se termínem přenesení webu do ostrého provozu se komunikace s klienty začíná hemžit cizími výrazy a tajemnými zkratkami. Pojďme si vysvětlit, co jednotlivé pojmy související s testováním a spuštěním webu znamenají.
Administrace
Administrace webu je místo, ze kterého můžete spravovat obsah webu a některé jeho funkce.
WordPress
Naše oblíbené CMS (Content Management System), neboli systém pro správu obsahu. Jedná se o open-source platformu pro administraci webu, která nám umožňuje tvořit weby připravené pro další rozvoj.
SEO
Zkratka pro Search Engine Optimization (optimalizace pro vyhledávače) označuje komplex technických a obsahových parametrů a činností, kterými můžete ovlivnit organické postavení vašeho webu u vyhledávačů (Google, Seznam, Bing, Yahoo ad.). Do těch obsahových patří mimo jiné alt popisky, meta popisky nebo klíčová slova.
Alt popisky (alternativní texty)
Jedná se o skryté popisky obrázků na webu, které slouží více účelům. Jednak je vidí vyhledávače a mohou je díky tomu zařadit do výsledků vyhledávání a zvýšit pravděpodobnost, že uživatel narazí na váš web. Jednak slouží jako náhradní obsah stránky místo obrázku v případě, že se obrázek nepodaří načíst. A také je užitečný pro nevidomé uživatele, kteří využívají nástroje pro předčítání obsahu stránek. Ve WordPressu je možné alt popisky velice snadno doplnit u každého nahraného obrázku.
Meta popisky
Díky těmto popiskům uživatel pozná, jestli na dané stránce/webu najde to, co hledá. Popisky se zobrazují ve výsledcích vyhledávání, například na Googlu, u každého z nabízených odkazů. V některých případech si Google sám určí, jaký text z dané stránky zobrazí, a vyplněný meta popisek může brát jen jako nápovědu. Meta popisky můžete ve WordPressu vyplnit u každé stránky pomocí nástroje specializovaného na SEO. My třeba používáme plugin Yoast SEO.
Keywords (klíčová slova)
Jak už označení napovídá, jedná se o slova (nebo fráze), které nejvíce vystihují obor vašeho podnikání a především je uživatelé používají při vyhledávání služeb a produktů, které nabízíte. Váš web by je tedy měl obsahovat ve vhodné míře na vhodných místech v textech. Ke zjištění, která klíčová slova používaná lidmi jsou pro vás relevantní, slouží analýza klíčových slov.
Hosting
Hosting je služba uložení dat vašeho webu na serveru (vzdáleném úložišti). Data se na serveru obvykle ukládají pomocí nástrojů označených zkratkami FTP a DB. Pokud webový vývojář potřebuje na server ukládat data, potřebuje od vás získat přístupové údaje, které jsou samostatné pro FTP a pro DB.
FTP
Zkratka pro File Transfer Protocol je protokol, pomocí kterého se na server soubory odesílají.
DB (databáze)
Do databáze se především ukládá obsah samotného webu a také data získávaná tím, jak uživatelé web používají. Mohou tam být uloženy údaje z uživatelských účtů, kontaktní údaje ze sběračů kontaktů nebo zprávy odeslané přes kontaktní formuláře a další data podle potřeby klienta.
Doména
Toto je adresa vašeho webu, kterou si musíte koupit u některého registrátora domén. Aby se uživatel po zadání vaší domény do prohlížeče dostal na vaši webovou prezentaci, je potřeba doménu takzvaně nasměrovat na hosting. To se dělá pomocí DNS záznamů.
DNS záznamy
Jedná se o textové informace, kterými se doména spojuje s dalšími službami – především s hostingem webu a e-mailovým hostingem. Slouží ale také například k ověření toho, že jste vlastníkem dané domény, u služeb jako je Google Search Console (GSC).
IP adresa
IP adresa je číselné označení zařízení v rámci sítě internetu. IP adresu má vaše zařízení pro připojení k internetu (např. wifi), ale také server, na kterém je uložen hosting vašeho webu. Uvedení správné IP adresy v nastavení domény můžete také zajistit nasměrování domény na vaši webovou prezentaci.
URL
Uniform Resource Locator je prostě webová adresa, kterou vidíte v adresním řádku vašeho internetového prohlížeče. Je unikátní pro každou stránku webu, pro každý obrázek, výpis výsledků vyhledávání a další elementy webu. Vytvořením vhodné struktury URL dosáhnete lepšího skóre u vyhledávačů (bude pro ně čitelnější).
Pokud je smazána nějaká stránka, obrázek apod. jeho URL stále existuje a můžou si ji pamatovat jak roboti vyhledávačů, tak vaši zákazníci. Podle situace je potřeba buď přikázat vyhledávačům, aby adresu vymazaly ze své databáze, nebo adresu přesměrovat na jinou relevantní adresu (obvykle stejného) webu. Vyhnete se tak tomu, aby měli uživatelé nepříjemný zážitek, když se prokliknou na stránku, která hlásí chybu.
GA4
Google Analytics 4 jsou aktuální verzí nástroje na měření návštěvnosti a chování uživatelů na webových stránkách. Pomůže vám zjistit, které stránky lidé nejvíce navštěvují, jak se návštěvnost vyvíjí v čase nebo jaké typy uživatelů si vaše stránky prohlíží a jaké typy zařízení používají. Vytvořili jsme návod na to, jak založit a sdílet přístupy do této služby.
GSC
Google Search Console vám poskytne náhled na to, jestli jsou všechny vaše stránky v pořádku z pohledu vyhledávače Google. Zajistíte s ní, aby byly stránky webu správně indexované (viditelné pro Google) nebo si uděláte představu o tom, s pomocí kterých vyhledávacích výrazů uživatelé nacházejí váš web. Vytvořili jsme návod na to, jak založit a sdílet přístupy do této služby.
GTM
Google Tag Manager slouží jako kontejner, do kterého se vkládají různé nástroje použité pro analýzu a propagaci webu. Při spouštění webu do něj umisťujeme Google Analytics a dále podle potřeby a dohody další služby jako Google Ads, Sklik, MS Clarity, Facebook Pixel a další. Vytvořili jsme návod na to, jak založit a sdílet přístupy do této služby.
MS Clarity
Nástroj od společnosti Microsoft umožňuje měřit návštěvnost webových stránek a jejich částí, a navíc zaznamenává také pohyb návštěvníků po podstránkách. Jednak formou videozáznamů obrazovky, jednak vytvářením tzv. tepelných map (kam uživatelé klikají) nebo také jak hluboko se lidé na stránkách posunují (scrollují).
Cookies
Cookie je krátký textový soubor, který si navštívený web ukládá v prohlížeči uživatele. Umožňuje webu zaznamenat informace o návštěvě a preferencích návštěvníka. Rozdělují se na technické (nezbytné pro správné fungování webu, např. volba jazyka), analytické (využívají je např. Google Analytics) a marketingové (slouží reklamním nástrojům jako Google Ads nebo Sklik).
Cookies lišta
V České republice, stejně jako v celé Evropské unii, platí od 1. 1. 2022 nařízení pro provozovatele webových stránek, aby uživatelům dali možnost rozhodnout, které typy služeb využívajících soubory cookies dovolí při své návštěvě spustit. Cookies lišta by se měla zobrazit každému novém návštěvníkovi webu a měla by obsahovat volby pro přijetí všech cookies, odmítnutí všech cookies (kromě nezbytných technických) a pro individuální volbu.
