เข้าใช้งานที่ URL = :// · browser ที่ใช้ในการเปิด เวบไซด์ หรือใช้งาน Internet ... - Internet
4. I browser
-
Upload
roberto-polillo -
Category
Education
-
view
1.100 -
download
4
description
Transcript of 4. I browser
Edizione 2012-13
Università degli Studi di Milano BicoccaDipartimento di Informatica, Sistemistica e Comunicazione
Corso di Strumenti e applicazioni del Web
4. Il browserRoberto Polillo
Il browser
E' lo strumento base per accedere al Web to browse: curiosare, sfogliare, dare una scorsa E' una macchina complessa, soggetta a continua evoluzione Il progenitore: World Wide Web (poi chiamato Nexus) di Tim
Berners-Lee ( 1991) Ne esistono diversi, in continua competizione per
incrementare le loro quote di mercato L'esito delle "guerre dei browser" è fondamentale per il
posizionamento sul mercato di Internet
R.Polillo - Marzo 2013
4
Architettura di un browser
R.Polillo - Marzo 2013
6
Da: Grosskurth, Godfrey, Architecture and evolution of the modern web browser (in rete)
Browser
Architettura di un browser
R.Polillo - Marzo 2013
7
Da: Grosskurth, Godfrey, Architecture and evolution of the modern web browser (in rete)
Store/retrievebookmarks, cookies, settings, …
Navigation support
HTTP handling
Visual representation of a given URI
Toolbars, menu, …
Mosaic
Sviluppato a partire dalla fine 1992 al NCSA (National Center for Supercomputing Applications) dell'Università dell'Illinois a Urbana-Champaign, influenzò profondamente i browser successivi
Marc Andreessen, il capo progetto, fondò poi Netscape
R.Polillo - Marzo 2013
8
Marc Andreesen
R.Polillo - Marzo 2013
9
Browser timeline
R.Polillo - Marzo 2013
10
20
08
Chrome
Da:
Gro
sskurt
h, G
odfr
ey, A
rchit
ect
ure
and e
volu
tion
of
the m
odern
web b
row
ser
(in
rete
)
I browser war
II broser war
III browser war
Browser user share (World)
R.Polillo - Marzo 2013
13
Fonte: StatCounter: http://bit.ly/113rJDe
Usage share, oggi
La % di utenti che usano un certo browser A gennaio 2013 (fonte StatCounter):
- Chrome: 36.5%- Explorer: 30.7%- Firefox: 21.4%- Safari: 8.3%- Altri: 3,1%
NB: Le varie metodiche di misura determinano risultati molto diversi: conviene utilizzare varie fonti e calcolarne la mediana
Fonte: http://en.wikipedia.org/wiki/Usage_share_of_web_browsers
R.Polillo - Marzo 2013
14
88.6%
Browser user share (Italia)
R.Polillo - Marzo 2013
15
Fonte: StatCounter http://bit.ly/113rJDe
Mobile browser (ultimi 4 anni)
R.Polillo - Marzo 2013
16
Fonte: StatCounter http://bit.ly/X7RGcv
Conformità agli standard
La rapida evoluzione delle tecnologie Web (es. HTML, XML, scripting languages), e la guerra dei browser hanno generato una notevole varietà di comportamenti nei browser
Il W3C (www.w3c.org : World Wide Web Consortium, fondato da Tim Berners Lee nel 1994) emette e aggiorna gli standard del Web ("Recommendations")
Questi dovrebbero essere seguiti dagli sviluppatori dei siti e dei browser, ma…
R.Polillo - Marzo 2013
17
HTML e CSS: evoluzione
R.Polillo - Marzo 2013
18
http://www.jasonspeaking.com/index.php/2010/04/the-evolution-of-html-css/
HTML5
CSS4 (?)
Standards: a moving target
R.Polillo - Marzo 2013
19
tDefinizionedella nuovatecnologia
Standard 0 Standard 1
draft
draft
deprecated
Standard 2
featu
res
stricttransitional
prodotti
Test di conformità / compatibilità
Test di conformità dei browser:Un servizio online gratuito per verificare la conformità dei browser con HTML5Provatelo sul vostro browser!http://html5test.com/index.html
Test di compatibilità di un sito:Un servizio online gratuito per vedere come una pagina Web viene visualizzata dai diversi browserhttp://browserlab.adobe.com
R.Polillo - Marzo 2013
20
Interfaccia utente: basics
R.Polillo - Marzo 2013
21
URL
Pagina web
Navigazione•Indietro•Avanti•Home•Refresh•History
Mosaic
R.Polillo - Marzo 2013
22
Interfaccia utente
Necessità di operare contemporaneamente su più pagine
R.Polillo - Marzo 2013
23
Modello desktop: più browser attivi in finestre differenti(ogni finestra ha una storia separata)
Nuovo modello:il browser gestisce piùfinestre(con una cronologia comune)
R.Polillo - Marzo 201324
Evoluzione del browser
R.Polillo - Marzo 2013
25
Mosaic
ExplorerFirefoxSafari
Tabbed browsing
Evoluzione del browser
R.Polillo - Marzo 2013
26
Mosaic
ExplorerFirefoxSafari
Tabbed browsing
Richiamo a motore di ricerca
Tabbed browsing: esempi
R.Polillo - Marzo 2013
27
Firefox 3.6
Explorer 8.0
Evoluzione del browser
R.Polillo - Marzo 2013
28
Mosaic
ExplorerFirefoxSafari
Tabbed browsing
Chrome
detach
Chrome
R.Polillo - Marzo 2013
29
http://www.youtube.com/watch?v=WoynSZNQxJs&feature=related (in italiano)
Multi-tasking
R.Polillo - Marzo 2013
30
Il browser diviente una sorta di sistema operativo (vedi Google Chrome OS – Chromium)
Processi separati, ma con cronologia comune
Google Chrome Omnibox31
Online browser support32
HTTPinternet
Browser
Web server
HTML
HTML
GOOGLEServizi online
al browser
Online browser support33
HTTPinternet
Browser
Web server
HTML
HTML
GOOGLEServizi online
al browser
Info inviate (se non disattivate): Info typed in omnibox → search engine Browser settings → google personal account
(preferences, bookmarks, stored passwords, …) Testi da tradurre → google translate Usage statistics → google databases
http://www.google.com/chrome/intl/en/privacy.html
Privacy?
Chrome: impostazioni di sincronizzazione
R.Polillo - Marzo 2013
34
Bookmarks
Bookmarks (preferiti, favorites, hot lists,…): URL memorizzati nel browser per rapido accessoVengono memorizzati localmente (se non sincronizzati), a meno che…
Social bookmarking: servizi online, mettono in comune bookmarks di più utenti
Es.: www.delicious.comFondato 2003, comprato da Yahoo! 2005, venduto ai fondatori di YouTube 2011 (Avos)
R.Polillo - Marzo 2013
35
Social bookmarking services36
HTTPinternet
Browser
Web server
HTML
HTML
GOOGLEServizi online
al browser
Browser
Boomarks db
www.delicious.com
www.delicious.com37
Inizialmente www.del.icio.us Il sito che ha inventato il social bookmarking, fondato nel
2003, acquisito da Yahoo! nel 2005, venduto ai fondatori di YouTube nel 2011 (Avos)
Permette di salvare, taggare e condividere bookmarks (che per default sono pubblici), gratuitamente
Bottoni per bookmarking installabili sul proprio browser Accesso rapido: www.delicious.com/tag/<tag> http://en.wikipedia.org/wiki/Del.icio.us
R.Polillo - Marzo 2013
Estensioni al browser
Componenti aggiuntivi che possono essere installati sul browser per fornire specifiche funzionalità (chiamati anche "add-on", "plugin",…)
Realizzati da terze parti, che utilizzano le interfacce programmative (API) del browser
Esempi: Chrome: https://chrome.google.com/webstore?hl=it Firefox: https://addons.mozilla.org/it/firefox/
R.Polillo - Marzo 2013
38
Estensioni: esempi
Yoono (Firefox)Interazione con Facebook, Twitter e Linkedin durante la navigazionehttp://www.youtube.com/watch?v=BLPTQULcC6o (1:34)
ImTranslator (Firefox)Traduzione in tempo reale nella lingua scelta (0:44)http://www.youtube.com/watch?v=O436cvXPnzU
InvisibleHand (Firefox)Propone il prezzo migliore di un prodotto/servizio selezionato (1:26)http://www.youtube.com/watch?v=ThFZeRYf_J8
GooEdit (Chrome)modifica un'immagine su una pagina Web, la salva e la twittahttp://www.youtube.com/watch?v=as1JdLpbBHc (1:06)
Thks A.Testa, V.Gennari, S.Antognazza per le demo video http://bit.ly/YEfY4L
R.Polillo - Marzo 2013
39
Esensioni: Hyperwords
http://www.hyperwords.net/index.html
http://www.youtube.com/watch?v=p6B9ZNI4vY0&feature=player_embedded
R.Polillo - Marzo 2013
40
Privacy ?
R.Polillo - Marzo 2013
41
Servizi attivati
dalle estensioni del browser
Sito visitato
Internet
Sintesi della lezione
I browser sono macchine complesse Avere il monopolio dei browser dà un forte
vantaggio competitivo sul mercato Internet Guerra dei browser vs evoluzione degli standard Convergenza dei browser e degli OS Le API pubbliche ne fanno macchine estensibili Supporto online delle funzioni del browser e delle
estensioni: il problema della privacy
R.Polillo - Marzo 2013
42
Lavoro individuale
È ora di scegliere consapevolmente il vostro browser. "Esplorate" con attenzione quello che usate, e confrontatelo con una alternativa possibile (attenzione: usate l'ultima versione!), sperimentando anche le funzioni nascoste e verificando la compatibilità HTML5 (es. con http://html5test.com/index.html
Quando lo avete scelto, cercate le estensioni per voi più interessanti, installatele e provatele
Verificate il livello di privacy che avete ottenuto Confrontate le funzionalità del browser scelto con la sua versione
mobile PS Questo lavoro è molto importante, dedicate il tempo necessario
R.Polillo - Marzo 2013
43