Downloaded 66 times
![(segue)
10
<a class="twitter-timeline" href="https://twitter.com/VizzariG"
data-widget-id="657943005760987136">Tweets by
@VizzariG</a> <script>!function(d,s,id){var
js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)
?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.i
d=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode
.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
Il codice generato, da
copiare nella propria
pagina Web](https://image.slidesharecdn.com/20181023-ilbrowser-181018144421/85/Il-browser-10-320.jpg)
Uploaded byGiuseppe Vizzari
Il browser
Il documento presenta un corso relativo agli strumenti e alle applicazioni del web, focalizzandosi sul funzionamento e sull'evoluzione dei browser. Analizza le 'guerre dei browser' e l'impatto che hanno avuto sul mercato di internet, oltre a discutere l'importanza della conformità agli standard web. Viene enfatizzato il ruolo dei browser come strumenti fondamentali per l'accesso alla rete, la loro evoluzione e l'integrazione di funzionalità avanzate.
Il browser
- 1. Università degli Studidi Milano Bicocca Dipartimento di Informatica, Sistemistica e Comunicazione Corso di Strumenti e applicazioni del Web 8. Il browser Giuseppe Vizzari Edizione 2018-19
- 2. Queste slides Queste slidesfanno parte del corso “Strumenti e applicazioni del Web”. Il sito del corso, con il materiale completo, si trova in https://gvizzari.hopto.org/wp/. Data la rapida evoluzione della rete, il corso viene aggiornato ogni anno. Il presente materiale è pubblicato con licenza Creative Commons “Attribuzione - Non commerciale - Condividi allo stesso modo – 3.0” (http://creativecommons.org/licenses/by-nc-sa/3.0/it/deed.it ): La licenza non si estende alle immagini provenienti da altre fonti e alle screen shot, i cui diritti restano in capo ai rispettivi proprietari, che, ove possibile, sono stati indicati. L'autore si scusa per eventuali omissioni, e resta a disposizione per correggerle.
- 3. Riassunto della puntata precedente •Web = • Internet + Ipertesti (concettualmente) • HTTP + HTML + URI + Browser + Web server + protocolli pre-esistenti (tecnicamente) • Quali informazioni su di noi il browser invia al web server • Una pagina web aggrega oggetti provenienti da fonti anche molto diverse • Scripting (client side e server side) • CMS lato server • … e il lato client? 3
- 4. Il browser • Èlo strumento base per accedere al Web • “to browse”: curiosare, sfogliare, dare una scorsa • È 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" è (stato?) fondamentale per il posizionamento sul mercato di Internet
- 5. Il protocollo HTTP 5 HOSTHOSTROUTER ROUTER Web server Trasporto Internet Network Internet Network Internet Network Browser Trasporto Internet Network Protocollo HTTP TCP: Transmission Control Protocol IP: Internet Protocol
- 6.
- 7.
- 8.
- 9. Creazione di unwidget: esempio 9 Twitter:
- 10. (segue) 10 <a class="twitter-timeline" href="https://twitter.com/VizzariG" data-widget-id="657943005760987136">Tweetsby @VizzariG</a> <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location) ?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.i d=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode .insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script> Il codice generato, da copiare nella propria pagina Web
- 11.
- 12. Virtualizzazone / globalizzazionedella rete 12 Da dove provengono i servizi?
- 13. Architettura di unbrowser 13 Da: Grosskurth, Godfrey, Architecture and evolution of the modern web browser (in rete) Browser
- 14. Architettura di unbrowser 14 Da: Grosskurth, Godfrey, Architecture and evolution of the modern web browser (https://plg.uwaterloo.ca/~migod/papers/2006/jss-browserRefArch.pdf) Store/retrieve bookmarks, cookies, settings, … Navigation support HTTP handling Visual representation of a given URI Toolbars, menu, …
- 15.
- 16. Mosaic • Sviluppato apartire 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 16
- 17. Marc Andreesen (1971-…) 17 Andreesen – Horowitz: venture capital con partecipazioni in Ning, Facebook, Foursquare, Twitter, Skype, Pinterest, Groupon, Zynga, ….
- 18. Browser timeline (earlydays…) 18 2008 Chrome Da:Grosskurth,Godfrey,Architectureandevolution ofthemodernwebbrowser(https://plg.uwaterloo.ca/~migod/papers/2006/jss-browserRefArch.pdf) I browser war II broser war III browser war
- 19. W3C: World WideWeb Consortium • Fondato nel 1994 da Tim Berners-Lee • "The W3C mission is to lead the World Wide Web to its full potential by developing protocols and guidelines that ensure the long-term growth of the Web" • Emette delle Recommendation, che sono considerate gli standard del Web • Vita abbastanza difficile, almeno inizialmente, dato l’evidente interesse e rilevanza commerciale comparata alla iniziale immaturità delle tecnologie… • Guardate http://www.w3.org 19
- 20. Le "browser wars" •Il controllo del browser leader di mercato fornisce un vantaggio competitivo molto forte • Per vincere: • Gratuità • Funzionalità avanzate e qualità del software • Perché cercare di vincere “regalando” software? • Funzionalità proprietarie → indebolimento degli standard oppure: controllo degli standard (prime fasi) • Possibilità di acquisire dati sull’utilizzo del browser e della rete da parte degli utenti (attualmente) • Le guerre dei browser: 1) (1995-1998) Explorer vs Netscape 2) (2004- 2015) Firefox vs Explorer 3) (2008 - …) Chrome vs Firefox/Edge/Safari 4) (2007 - …) Mobile browsers 5) (2016 - …) “Ad-free” browsers? (Safari 11, Brave, … ?) http://en.wikipedia.org/wiki/Browser_wars 20
- 21. Mozilla Foundation • ”Anon-profit organization that promotes openness, innovation and participation on the Internet.” • Gestisce Firefox, open-source, dal 2003 • Mozilla Manifesto: https://www.mozilla.org/about/manifesto.it.html • L'85% (=300 ml $ annui) dei finanziamenti del 2014 proviene da Google, in cambio Firefox usa Google come motore di ricerca di default (il contratto è stato rinnovato fino a novembre 2014)… • … nel 2014 Mozilla ha firmato un contratto quinquennale con Yahoo, per averlo come motore di ricerca predefinito nel Nord America (ma Yahoo Search è sostanzialmente un front-end per Bing…) 21
- 22. Firefox • Browser gratuitoe open-source • Sviluppato dalla Mozilla Foundation, dal 2004 • Versioni mobili da 2010-2011 • Ciclo di rilascio molto accelerato (dopo l’arrivo di Chrome): Nightly → Aurora → Beta • Oggi: release ~62 22
- 23. Usage share, oggi •La % di utenti che usano un certo browser • A febbraio 2015 (fonte StatCounter): - Chrome: 61% - Safari: 15% - UC*: 5% - Firefox: 5% - Altri: 14% (IE ed Edge stanno qui!) • 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 * UC Browser is a web browser developed by the Chinese mobile Internet company UCWeb, which is in turn owned by the Alibaba Group. 23 86%
- 24. Browser market share (2008– 2018) 24
- 25. Mobile browser marketshare (2008 – 2018) 25
- 26. 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 emette e aggiorna gli standard del Web ("Recommendations") • Questi dovrebbero essere seguiti dagli sviluppatori dei siti e dei browser, ma… 26
- 27. HTML e CSS:evoluzione 27 http://www.jasonspeaking.com/index.php/2010/04/the-evolution-of-html-css/ HTML5 CSS4 (?) Recommendation W3C Ott 2014
- 28. Standard: a movingtarget 28 t Definizione della nuova tecnologia Standard 0 Standard 1 draft draft deprecated Standard 2 features strict transitional prodotti
- 29. Test di conformità/ compatibilità Test di conformità dei browser: Un servizio online gratuito per verificare la conformità dei browser con HTML5: Provatelo sul vostro browser! http://html5test.com/index.html Test di compatibilità di un sito: Vari servizi per vedere come una pagina Web viene visualizzata dai diversi browser (in simulazione) 29
- 30. Interfaccia utente: basics 30 URL Pagina web Navigazione •Indietro • Avanti • Refresh • History
- 31.
- 32. Interfaccia utente Necessità dioperare contemporaneamente su più pagine 32 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)
- 33.
- 34.
- 35. Tabbed browsing: esempi 35 Firefox3.6 Explorer 8.0
- 36.
- 37.
- 38. Multi-tasking 38 Il browser divienteuna sorta di sistema operativo (vedi Google Chrome OS – Chromium) Processi separati, ma con cronologia comune
- 39.
- 40.
- 41. Online browser support 41 HTTP internet Browser Web server HTML HTML GOOGLE Servizi onlineal 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?
- 42.
- 43. Bookmarks • Bookmarks (preferiti,favorites, hot lists,…): URL memorizzati nel browser per rapido accesso Vengono memorizzati localmente (se non sincronizzati) • Social bookmarking: servizi online, mettono in comune bookmarks di più utenti, a volte categorizzati in modi differenti… • Es.: www.delicious.com Fondato 2003, comprato da Yahoo! 2005 (costo tra i 15 e i 30 milioni di dollari), poi altri passaggi societari fino al recente acquisto da parte di Pinboard per 35 mila dollari... • Esempio più recente, vivo e apparentemente economicamente sostenibile: Pinterest (https://www.pinterest.com/) Fondato a fine 2009, oggi valutata intorno ai 12 miliardi di dollari, ma ancora non si parla di una collocazione in borsa… 43
- 44. 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/ 44
- 45. Estensioni: esempi • Yoono(Firefox) Interazione con Facebook, Twitter e Linkedin durante la navigazione http://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 twitta http://www.youtube.com/watch?v=as1JdLpbBHc (1:06) Thks A.Testa, V.Gennari, S.Antognazza per le demo video http://bit.ly/YEfY4L 45
- 46. Privacy ? 46 Servizi attivati dalleestensioni del browser Sito visitato Internet
- 47. Sintesi della lezione •I browser sono macchine complesse • Avere il monopolio dei browser dà un forte vantaggio competitivo sul mercato Internet • I browser inglobano funzioni degli OS • Le API pubbliche ne fanno macchine estensibili • Supporto online delle funzioni del browser e delle estensioni: il problema della privacy 47