4 trendy ve webdesignu pro rok 2018

Webdesign není vytištěná vizitka, nestačí zvolit trendy písmo nebo nápadité provedení, musí být také funkční pro uživatele. To je mantra, kterou by měli mít všichni webdesignéři na paměti.

Žádný trend nevzniká ze dne na den. Všechny uvedené prvky už nějakou dobu můžete vidět na internetu a my očekáváme, že bude jejich výskyt přibývat. Tady jsou top 4.

1. Monotónní pozadí nahradí gradienty

Gradient v řeči designérů označuje barevný přechod. Obvykle mezi dvěma podobnými barvami – například modrou nebo zelenou. Důkazem je i změna loga Instagramu. Vlevo vidíte podobu z roku 2013 a takto vypadá dnes:

  

Existuje několik variant, jak s gradienty pracovat, ale základní principy se nemění. Nejčastěji se setkáte s 2 tónovým gradientem  (výjimečně 3 tónovým). Jedná se o výrazný prvek, používá se proto v kombinaci s jednoduchými elementy (tzv. flat design). Gradient často pracuje s vnitřním a vnějšími stíny.

Takto například využívá tento trend agentura PragueBest:

2. Slidery nahradí animace a video

Mnoho webů využívá slider – tedy několik bannerů s textem, které se mění. Ideální je tento element pro e-shopy, které promují sledovou nabídku a další akce.

Prvek ale převzaly i weby, které takto prezentují své konkurenční výhody nebo nabídky. Ovšem slider se přetáčí pomalu (jinak by uživatel nestihl přečíst popis) a uživatel nerad čeká. Proto čím dál více firem prezentuje výhody svých služeb ve videu nebo pomocí animací, které snáz strhnou pozornost.

Takhle s animacemi pracují české weby.

Například úvodní stránka realitní kaceláře Svoboda&Williams vás rovnou zahrne ukázkami svých interiérů:

Naše stránka VstupniStudie.cz využívá video také, a to jako ilustraci. Designérka kreslí wireframe mobilního webu:

3. Animace na stránce

Animace mají svůj smysl i na stránkách, vytáhnou totiž uživatele z letargie, když scrolluje. Mohou také uživatele skvěle vtáhnout do příběhu a do stránek jako takových. Je to přesně ten hravý prvek, který uživatele zaujme. Pracovat můžete třeba s těmito typy animací:

• Parallax efekt při scrollování
• Přesun mezi stránkami
• Animace v některých sekcích
• Efekty po najetí myší

Některé animace mohou být náročné na načítání, na to pozor. Je nutné animace otestovat, aby se načítaly rychle a nepokoušely trpělivost uživatelů.

Výbornou ukázku najdete na webu nástroje Ecomail. Animace vám představí, jak snadno se s nástrojem pracuje:

Velmi zajímavě lze pojmout nudné slidery. Například jako na webu designérského studia MFart.cz:

4. Využití zajímavé typografie

Tento trend je vidět především na zahraničních webech, ale do Čech už také proniká. V pozadí je především snaha firem se odlišit a lépe prezentovat svou filozofii. Logicky nemůže stejně psát právník a výrobce skatebordů. Letos se prostě krom obsahu změní i forma.

Z písmen se tak stává silný vizuál firmy. Fonty v nás přirozeně vyvolávají emoce, zatímco k nám mluví.

Díky novým technologiím, které přinášejí kvalitnější displeje, si s písmem mohou designéři konečně vyhrát a mohou používati méně tradiční fonty. Všechny prohlížeče dnes podporují i možnost vytvářet vlastní, řekněme hand-made, fonty, které si firma vytvoří na míru.

Trendem je využívat velká písmena a kontrasty mezi patkovým a bezpatkovým písmem. Zlepšuje to čitelnost, je to atraktivnější a snáze to přiměje uživatele dočíst vše, co jste pro ně napsali.

Takto si náš grafik pohrál s fonty pro designéra luxusních skleněných soch:

Jak s trendy pracovat?

Můžete se jim podvolit a využít je, nebo naopak jít proti proudu. Proti jde tradičně Apple, který je známý svým minimalismem. I to je cesta, jak se odlišit od konkurence. Obecně je vždy třeba uvážit, jaká jsou specifika vašeho oboru a očekávání vašich zákazníků.

Ještě je potřeba připomenout dva trendy z oblasti vývoje.

Prvním je mobile first. Google totiž považuje mobilní verzi za určující, pokud vám špatně funguje mobilní verze webu, nevyhodnotí váš web jako přínosný pro uživatele a ve vyhledávání dá přednost konkurenci. Proto je je důležité od začátku myslet na to, jak budou animace a další moderní prvky fungovat responzivně v mobilech. O Mobile First jsme psali zde.

Druhým jsou tolik omílaná tlačítka, tzv. ghost buttony. Jedná se o tlačítka, které jsou nenápadná, například jen vyznačená rámečkem. Grafici je milují, protože decentně zapadnout do grafiky. UXáci je nenávidí, protože je uživatelé přehlédnou.

Jelikož uživatel má vždy pravdu, navrhujte vždy tlačítka výrazná. Existuje celá řada průzkumů, které dokazují, že výrazné tlačítko zvyšuje konverzní poměr. Takže my v AITOMu doufáme, že rok 2018 bude rokem, kdy ghost buttony definitivně odejdou do křemíkového pekla (protože křemíkové nebe si nezaslouží).

Zpět na články