Pokud se vrátíme do počátků vydavatelství, dostaneme termín „above the fold“ jako označení pro obsah, který se objevil v horní polovině titulní strany novin. Obsah nad záhybem se čtenářům jevil jako nejviditelnější, chytlavé titulky a živé obrázky se běžně používaly k upoutání pozornosti čtenářů v naději, že je při procházení kolem novinového stánku přesvědčí, aby si noviny koupili.
Nyní rychle přejděme k přechodu od aperitivu k digitálu, kdy stejní vydavatelé přesunuli své podnikání z tisku na internet. Jak se webový design od počátku 90. let vyvíjel, termín se nadále držel. Co tedy znamená above the fold pro vaši domovskou stránku? A má na něm význam i v roce 2019?“
Proč je pro mé webové stránky důležitý nadhmat?“
V době digitálního marketingu se nadhmat již nevztahuje ke skutečnému záhybu v novinách, ale k obsahu, který se při návštěvě webové stránky načte jako první, upoutá vaši pozornost a vtáhne vás dovnitř.
Ve světě webového designu, kde si děláte starosti s rozvržením a umístěním obsahu, protože obsah, který se objeví nad nadhmatem, je to, co je při načtení stránky návštěvníkem webu vidět jako první. Tento obsah je hlavní nemovitostí, která získává většinu pozornosti návštěvníků vašeho webu, a uživatelské prostředí by to mělo odrážet. Jakob Nielsen odhaduje, že „…uživatelé webu stráví 80 % času prohlížením informací nad záhybem stránky. Přestože dnes uživatelé více rolují, stále věnují pouze 20 % své pozornosti pod záhybem.“
Nejprve si musíte položit otázku: Co je nejdůležitější obsah, který mi pomůže dosáhnout mých obchodních cílů?
Jakmile si na tuto otázku odpovíte, budete vědět, co umístit do této vysoce viditelné oblasti. Obsah by měl okamžitě upoutat pozornost uživatele a představit mu obsah, který hledá, aby neodskočil a navštívil jiný web.
Rychlé tipy pro zvýšení konverzního poměru
- Hero Image: Nebuďte zde příliš éteričtí. Jak vypadají vaši spokojení zákazníci? Co prožívají? Zobrazte obrázek, který vyvolává pozitivní aspirace.
- Kopie v záhlaví: Neztrácejte srozumitelnost kvůli tomu, abyste byli chytří. Pokud matete, prohráváte. Držte se jednoduchého sdělení, které přesně zobrazuje, co děláte, nebo se vcítí do hlavní výzvy, které čelí.
- Výzva k akci (CTA):
- Tagline: Vaše primární CTA by měla být zřejmá a měla by být umístěna v pravém horním rohu navigace A v sekci pro hrdiny: Spojte jasnou kopii záhlaví s řádkem o jedné nebo dvou větách, který umístí vaši značku tak, aby pomohla vyřešit problém zákazníka.
- Navigace: Méně je více. Skvělý design webu vede uživatele přesně tam, kam chcete, aby se dostal. Příliš mnoho možností může vést k únavě z rozhodování.
- Rychlost načítání: Doba načítání vaší domovské stránky může být příčinou odchodu návštěvníků!
Umístění reklam nad záhybem zlepšuje jejich viditelnost a generuje větší příjmy z reklamy než reklamy umístěné na méně viditelných místech.
Jak změřit „záhyb“ v designu webu?“
Zkrátka nelze přesně určit, kde je na webu umístěn záhyb. Přesné umístění se liší kvůli různým velikostem obrazovek monitorů (stolních počítačů a notebooků), rozlišením obrazovek, zásuvným modulům prohlížečů a velikostem různých mobilních telefonů a tabletů.
Jako pravidlo se většina webdesignérů shoduje, že linie záhybu je zhruba 1000 pixelů široká a 600 pixelů vysoká. Jedná se o nejlepší odhad z nejběžnější kombinace monitoru a prohlížeče 1024×768 pixelů, kdy je okno prohlížeče maximalizováno a v horní části nejsou nainstalovány žádné panely nástrojů, které by obsah tlačily dolů.
Pokud vás zajímá, jak se dozvědět více, podívejte se do analytického programu svého webu (pokud žádný nemáte, skvělým začátkem je Google Analytics), který by vám měl být schopen říci, jaké jsou nejběžnější rozměry obrazovky vašich návštěvníků. Zatímco běžná velikost obrazovky 1024×768 je tradičně ta správná, na popularitě získávají nové rozměry, například 320×568 a 360×640, a to vše díky nárůstu prohlížení webových stránek z mobilních zařízení.
Mobilní prohlížení a responzivní design
V posledních několika letech výrazně vzrostlo používání mobilních zařízení pro prohlížení webových stránek, což dále komplikuje koncept optimalizace webového designu pro obsah nad záhybem.
Jedním z problémů je, že mobilní zařízení nabízejí velkou škálu velikostí obrazovek a také, že uživatelé na mobilních zařízeních většinou prohlížejí v režimu na výšku, nikoli na šířku. To má opět vliv na velikost, kterou musí návrhář zobrazit důležitý obsah.
Optimizely říká: „Vzhledem k tomu, že tolik lidí přistupuje k webovým stránkám na takovém množství zařízení, současné postupy webového designu zahrnují používání responzivního designu: využívání flexibilních rozvržení, obrázků a kaskádových stylů. V responzivním designu neexistuje žádné pevné rozvržení stránky a obsah se přelévá na obrazovku libovolné velikosti. Responzivní webové stránky reagují nebo „reagují“ na prostředí, ve kterém jsou konzumovány nebo prohlíženy.“
Přestože důležitý obsah musí být stále výše na stránce, v dnešní době by stránky měly být navrženy tak, aby uživatele lákaly k posouvání, aby jim důležitý obsah neunikl.
Záhyb bude jako koncept existovat vždy, ale je to pravidlo, které lze měnit nebo upravovat, zejména v průběhu času. Vzhledem k tomu, že existuje tolik různých zařízení a rozlišení obrazovek pro prohlížení webových stránek, se fold příliš liší od uživatele k uživateli, než aby se na něj dalo pravidelně spoléhat. Pokud však dbáte na to, abyste nad záhyb umístili pouze nejdůležitější prvky a obsah, můžete najít dobrou rovnováhu mezi použitelností webu a podáváním správného obsahu „nad záhybem“.
Další tipy na osvědčené postupy pro domovské stránky nebo na to, jak zlepšit rychlost webu, najdete v těchto blozích!
- 5 osvědčených postupů pro úvodní stránky
- 13 způsobů, jak zvýšit rychlost webu
Od vstupních stránek po úvodní stránky jsme pomáhali firmám, jako je ta vaše, vytvářet uživatelské prostředí, které vede k prodeji. Naplánujte si čas na rozhovor.