Tendenze: mettiamo una foto come background del sito?

tendenzeSembra che nel web design del futuro ci sia sempre meno spazio per la grafica e per i fronzoli: presto, a spopolare, saranno le foto. Larghe e ovviamente bellissime, si sono messe in testa di sostituire noi web designer e di rendere, da sole, un sito accattivante e moderno.

Una volta venivano usate perlopiù da fotografi che riuscivano così a evidenziare in modo immediato le loro capacità; adesso la scelta di immagini e paesaggi come background, a sostituzione di pattern e sfumature, è sempre meno un fenomeno di nicchia. Anzi.

Pizzerie, alberghi, negozi di intimo, rock band: in molti ormai scelgono quest’impostazione grafica, ritenendola semplice ed efficace visivamente.

Come dare torto a questa convinzione? Una bella immagine può, effettivamente, fare la fortuna di un sito. Invoglia l’utente a rimanere nella pagina e sempre più spesso una foto può esprimere in pochi istanti concetti che, scritti o manifestati a parole, molto probabilmente perderebbero tutto il loro fascino.

Ma anche in questo caso il lavoro di un buon grafico non è da sottovalutare. Senza il giusto gusto estetico e determinati accorgimenti, è facile scadere in un lavoro rozzo e dall’effetto tutt’altro che attraente.

Come ogni altra scelta grafica, anche l’utilizzo di foto come background ha punti di forza e lacune.

Vediamo insieme quali sono.

in


Coerenza comunicativa

Devi realizzare il sito di un agenzia di viaggi, i cui concept basilari sono relax, turismo, paesi esotici? Una bella foto di un paesaggio di mare (una spiaggietta hawaiana, per intenderci) o di un panorama immerso nel verde, ha un impatto visivo molto forte e a livello irrazionale accende subito i desideri inconsci dell’utente.

ellenic

Lo stesso discorso vale se si progetta un sito fotografico: inserire nel background alcune foto è una tecnica astuta per coinvolgere l’utente e presentargli in modo immediato le competenze dell’artista.  In questo modo, gli eventuali contenuti testuali passano in secondo piano com’è giusto che sia, dato che saranno le opere a parlare.

ringve

barro

Il concetto chiave è: se utilizzate nei giusti contesti, le foto come background possono evidenziare graficamente i punti di forza dell’attività.

Contenuti testuali in secondo piano per far risaltare il background

Se proprio si vuole puntare sulle immagini, è necessario dargli ampio spazio. Allineare il sito a sinistra, come accennato in questo articolo, potrebbe essere un’interessante soluzione: infatti in questo modo l’immagine non viene soffocata dal sito, che altrimenti ne coprirebbe una buona metà.

bently

colibri

Trasparenze

Un’altra ottima scelta, sempre azzeccata, è quella di inserire i contenuti testuali su sezioni che conservano una percentuale di trasparenza tale da celare solo in parte l’immagine di sfondo. Le trasparenze non solo sono eleganti e possono dare un certo tocco di classe al sito, ma nelle tonalità del bianco e del nero sono facilmente adattabili a qualsiasi background. E dato che le foto sono generalmente composte da migliaia di pixel di ogni colore e sfumatura, questo è un particolare da non sottovalutare.

hoddow

Effetti sulle foto

Bianco e nero, magari con un solo accenno di colore. Color seppia. Anticato. Effetto pixelatura o sfocato. Ombreggiatura interna. Chi ha un minimo di conoscenza dei filtri di Photoshop (e chi non li ha, può sempre appoggiarsi alle centinaia di azioni già pronte reperibili on-line) può finalmente sbizzarrirsi. Attenzione a non esagerare o a non andare fuori tema, però! Utilizzando gli esempi di prima: se per un sito di un fotografo un soggetto in bianco e nero può essere una scelta ovvia e adatta, in un sito di un agenzia di viaggi è ovviamente da evitare. Il mare in bianco e nero non è certo una meta allettante per le proprie vacanze, no?

pizzaza

out

In-coerenza comunicativa

Che i paesaggi siano la pace dei sensi si sa, non è cosa nuova. Ma non è un buon motivo per abusare di colline e montagne, non ti pare? Si sta sempre più espandendo l’abitudine di utilizzare scenari panoramici per i propri background, indipendentemente dal soggetto della foto o dall’attività da promuovere. Ricordati sempre che lo sfondo non deve solo essere attraente ma deve anche e soprattutto essere coerente con il sito e rappresentarlo visivamente, in modo più o meno indiretto.
Evita di dare all’utente messaggi contraddittori o equivoci!


august

roar

Scarsa leggibilità

Il rischio di rendere i contenuti poco illeggibili c’è, e basta sfogliare qualche sito per rendersene conto. A meno che l’immagine non sia prevalentemente di un unico colore, è assolutamente da evitare l’inserimento dei testi direttamente sul background senza un’immagine di sfondo a fare da contrasto o una trasparenza che copre, almeno parzialmente, la foto.

danish

journal

Immagini di bassa qualità

Le immagini “pixelate” , che sono fastidiose già a piccole dimensioni, a 1000 pixel di larghezza sono un vero pugno in un occhio. La regola basilare per una foto in background è, manco a dirlo, che essa sia ad altissima risoluzione: le immagini di bassa qualità oltre a imbruttire tutta l’estetica trasmettono un chiaro messaggio di sciatteria che è, per gli utenti, un deterrente a lasciare immediatamente il sito in cui si trovano.

ixporte

Foto a discapito della grafica

Ricordati sempre che una foto, per quanto accattivante possa essere, non può e non deve sostituire completamente la grafica. E, soprattutto, non basta appiccicare sullo sfondo una bella foto per dire di aver fatto un buon sito: bellezza e senso estetico sono due componenti che è possibile rintracciare in ogni dettaglio.

Quindi che foto sia, ma con un particolare occhio di riguardo alla tipografia, agli abbinamenti di colore e a tutti gli altri elementi grafici della pagina.

E attento a non confondere la grafica minimalista con la grafica inesistente: sono due cose completamente diverse.

E ora, ispirazione.

Ti piace questo stile e cerchi l’ispirazione per un tuo progetto? Questa raccolta fa al caso tuo.
Questi siti utilizzano le foto in background in modo molto creativo, senza mai apparire scarni o disordinati.

1. All Jarreau

allj

2. Art of seduction

artseduction

3. Cie de Oorsprong

ciede

4. Ewt

ewt

5. Frizo

frizo

6. Guillaume Verdon

guillame

7. Hoddow

hoddow

8. La Novia

lanovia

9. Mellow

mellow

10. Mobitec

mobitec

11. This is leaf

thisis

12. Soaky

soaky

13. G2

g2

14. Easy bistro

easybistro

15. The salon

thesalon

Master per Web Designer Freelance
In tutti questi anni abbiamo ricevuto centinaia di richieste di approfondimento sulle numerose tematiche del web design vissuto da freelance. Le abbiamo affrontate volta per volta. Ma ci siamo resi conto che era necessario fare qualcosa di più. Ecco perché è nato One Year Together, un vero e proprio master per web designer freelance che apre finalmente le porte al mondo del lavoro.
Scopri One Year Together »
Tag: ,

L'autore

Web designer, lavora nel campo della grafica e dello sviluppo web da sei anni e al momento oltre a collaborare con una web agency gestisce con successo la sua attività di freelance sotto il nome di mascara design. Come molti freelance si è abituata a gestire più ruoli, spaziando dalla grafica cartacea allo sviluppo del codice xhtml e css; nonostante questo la sua passione rimane, sempre e comunque, la grafica per il web.

Sito web dell'autore | Altri articoli scritti da

Articoli correlati

Potresti essere interessato anche ai seguenti articoli:

7 commenti

  1. Daniele
  2. ale

Trackback e pingback

Non ci sono trackback e pingback disponibili per questo articolo

Lascia un Commento

Current day month ye@r *