Per diversi anni la Net Semiology - disciplina della Comunicazione Relazionale Polisemantica - ha cercato di individuare le modalità comunicative più consone ad Internet, per realizzare pagine Web efficaci e provvedere al restyling di siti con problemi di comunicazione.

I tutto cercando di mediare tra le continue innovazioni tecnologiche e i capisaldi della comunicazione, cercando sempre di non sottostare al dominio digitale e alla tacita accettazione delle sue regole. 

In questo blog sono raccolte alcune delle strategie adottate nel corso degli anni: dai segni più idonei alle regole del testo; della navigabilità alle impostazioni grafiche, sonore, di animazione e funzionali. 

Tutti elementi orientati alla realizzazione un sito Web comunicativamente efficace. 

Buona lettura!

La comunicazione sul web si basa su una relazione bipolare tra l'Emittente del messaggio (il sito) e il relativo Ricevente (il navigante).

Quando tale relazione deve manifestare la serietà e l'autorevolezza dell'Emittente, come ad esempio nel caso di un'istituzione o di un'azienda, occorre utilizzare al meglio tutti i registri comunicativi (dal testo alla grafica) per esprimere al meglio tale ruolo.

A volte però il contenuto non è sufficiente ad esprimere tale aspetto, soprattutto se la relazione bipolare porta con sé l'esposizione di dati sensibili come il proprio indirizzo e-mail o il numero della carta di credito.

In questa circostanza gli utenti sul web non si sentono sicuri, temono frodi, truffe e furti d’identità. Tale mancanza di fiducia spesso li porta a mettere in dubbio l’attendibilità del sito e ad interrompere la navigazione.

Scende allora in campo il contenitore, in questo caso l'interfaccia del browser, che attraverso una semplice icona di colore verde a forma di lucchetto, presente accanto alla barra degli indirizzi, ribadisce l'affidabilità del sito in questione.

La semplice icona di colore verde presente accanto alla barra dell'indirizzo

Il 91% degli utenti risulta sensibile a questo avviso di protezione e il 43% abbandona il sito a causa di un avviso di mancata sicurezza.

In relazione ai messaggi di sicurezza il 40% del campione di utenti ha pensato: "Qualcuno sta rubando i miei dati", mentre il 24% ha pensato a problemi tecnici del sito.

Le reazioni dei naviganti all'assenza di sicurezza di un sito web

Quindi il lucchetto verde, oltre al prefisso https:// nella barra dell'indirizzo, è un elemento che infonde fiducia nei visitatori, spingendoli a continuare nella navigazione del sito.

Ovviamente l'icona verde presuppone l'impiego di una tecnologia di sicurezza, in grado di stabilire oggettivamente una connessione sicura che tutela la riservatezza dei dati e l’intercettazione da parte di terzi, oltre a garantire una miglior indicizzazione e posizionamento all'interno dei risultati di ricerca di Google e tempi di caricamento più rapidi del sito.

I vantaggi di un certificato SSL

Ma a livello di comunicazione e percezione la sicurezza si traduce in fiducia nei confronti dell'emittente che viene riconosciuto come affidabile proprio grazie al lucchetto verde in evidenza sulla barra degli indirizzi.

Potenza della comunicazione iconica!

Proponiamo un semplice esempio proposto dalla newsletter di Tape à l'oeil, il noto merchant di abbigliamento online, per comprendere l'importanza dell'utilizzo dei colori in relazione al contesto in cui vengono impiegati.

Il layout, proposto qui sotto,  è molto semplice, composto da uno sfondo bianco, su cui campeggiano pochi elementi grafico/testuali, che andiamo ad analizzare.

Il semplice layout proposto nell'esempio

1) il classico testo "SALE", proposto in nero, per creare con il background il massimo contrasto acromatico: dalla presenza di tutti i colori del bianco alla totale assenza del nero. Così il testo emerge con un forte valore impressivo che viene immediatamente memorizzato.

2) il testo "has started!" che accompagna "SALE" viene proposto in un corsivo rosso, il massimo colore emozionale. Quindi, nella successione cromatica, dopo un contrasto acromatico dal bianco al nero, ne troviamo uno acromatico/cromatico, dove il colore scelto è quello con il più alto valore emozionale.

Il rosso e il viola sono alle estremità opposte dello spettro dei colori visibili

3) Il cerchio con il valore dello sconto viene colorato di viola. Perché? Per rispondere alla domanda bisogna prima di tutto analizzare il contenuto del cerchio, composto da un valore di sconto molto elevato (più del 60%). Nella scala cromatica, o se preferite nello spettro cromatico, quale colore troviamo ad un'estremità? Proprio il viola. Quindi a un valore estremo (60%) viene fatto corrisponde un colore estremo (viola). Inoltre il viola, nella scala cromatica, è all'estremità opposta del rosso, utilizzato nel precedente testo in corsivo. Questo determina un ulteriore effetto di dinamismo.

4) Il testo inserito all'interno del cerchio è di colore bianco, come il background. Il bianco, nel sistema percettivo RGB, è la somma di tutti i colori. Già contiene tutto il mondo cromatico. Attraverso il colore del cerchio il testo bianco viene rivelato: è come se lo sfondo, apparentemente indistinto, rivelasse la sua essenza proprio nel cerchio viola, in questo caso il forte valore dello sconto.

Ricordate il vecchio mantra del web? I video, le immagini, i post brevi sono i contenuti preferiti dagli utenti dei social come Facebook e co.

Ormai tale postulato è stato largamente smentito: anche i long form riescono a creare engagement e interazione e, che sia per fare personal branding o per raccontare una storia aziendale, sempre più spesso si torna a ricorrere al formato “blog”.

Tra i vari strumenti che mette a disposizione Facebook ce n’è uno, spesso sottovalutato, in grado di adempiere alla funzione di stotytelling.

Si tratta delle Note su Facebook che, secondo quanto espresso dai piani alti della nota piattaforma social, risultano utili tanto per «fare un resoconto delle tue vacanze estive o di un evento importante della tua vita, quanto per dire la tua riguardo a qualcosa che hai sentito dai media o scrivere una lettera aperta da condividere con il mondo. O, persino, per condividere una ricetta speciale con tanto di lista degli ingredienti e foto di ogni step», come scrivono dal team di casa Zuckerberg.

Disponibili da sempre, erano state fino al restyling del 2015 poco sfruttate da utenti e pagine. L’aggiornamento puntò, allora, a renderle più «belle» e «personalizzabili»: permettendo, per esempio, di aggiungere un’immagine di copertina, inserire e modificare foto all'interno, formattare il testo e arricchirlo con titoli e citazioni.

Le Note su Facebook sono state parecchio apprezzate, in particolare per la loro vocazione decisamente mobile. Se è dai dispositivi mobile che proviene ormai la maggior parte delle connessioni, infatti, anche i contenuti non possono che adattarsi alle esigenze di utenti di questo tipo: velocità di caricamento e nessuna necessità di passare da un’app all’altra sono in questo senso il valore aggiunto delle Note su Facebook.

Non solo si può raccontare una storia personale, aziendale, o istituzionale, come nel noto caso di Matteo Renzi e delle sue iniziative #eNews e #MatteoRisponde, dalla cui analisi si può comprendere il corretto o errato utilizzo dello strumento (ma questa è un'altra storia).

Qualcuno si è cimentato nell'utilizzare le Note per fare marketing all'interno di una strategia più complessa, efficace, integrata.

Le avvertenze per i brand sono, per lo più, di buon senso:

• personalizzare il più possibile le proprie Note
• scegliere degli elementi grafici chiaramente riconoscibili e inserirli nell’immagine di copertina
• adottare un tono di voce che sia in linea con la propria immagine, i propri valori aziendali e il resto dei propri contenuti, come nel caso di Barilla e delle sue ricette.

La mission dei brand non è più parlare al maggior numero di persone possibile, ma intercettare, con delle campagne di comunicazione mirate, quelle nicchie di pubblico che gli garantiranno un reale ritorno d’investimento.

E così un numero crescente di aziende utilizza oggi l'influencer marketing per aprire nuovi canali di coinvolgimento, ampliare la brand awareness e orientare il processo di acquisto mescolando storytelling, engagement e promozione e offrire contenuti originali e autentici in grado di costruire una nuova modalità di relazione con la propria audience di riferimento basata sulla trasparenza e la fiducia.

Quando si pianifica una strategia di influencer marketing si parte facendo una scrematura iniziale, escludendo tutti coloro la cui fama sociale non è rappresentata da un numero di seguaci accettabilmente alto.

Tuttavia, l’esposizione è solo uno degli obiettivi di mercato dei brand, e neanche il più importante. L’associazione è il punto cruciale della strategia, e quindi parliamo della reputation dell’influencer che, associata al marchio, ne aumenta il brand value.

“Molte delle celebrity di Instagram scattavano foto molto belle. Ma stiamo assistendo a un cambiamento: non si tratta più di bellezza, ma della storia che raccontano”.
Quella di Kevin Systrom, co-fondatore di Instagram, è un’analisi che dimostra una verità sacrosanta: la forza trainante degli influencer deriva dal fatto che vengono percepiti come normali.

Accanto al brand ambassador si sta affiancando quella dell'influencer. La differenza tra i due sta nel concetto di "raggiungibilità" che sostituisce quello di "identificazione" tipico del testimonial.

Non si parte più unicamente dal presupposto della necessità del consumatore di identificarsi nel personaggio famoso, ma nel fatto che l’aspirante modella o lo studente di turno possano un giorno ritrovarsi ad essere ricchi e famosi come l'influencer, pur non avendo nessun talento particolare.

Un altro aspetto fondamentale generato dagli influencer marketing riguarda il product placement. In America, a seguito di varie lamentele, la Federal Trade Commission ha imposto l’osservanza di alcune linee guida per garantire agli utenti una maggiore trasparenza, tra cui l’obbligo di inserire nelle caption dei post a fini promozionali degli hashtag dedicati come #paid o #ad.

Apparentemente, questo snatura completamente un fenomeno – quello degli influencer – che deve il suo successo soprattutto al fatto che le voci di queste persone non somigliano a quelle delle televendite, né ai testimonial vecchia scuola – tirati a lucido per promuovere marchi e prodotti che non avrebbero mai utilizzato nella propria vita – ma, semmai, ricordano la genuinità del consiglio di un’amica.

Ma l'aspetto vincente di questa nuova strategia comunicativa è senza dubbio lo storytelling. Gli influencer rendono pubblici i propri momenti più intimi e riescono a ottenere l’attenzione delle persone, le quali vogliono che gli venga riconosciuto del valore.

Questa è la vera rivoluzione: la condivisione in real time delle informazioni e la possibilità di avere un contatto diretto con i propri inspirer e poter commentare e giudicare i loro contenuti. Questo rende la comunicazione sul web (apparentemente) partecipativa, condivisa e inclusiva.

Nel web siamo soliti pensare in orizzontale e verticale. Come per grafica stampata il layout impone di utilizzare prevalentemente moduli ordinati in griglie orizzontali e verticali.

Qualche volta ci dimentichiamo però che la presentazione continua dei contenuti "allineati e coperti" può alla fine risultare un po' monotona e distogliere la dovuta attenzione dai contenuti medesimi.

Apple e Nike, da sempre all'avanguardia nell'individuare le nuove tendenze, propongono ancora una volta in simultanea, un nuovo orientamento per la grafica: le linee diagonali.

Queste a differenza di quelle orizzontali e verticali godono di un maggiore dinamismo, in quanto sommano nel loro percorso le caratteristiche delle due precedenti: la calma di quelle orizzontali e la tensione di quelle verticali.

Ne risulta un impatto percettivo notevole, che ovviamente rimanda a quello delle forme o degli oggetti rappresentati.

Così Apple rilancia in diagonale le sue cuffie "beats", mentre Nike taglia l'ortogonalità delle immagini con maschere oblique per conferire maggiore dinamismo ai capi rteclamizzati.

Ogni tanto, per ravvivare la propria immagine aziendale, conviene pensare in diagonale.

Prendiamo in considerazione l'ultima comunicazione Web di Zenpark, uno dei principali gestori di parcheggi francesi.

Oltre alla furba operazione di cobranding (un concorso che permette di vincere l'ultimo modello di iPhone) e che genera l'inferenza egalitaria Zenpark = Apple, notiamo immediatamente come il design sia soprattutto "cromatico" con l'utilizzo di due colori ben definiti:

• verde in foreground
• magenta in background

Il banner di Zenpark con l'equazione di cobranding

I due colori non sono ovviamente scelti a caso in quanto il loro accostamento genera un contrasto cromatico, a cui viene sottintesa una determinata sensazione percettiva.

Prima di analizzare la proposta cromatica di Zenpark occorre fare una precisazione.

Nel mondo del design vi sono differenti sistemi di colori, dai quali partire per definire le proprie palette cromatiche.

Due sistemi cromatici molto utilizzati nel mondo del design sono quello dei colori primari e quello RGB

Uno dei più utilizzati è il tradizionale sistema dei colori primari ROSSO, GIALLO, BLU, spesso utilizzato nel design materico, vale a dire quello che prevede la colorazione di oggetti tangibili come un'automobile o un capo di abbigliamento.

In questo sistema possiamo ottenere differenti accostamenti, detti tecnicamente contrasti cromatici.

Da quelli più diretti e naturali a quelli più stridenti e vivaci. Questi ultimi vengono composti da un colore primario e dal colore risultante dalla combinazione degli altri due.

Ad esempio possiamo accostare il ROSSO alla combinazione degli altri due, vale a dire il VERDE che nasce dalla combinazione GIALLO+BLU.

Ecco che allora un oggetto di design colorato di ROSSO e VERDE rivela l'impiego di un CONTRASTO COMPLEMENTARE, molto dinamico e vivace.

Il secondo sistema utilizzato è quello del mondo della luce con i suoi colori fondamentali ROSSO, VERDE, BLU. È il sistema percettivo attraverso i quale i nostri occhi ricompongono il mondo cromatico e ovviamente quello con cui comunicano le interfacce video dei vari televisori, tablet, pc e smartphone.

Nel mondo del Web Design domina questo secondo sistema, atto a comporre interfacce immateriali, dotate di sola energia luminosa.

Anche in questo sistema possiamo ottenere differenti contrasti cromatici. Soltanto che cambia il sistema di composizione, in quanto la luce somma i colori in maniera differente rispetto alla materia.

Il ROSSO ha come COMPLEMENTARE il suo "negativo" nel mondo della luce, vale a dire il CIANO.
Così il BLU ha come COMPLEMENTARE il suo negativo, vale a dire il GIALLO e il VERDE ha come COMPLEMENTARE il MAGENTA.

Questi contrasti cromatici "positivo" - "negativo" sono ovviamente i più vivaci e dinamici in quanto prevedono l'utilizzo di un colore del mondo della luce e di quello a lui diametralmente opposto.

Ecco spiegato il CONTRASTO CROMATICO proposto da Zenpark: è un CONTRASTO COMPLEMENTARE VERDE-MAGENTA atto a definire uno stile di comunicazione molto spigliato e dinamico.

L'apparente calma della filosofia ZEN del brand nasconde un'energia notevole.

Con l'inizio della scuola il mondo delle app non va certo in soffitta, insieme ai vari salvagenti fenicottero, o alla cover impermeabilizzata per l'iPhone.

Gli americani, a cui piace stilare una classifica per ogni cosa che li circonda, hanno individuato le applicazioni e i software più utilizzati dagli studenti dei college americani.

Inoltre, in base al tracciamento dei vari istituti, è stata redatta una graduatoria anche dei siti più visitati

Vi proponiamo le infografiche tratte dal sito laptopstudy.com

APP

SOFTWARE

WEB

Senza scomodare Kandinsky e il suo fondamentale saggio "Punto, Linea, Superficie" dove vengono trattate al meglio le relazioni tra forma e colore, occorre sottolineare comunque l'importanza di gestire questi due aspetti del design in favore di un'altra componente fondamentale: l'interazione.

Questo significa che nel mondo dell'interazione, quando disegniamo una forma e le attribuiamo un colore non stiamo soltanto definendo una "percezione", ma una vera e propria azione.

Un pulsante circolare (forma inclusiva/esclusiva assoluta) colorato di rosso (sfera emozionale assoluta) richiama immediatamente ad un'azione "cruciale": la più importante all'interno della nostra interfaccia.

Così un pulsante quadrato (forma modulare) colorato di giallo (indice di transizione) invita all'esplorazione immediata del contenuto sottinteso al pulsante medesimo.

Bisogna stare attenti anche ad accostare le forme e i colori per definire al meglio la griglia percettivo/interattiva nello spettatore/utente.

Prendiamo ad esempio la combinazione dei colori primari rosso, giallo e blu, spesso utilizzata nel mondo dell'arte, della grafica e del design e riferiamoci a un caso recentemente proposto in una newsletter del Teatro Franco Parenti attraverso la quale si approda alla relativa pagina sul sito.

L'utilizzo dei colori primari da parte del sito del Teatro Franco Parenti

La grafica è composta da tre rettangoli (forma modulare) colorati rispettivamente di:

• rosso (emozionale)
• giallo (transizione)
• blu (razionale)

I tre rettangoli sottintendono ovviamente tre aree di interesse che, nel caso dell'emittente in questione si traducono in tre scelte di abbonamento a differenti tipologie di spettacoli.

Fin qui niente da dire in quanto la scelta dei tre colori fondamentali del mondo dell'arte vuole connotare al meglio la "mission" artistica del Teatro e definire tre percorsi tematici in relazione agli umori dello spettatore (vuoi emozionarti? scegli l'area rossa).

Peccato che il ruolo di interazione non venga ribadito dai tre rettangoli, come sarebbe stato logico aspettarci, ma da tre anonimi link collocati nel body della pagina.

Il ruolo di interazione viene affidato a link anonimi all'interno del body

Un'occasione mancata per permettere un'interazione più fluida e intuitiva da parte del navigante.

Inoltre la forma allungata in verticale dei rettangoli non fa altro che replicare lo stile bandiera, con la curiosa composizione di una bandiera rumena destrorsa.

Silicon Valley: la rivincita dei nerd è il titolo di un interessante documentario proposto recentemente da History.
Si tratta del racconto visivo della rivoluzione digitale, nata e sviluppatasi sulla West Coast americana: dalla nascita del Personal Computer, descritto fin dalle origini come  "strumento di libertà e di protesta" al ruolo svolto da personaggi simbolo come Bill Gates e Steve Jobs.

Un cambiamento epocale, sia dal punto di vista antropologico che sociale, tanto da poter ormai tracciare una linea di confine tra il precedente "mondo analogico" e l'attuale "mondo digitale".

Ma il punto sui cui si sofferma maggiormente il documentario è il fatto che questo cambiamento epocale sia dovuto a una cultura considerata ai tempi marginale e minoritaria.

Niente di più sbagliato, in quanto la cultura nerd è figlia di una doppia formazione.

Da un lato troviamo il clima accademico delle università californiane come Berkley, Palo Alto, Uc e Ucla.

Dall'altro ci sono invece le esperienze (anche estreme) della cultura hippie, che eredita dalla Beat Generation la ricerca comunitaria di nuove esperienze di aggregazione e coscienza, attraverso ad esempio la musica rock, la rivoluzione sessuale e l'uso di droghe e stupefacenti.

Se si semplifica troppo il significato di questo doppio innesto accademico-hippie, solo apparentemente antitetico, risulta poi incomprensibile capire come siano nati e si siano sviluppati la Free University di Palo Alto e il cosiddetto "Homebrew Computer Club".

Un luogo dove poter pensare a nuove tecnologie e modalità di comunicazione accessibili a tutti, dove Bill Gates sviluppava le sue intuizioni e dove muoveva i primi passi un giovanissimo Steve Jobs, da poco rientrato da un viaggio in India.

Un'idea di allargamento della mente individuale e sociale, con conseguenze alle volte estremamente imprevedibili.