Lepší FALLENS není hotový. Co přišlo po novém webu

Redesign skončil. Ostrý provoz začal.

První díl byl hlavně o tom, co jsme chtěli postavit: vlastní theme, nový checkout, mega menu, obsah a jasnější identitu FALLENS.

Pak přišel mnohem méně fotogenický seznam. Pomalý souhrn objednávky. Adresa, která po obnovení zmizela. Výdejní místo, které v objednávce nebylo stejné jako na obrazovce. Staré CSS v prohlížeči. Desítky zbytečných souborů. Staré URL ve vyhledávání.

Checkout vypadá jako jedna stránka. Pod kapotou pořád pracuje.

V prvním dílu píšu, že adresa, doprava, platba a souhrn objednávky jsou na jedné obrazovce. To pořád platí.

One-page ale neznamená, že server přestal existovat. Když vybereš dopravu nebo výdejní místo, e-shop si tuto volbu musí bezpečně uložit. Souhrn se totiž nemůže spoléhat jen na číslo, které právě svítí v prohlížeči.

Původně to znamenalo čekání. Zákazník klikl, server odpověděl a až potom se přepsala cena. Technicky správně. Pocitově asi tak svižné jako čekat na člověka, který před tebou u pokladny hledá drobné po kapsách.

Adresa a výdejna jsou nudné. Dokud nejsou špatně.

Právě ostrý provoz vytáhl několik věcí, které na návrhu obrazovky prostě nevidíš.

Nic z toho se nedostane na obrázek nového designu. Všechno to ale rozhoduje o tom, jestli ten nový design zákazníkovi skutečně pomáhá.

Web už byl nový. Prohlížeč si pořád pamatoval starý.

Jednou přišla zpráva, že nad způsobem doručení nejsou vidět adresy. Na serveru už tam byly. U zákazníka ne.

Důvod byl mnohem méně dramatický než chyba pokladny. Prohlížeč měl uloženou starší verzi CSS. HTML tedy bylo nové, ale jeho vzhled se pořád řídil starým souborem.

Řešení není velkolepé: správně verzovat styly a skripty. Je ale mnohem lepší než zákazníkovi vysvětlovat, že si má „vyčistit cache a zkusit to znovu“.

Pak jsme web začali opravdu měřit

Nový vzhled může působit rychle a přitom pod ním prohlížeč tahá věci, které nepotřebuje. A přesně to jsme našli.

Na veřejných stránkách zůstávaly zbytky starého tématu, knihovny používané jen někde a mega menu vykreslovalo obsah panelů i ve chvíli, kdy byly zavřené.

Mobil přinesl vlastní radosti: slider navržený jako desktop, menu bez správné náhrady, titěrné prvky a obsah posunutý zbytečně hluboko pod první obrazovku.

Tohle už se neopravuje zelenější zelenou. Styly mají být tam, kde jsou potřeba. Obrázky se mají načítat ve chvíli, kdy dávají smysl. A měřicí skripty nemají předbíhat samotný obchod.

Nový web potřebuje uklidit i staré adresy

Vyhledávač nevidí redesign jako jeden okamžik. Vidí staré URL, nové URL, přesměrování, mapu webu, kanonické adresy a obsah, který si někdy pamatuje ještě dlouho po změně.

Proto jsme řešili staré stránky, neaktuální adresy, dočasná přesměrování, duplicitní obsah a situace, kdy podobný text existoval na více URL současně. Ne proto, že by Google potřeboval drama. Právě naopak. Potřebuje co nejméně důvodů hádat.

Stejně tak jsme do administrace doplnili možnost pracovat s kanonickou adresou stránky, aniž bychom kvůli tomu museli překopávat jádro nopCommerce. Web tak může růst, aniž by každá další obsahová větev vytvářela nový malý SEO archeologický výzkum.

Nejen produkty. Také data za nimi.

Jedna z věcí, které chceme s novým webem postupně dělat lépe, je propojení produktu s informacemi, které zákazníkovi pomohou poznat, co vlastně kupuje.

U vlastních BBs proto na webu spojujeme produktové informace, naše výstupní kontroly a tam, kde jsou k dispozici, také veřejná metrologická měření. Ne proto, abychom každou produktovou stránku proměnili v laboratorní protokol, ale aby šla tvrzení dohledat dál než k marketingové větě.

Obsah už nemá žít každý sám za sebe

Nové kategorie blogu, série, slovníček, produktové stránky a poradenský obsah postupně propojujeme. Cílem není vyrábět články jen proto, aby každý týden přibyla další URL.

A pak přijdou věci, které zákazník nemá nikdy poznat

Část práce po spuštění byla výrazně méně poetická. Formulář komentáře se zasekl. Soukromá zpráva visela. Běžící aplikace držela některé soubory zamčené. Build někdy znamenal recyklovat proces, obnovit stránku a zkontrolovat, že zákazník pořád vidí funkční obchod.

Proč to celé trvá

Protože e-shop není obrázek v grafickém editoru. Je to běžící systém, který má současně prodávat, držet košíky, zapisovat objednávky, komunikovat s dopravou, zobrazovat aktuální obsah a nenechat se rozhodit starou cache nebo starou URL.

Velkou část změn proto dělám mimo hlavní provoz. Večer se dá měřit, nasadit, projít mobil, znovu naklikat checkout a ověřit, že adresa, doprava, výdejna i výsledná cena opravdu sedí.

Je nový FALLENS hotový?

První díl ukázal, co jsme postavili. Tenhle ukazuje, co znamená pustit to mezi skutečné zákazníky a postupně odstraňovat věci, které při návrhu nemáš šanci všechny vidět.

A ne, nebudeme z každého opraveného CSS souboru dělat díl číslo 3, 4 a 5. Série bude pokračovat ve chvíli, kdy bude další změna opravdu stát za samostatný příběh. Internet přežije i bez seriálu „dnes jsme opravili padding“.