Proč by měl váš web WordPress obsahovat lepivé prvky uživatelského rozhraní a jak je vytvořit

Tento příspěvek k lepkavým prvkům uživatelského rozhraní ve WordPress je od Lexie Lu.


Pokud jde o lepivé prvky uživatelského rozhraní, existují smíšené pocity. Někteří říkají, že – což může zahrnovat vše od možností sdílení sociálních médií až po informace o společnosti – způsobují špatné uživatelské prostředí. nicméně, dokonce i kritiky připustit, že to mohou být vysoce efektivní volby designu, pokud se to udělá správně.

Lepivé prvky (tlačítka, bloky obsahu, spolu s dalšími formami tzv "lepkavá navigace") jsou pevné prvky na stránce, které zůstanou na místě, když uživatel posouvá dolů. Když jsou lepivé prvky uživatelského rozhraní navrženy dobře as jasným účelem, výzkum ukazuje jsou to skvělý způsob, jak získat požadovanou akci od návštěvníka vašeho webu.

Stručně řečeno, váš web WordPress může používat lepivé prvky uživatelského rozhraní, aby maximalizoval hodnotu každé návštěvy vašeho webu. Tyto prvky mohou pomoci vést k odběru zpravodajů, následovat sociální média a další důležité výzvy k akci.

A co je nejdůležitější, mohou zlepšit uživatelský dojem. Se všemi těmito výhodami není divu, že lepkavá navigace je stále častěji jak roste v popularitě.

Poznámka editora. Vyrostli jsme, abychom si mohli užít i různé lepkavé prvky stránek. Blog CodeinWP používá jeden takový prvek sám a my jsme také učinili lepivou navigaci jednou z hlavních charakteristik Zerif – našeho nejoblíbenějšího tématu (viz ukázka). Proč? Funguje to pouze pro uživatele. Nechte si to Lexie podrobně vysvětlit:

Proč fungují lepivé prvky uživatelského rozhraní ve WordPressu

Efektivní využití lepivých prvků ve WordPressu může pomoci zprostředkovat důležité informace a usnadnit návštěvníkovi cestu na vašem webu. Jeden web elektronického obchodu zjistil, že začlenění lepivé navigace pomohlo zvýšit počet konverzí z 30 na 33 procent.

Samostatný test A / B provedený pro účely výzkumu zjistil, že 100 procent návštěvníků dávali přednost lepkavým designovým prvkům – i když mnoho z nich si nebylo úplně jistých proč.

Chcete-li využít sílu lepivých prvků uživatelského rozhraní ve WordPress, stačí si stáhnout plugin WordPress a sledovat, jak se vaše čísla zlepšují napříč deskou. Musíte pečlivě naplánovat, které prvky budou pro váš web fungovat nejlépe. Musíte také zajistit, aby tyto prvky – které mohou být někdy vybíravé, pokud nemáte zkušenosti s kódováním – fungovaly podle plánu.

Naštěstí existuje řada různých typů prvků uživatelského rozhraní a zásuvných modulů, které vám pomohou začlenit je na váš web WordPress:

Lepkavá tlačítka pro sdílení sociálních médií

Způsob, jakým lidé narazí na webové stránky, se změnil. Dlouho pryč jsou dny, kdy dorazí většina návštěvníků zadáním adresy URL a následným prohrabáváním obsahu. I když tomu tak někdy je, ze sociálních médií nyní přichází mnohem větší provoz.

V průměru jsou jednotky sociálních médií 31 procent veškerého provozu na webové stránky. I když je toto číslo pro některé webové stránky nepochybně nižší (a pro jiné vyšší), zdůrazňuje význam vytváření působivého obsahu.

(Graf podle Grafy a grafy WordPress Lite.)

Dobrý obsah je však jen prvním krokem. Můžete také uživatele nudit a zvýšit provoz doporučení tím, že lidem bude směšně snadné sdílet váš obsah. Dobrým způsobem, jak toho dosáhnout, je doprovázet váš obsah pomocí lepivých tlačítek na sociálních médiích.

WordPress nemá dostatek pluginů pro přidání lepivých / plovoucích tlačítek sociálních médií. Důležité je vybrat ten, který se chová intuitivně s designem motivu. Existuje tolik příkladů plovoucích tlačítek sociálních médií, že chovat se docela podivně na mobilním zařízení nebo při změně velikosti oken v prohlížeči.

Špatný design může mít opačný účinek, jak bylo zamýšleno, protože lepkavá tlačítka sociálních médií, která zakrývají text a fotografie, nepovedou k žádným sdíleným sociálním médiím. Podívejte se na weby, které se vám podaří, aby bylo uživatelské prostředí správné.

Experimentujte s mnoha zásuvnými moduly WordPress na tolika zařízeních a operačních systémech, kolik je možné, abyste se ujistili, že se vaše tlačítka na sociálních médiích chovají podle plánu.

Na CodeinWP je publikován dvoudílný seznam více než 30 pluginů pro sociální média. Jsem si jistý, že zde najdete ideální plugin.

Lepkavá informační schránka

V závislosti na vašich webových stránkách je někdy nutné, aby vaše lepkavá složka sdělila některé další informace na postranním panelu. Umístění kontaktních informací na své stránky je jednoduchá, ale účinná výzva k akci. 12Keys to dělá velmi efektivně tím, že poskytuje okamžité kontaktní informace, což je zvláště důležité pro návštěvníky, kteří mohou být v krizi.

12keysrehab

To může být také místo, kde pomáháte budovat důvěru zvýrazněním svých přihlašovacích údajů, cen a dalších položek v tomto směru. Je to také dobré místo pro přidání osobního kontaktu vysvětlením trochu více o sobě nebo vašem webu.

Naštěstí se jedná o nejjednodušší typ prvku, který lze na vašem webu implementovat. Nemusíte se starat o nic kromě textu a možná i hypertextového odkazu na váš e-mail. Tento plugin by vám měl pomoci:


Lepkavý prvek Lepkavý prvek

Autor: Stew Heckenberg

Aktuální verze: 1.3.5

Poslední aktualizace: 26. ledna 2019

sticky-element.1.3.5.zip


Hodnocení 74%


600 + instalace


WP 3.0 + Vyžaduje

Cílem je, aby prvek postranního panelu nebyl příliš honosný nebo rušivý. Bude tam, dokud bude návštěvník na webu, takže je nebudete chtít vypnout něčím špatně navrženým nebo příliš rušivým. Err na straně jednoduchosti, protože plovoucí postranní panel by měl být třešničkou na dortu pro doprovodný obsah.

Lepkavá menu

Lepkavé nabídky jsou možná nejspolehlivějším typem všech lepivých prvků uživatelského rozhraní ve WordPress, ale jsou také jedním z nejužitečnějších.

Myšlenka je jednoduchá. Když se uživatel posouvá dolů, nabídka zůstává pevně na svém místě.

Můžete to však implementovat několika různými způsoby:

a) Můžete jít na standardní umístění nahoře.

To je to, co tým ThemeIsle s nimi udělal Zerifské téma, například (můžete vidět live demo zde):

Zerif lepivé prvky

Dalším bonusem je, že nabídka není jednoduchá jednoradová nabídka, ale mega nabídka – když umístíte kurzor myši nad každou položku, odhalí propracovanější strukturu:

mega menu

b) Položte nabídku na stranu.

To je příjemná volba pro některé designy, a to zejména pro weby s vysokou fotkou, které vsazují na vizuální prvky, aby vyprávěly svůj příběh.

Zde je příklad z RichBrown.info:

RichBrown

Při rolování dolů je nabídka pevně nastavena doprava.

c) Položte jej na dno.

Spodní část je dalším zajímavým umístěním pro pevné menu, a zejména pokud chcete, aby byla nabídka o něco vyšší než jeden řádek textu.

Zde je příklad od bulletpr:

bulletpr

Jak vidíte, nabídka obsahuje obrázky + text, takže byla umístěna dole, aby nezabírala cenný prostor v záhlaví webu.

Lepkavé e-mailové registrace

Jak asi víte, jedním z nejlepších způsobů, jak oslovit své publikum, je e-mail. E-mail zaslaný do vašeho seznamu předplatitelů je pětkrát pravděpodobnější být viděn než příspěvek na Facebooku.

Vytvoření kvalitního seznamu předplatitelů e-mailů je rozhodující pro povýšení vaší firmy na další úroveň. Díky lepkavým formulářům je získání odběratelů snazší, než si myslíte.

Existuje mnoho způsobů, jak povzbudit návštěvníka webu, aby se zaregistroval do vašeho seznamu adresátů. Velkou pomocí může být lepkavá forma na postranním panelu nebo v horní části stránky. Jeden web, který to dělá dobře, je TwelveSkip, společnost digitálních médií. Jejich výzva k akci v horní části stránky je jasná a přitahuje pozornost, aniž by byla příliš v obličeji nebo rozptylovala..

twelfkip

Horní část vašeho postranního panelu je další dobré místo získat odběratele e-mailu. Někdy nebolí mít více míst, kde se lidé mohou přihlásit. Odběratelé e-mailů jsou tak cenní, že stojí za to věnovat zvláštní úsilí sestavení seznamu.

CodeinWP například používá pro tento účel více formulářů a mnoho lepivých. Jako tento:

codeinwp

Lepivé reklamy

Přiznejme si to – reklamy jsou pro většinu z nás nezbytné zlo. Naši čtenáři je nemají rádi a ani mnoho tvůrců webových stránek. Je však nezbytné platit účty a právě tam přichází digitální reklama.

Časopis používá svou reklamu jako lepkavý blok, takže když se posouvá dolů čtete nějaký článek.

čas

Je to mnohem méně rušivé než obří úvodní reklama nebo vyskakovací okno, takže není špatný způsob, jak generovat nějaké příjmy, aniž byste vypnuli příliš mnoho čtenářů.

Stejně jako veškerá reklama by to mělo být provedeno pouze s mírou. Stěna reklam vlevo nebo vpravo od článku se okamžitě vypne. Jeden nebo dva, spolu s odkazy na více článků, je dobrý způsob, jak jít o reklamě.

Kreativní lepivé prvky uživatelského rozhraní ve WordPressu

Kromě výše uvedených věcí můžete být při tvorbě lepivých prvků uživatelského rozhraní ve WordPress mnohem kreativnější, ale bude to také znamenat potenciálně více práce na jejich implementaci.

Zde je jeden příklad Gavick.com:

ostrov

Pokud jdete na tento web, všimnete si, že celý ostrov zůstává z větší části uprostřed, když přejdete dolů. Přepíná se mezi popředím a pozadím, ale vždy je ve středu. Tato věc opravdu upoutá pozornost uživatele.

Zdá se, že ve WordPressu opravdu není omezeno kreativní použití lepivých prvků uživatelského rozhraní… protože někdo dokázal udělat ostrov lepkavým.

Jak najít správný plugin?

Tady je žádný nedostatek pluginů na WordPress.org, který vám pomůže implementovat lepivé prvky do vašeho motivu. Někteří mohou skvěle pracovat s vaším tématem, zatímco jiní nemusí být pro váš web optimalizováni. Bude trvat několik pokusů a omylů, abychom našli ty, které fungují nejlépe.

Konečný výsledek bude stát za to, ať už doufáte, že zvýšíte provoz na sociálních médiích nebo předáte důležité informace čtenářům. Nezapomeňte své pluginy důkladně otestovat, abyste se ujistili, že neexistují žádné výstřednosti.

Lexie Lu O autorovi: Lexie Lu je nezávislý designér a blogger. Rád zkoumá nejnovější trendy a vždy má šálek kávy v těsné blízkosti. Spravuje to Design pečeně a lze je sledovat na Twitteru @lexieludesigner.

Všechny úpravy a vtipné přepisy od Karla K.

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map