Il punto di partenza

Il primo sito QualySource (maggio 2008 – gennaio 2009) riprende un mix di soluzioni collaudate ad alcune più innovative all’interno in una struttura tutto sommato tradizionale.

La griglia riprende i classici elementi Header, Footer per aprire e chiudere il sito e tre colonne che gestiscono menu, contenuti e “colonna di scopo” compatibile dalla risoluzione di 1200px a salire.

L’insieme cerca di essere leggero e non invadente nel tentativo di mettere in risalto i contenuti; un contenitore che dovrebbe esaltare il suo contenuto.

Punti salienti:
Header: logo dimensionalmente importante. Tentativo di differenziare i due ambiti “Web Strategico” e “Soluzioni Web”.
Footer: presenta la mappa del sito per agevolare l’utente.
Colonna sx: è la colonna dei menu. Uno principale scandito dai due macroambiti “Web Strategico” e “Soluzioni Web”. Uno  di servizio con l’acccesso alle aree piu’ trasversali (Network, DL e sito Mobile).
Colonna Centrale: contiene il testo.
Colonna dx: è la colonna di scopo. Contiene una form per il quick contact. Utile perchè presente in tutte le pagine permette di contattare QualySource in ogni momento senza dover andare in una pagina specifica.

Gli ambiti spaziali

Il dettaglio: header

Il logo è ampio, essendo leggero non appesantisce particolarmente la pagina.
La scritta QualySource viene retta da dei fili verdi che giocano in trasprenza con il logo, creando un effetto piacevole ma di ambigua lettura.

L’header “contiene” una sorta di indicatore/segnalatore di quale macrosezione stiamo navigando.
L’aggiunta di tali indicatori invece di facilitare l’utente rende l’insieme un po’ confuso e sbilanciato.

Il dettaglio: colonna sinistra

Il menù principale è chiaro, leggibile ed ordinato.

Si distinguono due macroambiti,  uno relativo al quello istituzionale ed uno relativo alle pagine maggiormente di “servizio”.

Si è scelto un trattamento grafico distinto dando più peso al menù in basso per bilanciarne la posizione meno evidente rispetto a quello principale.

L’unico effetto concesso è un mouseHover sulle voci del menù di servizio che apre anche delle “tendine” (sono state scelte perchè permettono di articolare più argomenti risparmiando spazio in altezza).
Per contro il menù principale è stato lasciato espanso per esplicitare da subito i contenuti trattati.

Il dettaglio: corpo principale

Lo spazio per il contenuto è leggermente delimitato in alto per rendere immediata l’individuazione degli ambiti funzionali senza appesantire la pagina.

La formattazione testuale e’ su tre livelli:
Titolo sezione (a destra per bilanciare i pesi), Claim e Contenuto.

Sulla destra, presente in ogni sezione, il modulo di contatto rapido occupa tutto lo spazio disponibile nella terza colonna.

Il dettaglio: footer

Il footer chiude in modo chiaro il sito riportando sulla destra la navigazione principale.

Il posizionamento è stato scelto nell’ottica di agevolare l’utente che se ha “scrollato” la pagina fino in fondo avrà probabilmente il mouse già posizionato in quella zona dello schermo (la barra di scorrimento è difatti a destra della pagina).

Analisi qualitativa

Fattori positivi (pochi in effetti):
Il sito è facilmente leggibile, i contenuti chiaramente esposti.

Il colpo d’occhio individua chiaramente gli ambiti funzionali dell’interfaccia permettendo una lettura facile e senza intoppi.

I menù sono altrettanto chiari e fruibili.

Fattori negativi (Molti a dire il vero):
A dispetto della leggibilità ci sono dei problemi nell’orientamento dell’utente che può perdere traccia della sua posizione all’interno dell’organizzazione dei contenuti.

Manca un vero e proprio navigatore e l’unica indicazione che chiarisce in quale macrosezione si sta navigando è data dall’indicatore colorato nell’header.
Si tratta di un messaggio ambiguo e assolutamente non coerente con il resto dell’interfaccia.

L’interfaccia, inoltre, è troppo neutra, non dichiara nulla, si pone come mero contenitore. L’approccio di per se corretto per un brand conosciuto può essere un minus per un marchio sconosciuto. L’utente non percepisce dall’interfaccia nulla se non la funzione, in questo modo non si può riconoscere nei servizi erogati non percependo rapidamente il valore aggiunto di QualySource.
Il lato più negativo è proprio questa neutralità che certamente pone l’accento sui contenuti ma non gli introduce o accompagna in modo abbastanza forte.