1. Strumenti e Applicazioni del Web
Andrea Testa
Valeria Gennari
Silvia Antognazza

2. Di che cosa parliamo oggi?
Google Chrome
e in dettaglio:
1. perchè Google Chrome è un browser moderno
2. plugin, plugin, estensioni, estensioni
3. con la testa nella cloud

3. Pubblicità a parte (cfr Note)
Google Chrome è uno dei tanti browser moderni perchè:
ideato nel 2008, licenza
open source
Integra V8, LA virtual
machine per javascript
Supporta HTML 5.0 (non
del tutto), CSS 3.0: AJAX

4. Chrome ci permette di...
...avere un browser multi-processo efficiente
Ogni scheda è un processo, ognuno di essi esegue più Thread.
Basta chiudere una scheda per liberare subito spazio
E se navighiamo in un sito pericoloso?
Ogni tab è eseguito in una sand-box per la massima sicurezza.

5. Quando interpretare non basta...
...è necessario accendere V8!
V8 è un software che elabora il
javascript di una pagina.
In linguaggio informatico,
V8 è una vera e propria
macchina virtuale che NON
interpreta
ma compila ed esegue il (per gli smanettoni)
codice, http://www.youtube.com/watch?
feature=player_embedded&v=hWhMKalEic
Y
con risultati esaltanti =

6. Per rendere migliore il web...
HTML, CSS, JAVASCRIPT sono
gli strumenti aperti che permettono
di costruire un web migliore, un
web migliore eroga servizi migliori,
un servizio migliore ci fa stare
meglio.
HTML, CSS, JAVASCRIPT
costruiscono browser migliori.
Plug-ins ed estensioni sono funzioni extra, che
personalizzano e migliorano il browser aggiungendo nuove
funzionalità nella stessa pagina che stiamo visualizzando.

7. Google Chrome e Firefox sono due
esempi di browser moderni:
Un browser moderno è aperto non solo alla comunità degli
sviluppatori, ma anche e soprattutto a chi fa del web la
propria passione e lavoro.
Permette di essere
personalizzato (con estensioni)
con gli stessi strumenti che
usereste per disegnare una
qualunque pagina di un sito
web.

8. Che cos'è un plug-in
Un plug-in è un software
aggiuntivo appositamente creato
per elaborare alcuni contenuti.
Un plug-in NON si interfaccia
quasi per niente con un browser,
è libero di operare all'interno di
uno spazio apposito.
Un determinato plug-in può funzionare in molti browser,
solitamente è scritto in un linguaggio di programmazione
vero e proprio (java, C++, C#).

9. E un'estensione
Le estensioni sono piccoli add-on
(programmi supplementari) che è possibile
installare sul browser per aggiungere
funzionalità.
Le estensioni sono scritte appositamente
per uno specifico browser, e usano le API
che vengono messe a disposizione dagli
sviluppatori, sono scritte solitamente con
metalinguaggi (html, xml) e linguaggi di
scripting (javascript)

10. Differenze tra plug ins ed estensioni
Tecnologicamente la differenza plugin ed estensioni non è
netta: potremmo distinguerli non ufficialmente per il
linguaggio con cui sono scritti, oppure per il codice sorgente
(dei plugin), SE fosse disponibile.
Confrontiamo il
peso dei
pacchetti
Plugin: Adobe Flash per Firefox (7.73 Plugin: Adobe Flash per IE 9 (7.81 Mb)
Mb) Estensione: McAfee (2.27 Mb)
Estensione: McAfee (0.98 Mb)

11. Differenze tra plug ins ed estensioni
Cosa cambia per l'utente finale? NULLA
Evernote per Chrome Evernote per Firefox
Evernote Web Clipper ci permette di appuntare piccoli
messaggi di testo su una bacheca virtuale, il funzionamento
delle due estensioni (per Chrome e per Firefox) è
assolutamente identico.

12. Facciamo alcuni esempi: PLUG-INS
Adobe Flash è il plug-in per eccellenza,
uno dei più conosciuti.
Flash ci permette di vedere video e
contenuti multimediali
La Java Virtual Machine viene installata
nel pc per poter eseguire gli applet e i
contenuti web dinamici

13. Facciamo alcuni esempi:
ESTENSIONI (DI CHROME) I
L'estensione di notifica e-mail
mostra un avviso nella barra degli
strumenti del broswer.
In questo modo non sei costretto ad accedere alla posta
in una finestra separata per controllare se ci sono nuovi
messaggi.
Ci sono anche estensioni che funzionano silenziosamente
in background (per formattare automaticamente le
pagine web nel tuo stile preferito), senza che l'utente si
accorda di nulla.

14. Gmail Avvisi, una piccola demo
http://www.youtube.com/watch?v=qEsLCftdAk8
(0:35)

15. Facciamo alcuni esempi:
ESTENSIONI (DI CHROME) II
GooEdit ci permette di modificare al volo
l'immagine di una pagina web,
semplicemente selezionandola.
Possiamo caricarla su picasa, taggare un nostro amico su
facebook oppure twittare l'url con il nostro account.

16. GooEdit, come funziona
http://www.youtube.com/watch?v=as1JdLpbBHc
(1:07)

17. Facciamo alcuni esempi:
ESTENSIONI (DI CHROME) III
exfm ci permette di raccogliere
la musica presente sul sito ex.
fm.
La musica proposta non è casuale, ma basata sulle nostre
precedenti navigazioni web.
exfm ci consente di avere in un unico punto la musica dei
nostri artisti preferiti a partire dalla nostra cronologia.
Non mancano funzionalità social e possibilità di creare
playlist.

18. Exfm: demo
In questa demo mostriamo anche come cercare ed installare un'estesione
per google Chrome.
http://www.youtube.com/watch?v=M_JVyCVQ4QA (2:41)

19. La gestione di Chrome
Cliccando sulla chiavetta che si trova nella barra degli
strumenti è possibile accedere al Task manager, che
permette la gestione pubblica dei plug-ins e delle
estensioni.
Ogni plug-in o
estensione è un
elemento a se
stante.

20. La gestione nascosta
Gli "addetti ai lavori" possono anche
raggiungere una gestione avanzata di
estensioni e plug-ins.
La visibilità di queste impostazioni è limitata:
bisogna infatti conoscere il comando esatto e
digitarlo nella barra degli indirizzi.
All'interno di queste sezioni possiamo leggere e
modificare le varie impostazioni tecniche
Si raggiungono solo digitando in una nuova scheda
"about:extensions" e "about:plugins".

21. Store: chi cerca, installa
Il chrome store è uno spazio in cui
scaricare le app e le estensioni.
Per installare le app è necessario
un account e se cambio pc le ritrovo
sempre e comunque...
Ricerco Leggo la recensione ...e "installo"

22. Firefox: l'erede di Netscape
Firefox è opensource,
multipiattaforma, sfrutta
Gecko come motore di
rendering
Firefox ha sempre puntato
sulla personalizzazione con
ricche API
Mozilla Foundation è una organizzazione no-
profit che promuove tecnologie aperte,
innovazione e partecipazione in Internet.

23. Firefox: alcune estensioni
Yoono: è la più
scaricata, tutti i
social a portata di
click

24. Yoono: in dettaglio
E' possibile ottenere tutti gli
aggiornamenti, modificare il proprio
stato e condividere Facebook,
Twitter,LinkedIn, YouTube e altro
ancora - tutto in un’unica finestra.

25. Yoono: funzionamento
http://www.youtube.com/watch?v=BLPTQULcC6o
(1:35)

26. ImTranslator by Smart Link Corporation
E’ uno strumento che in
tempo reale fornisce la
traduzione del testo in
numerose lingue;
Dopo la sua installazione è
necessario settare le
impostazioni di base
definendo in quale lingua si
vuole avere
la traduzione

27. ImTranslator, una breve demo
http://www.youtube.com/watch?v=O436cvXPnzU
(0:44)

28. Adblock plus: sicurezza prima di tutto
Permette di dire no alla
pubblicità nel web.
E’ possibile scegliere tra
più di una quarantina di
sottoscrizioni di filtri che si
configurano
automaticamente
Scongiura richieste da
E' opensource: repository parte di host noti e
pericolosi

29. InvisibleHand: ok il prezzo è..
Ci permette di ottenere
automaticamente il prezzo più
basso quando si effettuano
acquisti online o la ricerca di
voli.
InvisibleHand mostra una
discreta notifica quando un
prezzo migliore è disponibile
su un prodotto o un volo che si
stà acquistando.
Copre oltre 580
rivenditori.

30. InvisibleHand: demo
In questa demo mostriamo anche come cercare ed installare un'estesione
per mozilla firefox.
http://www.youtube.com/watch?v=ThFZeRYf_J8 (1:26)

31. La gestione di Firefox
La gestione di plugin ed estensioni in Firefox è meno
raffinata rispetto a quella di Chrome. Il punto di accesso è
sempre il
Gestore Componenti aggiuntivi.
Il menù a sinistra si permette di scegliere su cosa
intervenire.
Ogni plugin o estensione è un elemento a se stante
Le estensioni solitamente possono essere disattivate, configurate o rimosse
I plugin solo disattivati ma gestibili con un apposita scheda
Non abbiamo una sezione che ci informa in tempo reale delle risorse utilizzate (il
Task Manager di Chrome)

32. Store: dove trovare tutto ciò che ti serve!

33. Store: dove trovare tutto ciò che ti serve!
Firefox ti fornisce
un'elenco delle estensioni
consigliate, di quelle più
popolari e di quelle
emergenti.
Al passaggio del mouse
verrà visualizzato un
menù a tendina che darà
la possibilità di aggiungere
l'estensione.

34. Differenze sincronizzazione
Sia Chrome che Firefox utilizzano servizi
cloud per memorizzare le preferenze
(preferiti, cronologia, estensioni installate...)
degli utenti.
Chrome utilizza un account gmail in cui salva
il nostro profilo completo, Firefox invece ci
chiede un account (user e password) solo per
le preferenze del nostro browser.

35. Dati utente e sync: Chrome
Chrome usa un account
gmail per sincronizzare i
nostri dati...
...affidiamo le nostre informazioni direttamente a Google
(una società con fini di lucro)
Google ci mette a
disposizione una
dashboard web e
il sito dataliberation
per garantire massima
trasparenza

36. Dati utente e sync: Firefox
Anche firefox opera il Nonostante questo
sync mediante la l'unico controllo che
creazione di un abbiamo è quello
account. offertoci dal browser
stesso...
Mozilla foundation non
ha scopo di lucro e l'encryption end-to-
end è realizzato
A differenza di Google, mediante un certificato
firefox prevede un univoco inviato
meccanismo end-to- all'utente...
end di encryption
...siamo esposti al
man-in-the-middle ?!?

37. Un'ultima nota sui dati
Eli Pariser analizza come
Google e Facebook
utilizzino i nostri profili
per creare esperienze di
utilizzo personalizzate.
Il rischio cui andiamo
incontro è l'oscurantismo
di qualunque "voce" non
rientri nelle nostre
Qui il video sottotitolato preferenze.
http://www.youtube.com/watch?
feature=player_embedded&v=B8ofWFx525s
Il rischio è una gabbia
invisibile.

38. Concludiamo dicendo che...
Chrome e firefox sono prodotti innovativi, che
mirano a costruire un web migliore
La loro grande forza non sta (solo) nell'utilizzare tecnologie
all'avanguardia, ma nel costruire il loro progetto intorno
all'user experience...
...plugins ed estensioni ne sono chiari esempi.
E ci ricordano che, almeno sul web, NOI
possiamo fare la differenza

39. Domande

40. Grazie

41. Si ringraziano in particolare: