Analisi del sito web ""

42
Elena Bignami Vincenzo Calabrò Andrea Marassi WebMonsters 1MSTC Teorie e Linguaggi della Comunicazione Digitale e del Web Marketing

Transcript of Analisi del sito web ""

Page 1: Analisi del sito web ""

Elena Bignami Vincenzo Calabrò Andrea Marassi

WebMonsters

1MSTC Teorie e Linguaggi della Comunicazione Digitale e del Web Marketing

Page 2: Analisi del sito web ""

1

La storia di Angelo Poretti

Il Birrificio Angelo Poretti è un birrificio italiano.In seguito a varie acquisizioni il nome è diventato un marchio appartenente a

Carlsberg Italia S.p.a., società facente parte del gruppo Carlsberg.

Page 3: Analisi del sito web ""

Spazio del contenuto e spazio del paratesto

2

Page 4: Analisi del sito web ""

Lo spazio del contenuto

Cosa mi vuole far vedere il sito web?

IMMAGINI TESTI VERBALI

3

Page 5: Analisi del sito web ""

Lo spazio del contenuto

4

Page 6: Analisi del sito web ""

WebMonsters X Angelo Poretti 4

Lo spazio del paratesto

Dove sono, da dove vengo e dove vado?

STRUMENTI DI NAVIGAZIONE

5

Lo spazio del paratesto

Dove sono, da dove vengo e dove vado?

STRUMENTI DI NAVIGAZIONE

Page 7: Analisi del sito web ""

Lo spazio del paratesto Home Page

- Il logo perché risponde alla domanda “dove sono?”- La barra principale di navigazione- La barra di navigazione secondaria- I collegamenti ai social (facebook, twitter, instagram)- Le briciole di pane- Le immagini Visita il Birrificio e Momenti da Expo- Storia di Angelo Poretti- Expo 2015- Fascia “Le nostre birre”- Fascia “In cucina con Alma”- Fascia Approfondimenti con immagini cliccabili- Barra Footer con link utili, collegamento social, Expo

6

Page 8: Analisi del sito web ""

Saperi e Generi

7

Page 9: Analisi del sito web ""

Quali sono i saperi che il sito pone come condizione necessaria per essere utilizzato?

Saperi

8

Page 10: Analisi del sito web ""

Saperi Lingue necessarie:italiano o inglese

Familiaritàcon i social

Conoscenza del funzionamentodel logo della homepage

Conoscenza delle concezioni minime delle interfacce webDoppia barra di navigazione e footer

9

Page 11: Analisi del sito web ""

Il sito “www.birrificioangeloporetti.it” è un sito vetrina che pubblicizza i propriprodotti e pubblica materiale informativo.

Si appoggia al sito e-commerce esterno “www.vogliadibirra.it” per la vendita deiprodotti via internet.

Generi

10

Page 12: Analisi del sito web ""

Alberatura sitoHEADER- Visita il birrificio- e-Shop- Collegamenti Social Network- Lingua - Italiano - Inglese- Export

HEADER - ID/ Nome del sito- La storia-Il birrificio- Luppolopedia- Birre- Le ricette- Media

BODY- Slider fissi- Immagini navigabili- Testo- Collegamenti- Pulsanti

FOOTER- Birrificio Angelo Poretti- Birre- Link Utili - e-shop - cookie - www.beviresponsabile.it- Expo 2015- Icone social- Copyright

Generi Analisi di Benchmarking

11

Il sito “www.peroni.it” è un sito vetrina che pubblicizza i propri prodotti e pubblica materiale informativo.

Page 13: Analisi del sito web ""

Alberatura sitoHEADER- Visita il birrificio- e-Shop- Collegamenti Social Network- Lingua - Italiano - Inglese- Export

HEADER - ID/ Nome del sito- La storia-Il birrificio- Luppolopedia- Birre- Le ricette- Media

BODY- Slider fissi- Immagini navigabili- Testo- Collegamenti- Pulsanti

FOOTER- Birrificio Angelo Poretti- Birre- Link Utili - e-shop - cookie - www.beviresponsabile.it- Expo 2015- Icone social- Copyright

Generi

12

Il sito “www.birramoretti.it” è un sito vetrina che pubblicizza i propri prodotti e pubblica materiale informativo.

Analisi di Benchmarking

Page 14: Analisi del sito web ""

13

Lettore-utente modello

1. CARATTERISTICHEANAGRAFICHE

Page 15: Analisi del sito web ""

14

Per chi è stato progettato il sito web?

1. CARATTERISTICHEANAGRAFICHE

2. COMPETENZEINFORMATICHE

Lettore-utente modello

Page 16: Analisi del sito web ""

15

Lettore-utente modello 1. Caratteristiche anagrafiche

http://www.exactitudes.com

Sesso: UomoEtà: 27 anniInteressi: musica, moto e moda

Sesso: UomoEtà: 35 anniInteressi: arte, cibo e cinema

Page 17: Analisi del sito web ""

16

Lettore-utente modello 2. Competenze informatiche

http://www.exactitudes.com

Conoscenza delle concezioni minime delle interfacce webUtilizzo abitudinario di smartphone

Utilizzo del web anche per e�ettuare acquisti online

Page 18: Analisi del sito web ""

17

Azioni e desideri

Page 19: Analisi del sito web ""

18

Azioni e desideri

Quali azioni mette a disposizione il sito?

Page 20: Analisi del sito web ""

19

Azioni e desideri

ACQUISTARE INFORMARSI INTERAGIRE

Page 21: Analisi del sito web ""

20

Azioni e desideri Acquistare

Page 22: Analisi del sito web ""

21

Azioni e desideri Informarsi

Page 23: Analisi del sito web ""

22

InteragireAzioni e desideri

Il sito propone un viaggio virtuale completo all’ interno del mondo Poretti.Il lettore può seguire lo sviluppo del prodotto dalla sua nascita fino all’ incontro

con il consumatore.

Page 24: Analisi del sito web ""

23

Analisi dello Spazio visivo

Page 25: Analisi del sito web ""

24

“Angelo Poretti è marchio industriale della birra, che negli ultimi anni ha deciso di vestire i panni dell’artigianale per raggiungere nuovi segmenti di mercato, con

una scelta che ha rivelato una curiosa passione per i luppoli.”cronachedibirra.it

Brand Image e linea comunicativa generale

Page 26: Analisi del sito web ""

25

Brand Image e linea comunicativa generale

La strategia di Poretti – appartenente al gruppo Carlsberg – è iniziata qualche anno fa, e fonda la sua comunicazione su un numero variabile di luppoli da 3 a 10.

L’obiettivo è quello di intercettare i desideri dei consumatori, che rispetto al passato sono diventati più esigenti e diversificati.

Page 27: Analisi del sito web ""

26

Livello grafico-visivo

I contenuti visivi del sito sono chiari e ben organizzati.In alto a sinistra troviamo due paratesti:“Visita il birrificio” ed “e-shop” che rappresentano rispettivamente il chi e il che cosa andremo a raccontare.

In alto a destra si trovano i loghi dei principali social, che rimandano alla comunicazione integrata dell’azienda, spiegando come e con quali mezzi l’azienda comunica on-line.

Page 28: Analisi del sito web ""

27

Livello grafico-visivo

Provando a invertire le tonalità, ad usare una scala di grigi o un semplice bianco e nero il sito risulta sempre ben comprensibile, a favore dell’accessibilità da parte di utenti diversamente abili.

Page 29: Analisi del sito web ""

28

Livello grafico-visivo

In seguito ad un’analisi di Design e�ective Visuals (FENG-GUI) abbiamo notato quali sono le aree che attirano maggiormente l’attenzione nei primi 3 secondi di utilizzo:

Page 30: Analisi del sito web ""

29

Analisi della coerenza e dell’usabilità

Page 31: Analisi del sito web ""

30

Analisi della coerenza e dell’usabilità

Sono rispettate le principali funzioni di un sito, ma manca una funzione di ricerca semplice e pratica che possa aiutare il lettore nel ritrovare con immediatezza specifici contenuti.L’intero sito è progettato per fornire paratesti che rimandano ad “articoli testuali” più specifici, ma la mappa del sito non è presente e va implementata.Nel complesso il sito risulta avere una struttura semplice ma abbastanza intuitiva.

Page 32: Analisi del sito web ""

31

Analisi della coerenza e dell’usabilità

Page 33: Analisi del sito web ""

32

Analisi della coerenza e dell’usabilità

Page 34: Analisi del sito web ""

33

Analisi della coerenza e dell’usabilità

5. Non è presente un area Search

Page 35: Analisi del sito web ""

34

Analisi della coerenza e dell’usabilità

Page 36: Analisi del sito web ""

34 35

Analisi della coerenza e dell’usabilità

7. Non sono presenti menù a tendina in quanto i contenuti non sono molti8. Non ci sono contenuti promossi in homepage perchè il sito ha un e-commerce esterno9. Al contrario, l’home-page è molto pulita e non ci sono eccessi grafici

Page 37: Analisi del sito web ""

36

Analisi della coerenza e dell’usabilità

Page 38: Analisi del sito web ""

37

Modifiche sito web

Page 39: Analisi del sito web ""

38

Modifiche sito web

Lo stato dei tasti cambia passandoci sopra con il mouse, indicando di conseguenza una possibile interazione da e�ettuare.

Aggiungere Youtube nella barra di navigazione dei collegamenti social perchè è una piattaforma web di video sharing da sfruttare e da non sottovalutare.

Page 40: Analisi del sito web ""

39

Una barra di ricerca utile agli utenti per orientarsi all’interno del sito e scrivere ciò che desiderano trovare in velocità.

Modifiche sito web

Le icone di Instagram e Youtube non possono mancare nella sezione dei collegamenti ai social, in particolar modo su dispositivo mobile.

Page 41: Analisi del sito web ""

40

La mappa del sito all’interno della barra del Footer è indispensabile e molto utile perciò non può non contenere le informazioni più importanti del sito web.

Modifiche sito web

Page 42: Analisi del sito web ""

Elena Bignami Vincenzo Calabrò Andrea Marassi

WebMonsters

1MSTC Teorie e Linguaggi della Comunicazione Digitale e del Web Marketing