Quali sono i trends del web design nel 2016? Ecco le ultime tendenze grafiche per aiutare le conversioni sul Vostro sito.

Il web design attuale è sempre più improntato all'esaltazione dei contenuti (veri veicoli di qualità): il design diventa una struttura nascosta, molto tecnica, per consentire la perfetta fruibilità su ciascun device. Lo studio dello stile si percepisce nel rigore dell'uso del colore e delle forme, con scopo funzionale alla navigazione. Solo la tipografia rimane protagonista, a dispetto della progressiva riduzione dei testi: le scritte non sono più poste per essere lette, ma per veicolare l'identità del sito, per rendere evidente la struttura dei contenuti e le call-to-action.
Nel 2016 la grafica del web matura e rende più efficaci le tecniche sviluppate durante il 2015, ma la sua funzione rimane immutata : intercettare l'attenzione del pubblico e agevolare le conversioni nel minor tempo possibile.

1.  Immagini a tutto schermo ( Hero Images )

Usare grandi immagini, a tutto schermo e video cattura l'attenzione del pubblico, aumentando la possibilità di conversione. Le immagini creano un contatto particolarmente efficace con il pubblico e studi dimostrano che ampie immagini sono maggiormente notate dal pubblico e ciò contribuisce ad aumentare i livelli di conversione.
Per enfatizzare l'effetto inserire :

  • sfondi video
  • sfondi cinemagraph (anche chiamato motion photography)

hero images

Fonte: http://uncharted.sunbrella.com/

2. Tipografia esasperata ( Drammatic Typography )

Dopo l'onnipresenza dei font open di Google, torna un'attenzione particolare per i font artistici e ricercati. In abbinata con le video/immagini a tutto schermo - in sovraimpressione e in bianco ( o comunque con forte contrasto) - il lettering viene enfatizzato dalle dimensioni ingigantite: catalizza l'attenzione nell'header e veicola l'identità del vostro brand in maniera decisa.

trends2015 tipografia

Fonte: http://tour.sydney.edu.au/

3. Layout con schermo DIVISO

Questo tipo di approccio è un ottimo modo di dividere l'audience e convogliare ciascuno nell'area del sito in cui è più probabile una conversione.
Se offrite diversi tipi di prodotti, servizi o categorie, ha senso portare il vostro pubblico sulla corretta landing page il prima possibile.
Usando un layout con schermo diviso, ciascun visitatore può scegliere e dirigersi dove ci sono maggiori possibilità di conversione.

  slip screen

Fonte: https://www.desktimeapp.com/

4. Card Design & Mansonry grid

Il design inspirato da Pinterest consente velocemente di vedere e cliccare su ciò che interessa e quindi dà maggior possibilità di conversione.
Questo tipo di interfaccia è molto efficace per l'e-commerce e per i magazine, ma ora è applicato anche da esercizi commerciali legati al food&beverage e dagli artigiani perchè consente una presentazione ottimale dei propri prodotti.
Nei i siti maggiormente creativi, si abbandona la rigidità dello stile flat con cards inserite una griglia fissa a favore del Mansonry style, ovvero una griglia che adatta i contenuti dinamicamente.

cards

 Fonte: http://www.theclymb.com/

5. Colori monocromatici ( con CALL-TO-ACTION in colore contrastante)

Una call-to-action in forte contrasto con lo sfondo omogeneo , salta all'occhio ed ha maggior probabilità di convertire: ad esempio usare un colore brillante per il bottone su uno sfondo monocromatico ( o l'esatto opposto) garantisce il focus del pubblico sulla vostra call-to-action.

call to action vibrant

Fonte: https://yearinmusic.spotify.com/it-IT

6. Creare livelli di priorità nella navigazione e Call-to-action sempre visibile

Dare una gerarchia agli elementi di navigazione, per indirizzare gli utenti esattamente dove volete per completare la conversione. Questo si ottiene mostrando solo le pagine più importanti nel menu principale, e nascondendo il resto in un menu secondario, quindi attirando l'attenzione sulla call to action principale, attraverso un preciso styling del bottone della call-to-action.
Quindi mantenere la call-to-action sempre visibile, inserendola nell'header fisso o nella sidebar per la versione desktop, e nel footer fisso per la verisone mobile.

  call to action

Fonte: http://special.bose.eu/en/soundTrueAroundEar/ov3

7. Call-to-action in layout a colonna singola

Indipendemente dal numero di colonne del vostro sito , interropere il flusso con una tagline che contiene la call-to-action in un un layout a colonna singola (eliminando quindi le sidebar) e con molto spazio attorno, si è dimostrato molto utile al fine di aumentare i click.

subscribe 1

Fonte: http://blog.mailchimp.com/

8. Less is more, anche per l'acquisizione di leads

E' possibile aumentare la propensione degli utenti a lasciare il proprio contatto email, rimuovendo tutti gli elementi di distrazione. Tutto ciò di cui c'è realmente bisogno è un titolo persuasivo e un unico campo di compilazione.
Mettere la richiesta di iscrizione in una landing page dedicata con la diretta indicazione dei benefits correlati all'iscrizione, massimizza le probabilità ottenere il contatto.

subscribe 2

 Fonte: https://yoast.com

9. Video, video, sempre più video

I video sono un ottimo modo di presentarvi al vostro pubblico e stabilire una relazione di fiducia, e quindi raggiungere maggiori leads e vendite.
Ottimi esempi di utilizzo di video sono:

  • Video di presentazione
  • Referenz
  • Demo di prodotti/servizi

 

  videos

Fonte: https://about.canva.com/

10. Mobile: Flat design 2.0

Il flat design rimane la scelta vincente per il mobile perchè questo stile garantisce la migliore responsiveness per la gestione degli spazi, per la percezione dei colori e la leggibilità della tipografia. Una usabilità ottimale è il target per il mobile: aumenta i volumi di interazione e massimizza le conversioni. In quest'ottica il flat design per il mobile tende ora a concentrarsi sul concedere maggior spazio agli elementi di interazione ( ad esempio i bottoni) e sulla qualità dei font scelti per consentire una leggibilità immediata.

mobile

Fonte: https://www.airbnb.it

Credits:


MDEIG 0

Miriam MONZA
Grafica + Comunicazione Integrata

certificazione google adwords seozoom

usiamo cookies a fini statistici per migliorare l'esperienza utente