Principi di grafica e layout tutor Rosa Domestico corsista Giulia Cannavale ( I5)

professionalmente e individuare: Attività Selezionare un sito esistente di buon impatto grafico e costruito professionalmente e individuare: Layout. il sito segue un layout fluido o fisso? Si adatta a più risoluzioni? Cambia il suo aspetto su diversi monitor e su diversi browser? Uso del colore: il sito usa colori per individuare sezioni? Esiste un tentativo di comunicare attraverso i colori un messaggio specifico? La palette utilizzata rispetta le armonie di colori? Se si a quale schema corrisponde? Testi: quali font sono stati utilizzati? Quale dimensione, colori sono stati utilizzati? Il testo è diviso in paragrafi? Immagini: le immagini eventualmente presenti sono rilevanti, interessanti, attraenti? Rispettano complessivamente i requisiti di qualità e posizionamento nella pagina?

Menù principale di navigazione Il sito che andrò ad analizzare è quello della “TELEPASS S.p.A. ” una società creata per svolgere le attività relative all’emissione, commercializzazione e gestione dei sistemi di pagamento elettronico Telepass e Viacard di Autostrade per l'Italia. Layout. il sito segue un layout fluido o fisso? Si adatta a più risoluzioni? Cambia il suo aspetto su diversi monitor e su diversi browser? Il sito segue un layout fisso, in quanto il suo contenuto mantiene sempre la stessa larghezza. Inoltre, non subisce modifiche a livello di risoluzione e verticalmente ( nei primi 600px) sono presenti ”elementi fondamentali quali: Logo Menù principale di navigazione Almeno una parte del menù secondario di navigazione” 1 . Aprendo la pagina con browser e monitor diversi, ho potuto constatare che il suo aspetto non cambia, ma è sempre lo stesso. 1Fiamberti, Piccinotti - “Principi di grafica e layout” – pag. 6

Uso del colore: il sito usa colori per individuare sezioni? Esiste un tentativo di comunicare attraverso i colori un messaggio specifico? La palette utilizzata rispetta le armonie di colori? Se si a quale schema corrisponde? Il sito non usa colori specifici per individuare sezioni particolari, ed ha un’apparenza molto sobria ed elegante, in quanto utilizza quasi esclusivamente uno schema complementare. Infatti, accostando “due colori complementari si ottiene un effetto di massimo contrasto rafforzando la luminosità di entrambi.” 2 Attraverso l’uso del giallo/aranciato si vuole comunicare disponibilità, mentre col blu più scuro dei contenuti e della scrittura, forza e credibilità. La palette utilizza un insieme di tonalità armoniche con colori a saturazione abbastanza alta, e a luminosità media che però risaltano moltissimo sullo sfondo tutto bianco. 2 Fiamberti, Piccinotti - “Principi di grafica e layout” – pag. 8-9

Le parole su cui focalizzare l’attenzione sono in grassetto. Testi: quali font sono stati utilizzati? Quale dimensione, colori sono stati utilizzati? Il testo è diviso in paragrafi? Il colore del carattere è prevalentemente il blu, anche se il contenitore di Telepass club ha i font di colore nero. Tutti i caratteri utilizzati sono semplici e facilmente leggibili, perché il sito ha l’obiettivo di acquisire nuovi clienti. Le parole su cui focalizzare l’attenzione sono in grassetto. Ci sono carattere bastoni (sans serif senza grazie) “che non hanno terminazioni e che risultano più riconoscibili sul monitor.” 3 Tutti i testi sono prevalentemente allineati verso sinistra, tranne per le News, il cui testo è centrato e sono divisi in paragrafi. 3 Fiamberti, Piccinotti - “Principi di grafica e layout” – pag. 16

Immagini: le immagini eventualmente presenti sono rilevanti, interessanti, attraenti? Rispettano complessivamente i requisiti di qualità e posizionamento nella pagina? Le immagini sono scelte con cura, ma sono poche e sono volte solo ad introdurre e a rappresentare esclusivamente la sezione nella quale il sito ci vuole condurre. Non sono particolarmente interessanti, anche se talvolta vogliono cercare di comunicare al visitatore la soddisfazione di chi usa questo tipo di prodotto e quindi sottintendono ad un minimo di ricerca comunicativa. Le foto sembrano professionali e, quindi, di buona qualità, anche perchè presentano dei tagli creativi (crop), tendenti a focalizzare l’attenzione su volti sorridenti, proprio per provocare particolari emozioni, come d’altra parte la stessa posizione strategia, subito sotto la barra dei menù.