html5 - un anno dopo
DESCRIPTION
Il racconto a posteriori (questa presentazione fa seguito a quella tenuta poco più di un anno fa, sempre in occasione della UGIALT.net Conference) di quello che è stato effettivamente lo sviluppo e l'adozione di questo linguaggio, che ormai molti indicano come la vera piattaforma di sviluppo del futuro, il rischio che si intravede di una nuova buzzword stile "web 2.0", alcune esperienze dirette e le lezioni che ne ho potuto trarre.TRANSCRIPT
![Page 1: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/1.jpg)
HTML5Un anno dopo...
![Page 2: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/2.jpg)
Cristiano Rastelli
➜ Freelance (“Area Web”)
➜ Developer & Designer(da oltre un decennio)
➜ Web + App UI + Mobile
➜ Passionate of UX, AI, Agile
![Page 3: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/3.jpg)
DEFINIZIONE
![Page 4: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/4.jpg)
HTML5
W3CWHATWGSTANDARD
Rif: [1] [2] [3]
![Page 5: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/5.jpg)
HTML5
![Page 6: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/6.jpg)
HTML5CSS3 GEO
Local-databaseWebworkers Websockets
Font-embeddingJavascript “magics”
![Page 7: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/7.jpg)
HTML5Open Web Stack
NEWTRif: [4]
![Page 8: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/8.jpg)
BREVEMENTE
![Page 9: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/9.jpg)
Novità nel linguaggio:
• introduzione di nuovi elementi semantici
• introduzione di nuovi attributi (anche “custom”)
• eliminazione elementi/attributi obsoleti
• definizione di un nuovo doctype
• definizione di nuove regole di sintassi
HTML5 in due minuti...
Rif: [5]
![Page 10: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/10.jpg)
Introduzione di nuove API per semplificare lo sviluppo di applicazioni web:
• disegno bidimensionale su canvas
• riproduzione audio/video integrata
• gestione di storage di dati locali
• geo-localizzazione dell’utente
• gestione dello stato offline delle pagine web
• utilizzo di processi paralleli e in background
HTML5 in due minuti...
Rif: [5]
![Page 11: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/11.jpg)
E molto altro ancora:
• drag&drop
• postMessage
• browser history
• editing nativo
• registerProtocolHandler
• querySelectorAll
HTML5 in due minuti...
Rif: [5]
![Page 12: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/12.jpg)
Canvas
Audio/Video
Storage
Offline
Workers/Sockets
Form 2.0
Geolocation
Supporto da parte dei browser
Rif: [6] [7] [8] [9] [10]
* * * *
![Page 13: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/13.jpg)
+1 ANNO
![Page 14: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/14.jpg)
5Come già previstoHTML5 è subitodiventata una buzzword…
![Page 15: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/15.jpg)
Ci permette di “parlarne”.
![Page 16: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/16.jpg)
Ci permette di “vendere”.
![Page 17: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/17.jpg)
Ci permette di “bullarci”
![Page 18: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/18.jpg)
Rif: [11] [12] [13]
![Page 19: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/19.jpg)
Contrordine, compagni!
HTML5
![Page 20: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/20.jpg)
Contrordine, compagni!
HTML
![Page 21: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/21.jpg)
HTML5 diventa HTML
“After that we realised that the demand for new features in HTML remained high […] we moved to a new development model, where the technology is not versioned and instead we just have a living document that defines the technology as it evolves.”
“The WHATWG HTML spec can now be considered a "living standard". […] it made no sense for us to keep referring to it as merely a draft. We will no longer be following the "snapshot" model of spec development […]”
WHATWG - "HTML is the new HTML5"
Rif: [14] [15] [16]
![Page 22: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/22.jpg)
Flash is (almost) dead
Rif: [17]
![Page 23: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/23.jpg)
HTML5 è ormai “mainstream”
http://www.google.com/trends?q=html5
Google Trends per “HTML5”
![Page 24: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/24.jpg)
Apple
Rif: [18]
![Page 25: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/25.jpg)
Rif: [19]
![Page 26: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/26.jpg)
Microsoft
Rif: [20]
![Page 27: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/27.jpg)
Microsoft
Rif: [20]
![Page 28: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/28.jpg)
World Wide Web Consortium
Rif: [11]
![Page 29: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/29.jpg)
Adobe
![Page 30: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/30.jpg)
Adobe
![Page 31: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/31.jpg)
HTML5 “toolboxes”
![Page 32: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/32.jpg)
FrameworksMulti-device & Multi-platform
![Page 33: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/33.jpg)
SproutCore
http://www.sproutcore.com/
![Page 34: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/34.jpg)
The-M-Project
http://www.the-m-project.org/
![Page 35: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/35.jpg)
Appcelerator (a.k.a. Titanium)
http://www.appcelerator.com
![Page 36: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/36.jpg)
PhoneGap
http://www.phonegap.com/
![Page 37: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/37.jpg)
Sencha Touch
http://www.sencha.com/products/touch/
![Page 38: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/38.jpg)
Jo
http://joapp.com/
![Page 39: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/39.jpg)
Jo
http://joapp.com/
![Page 40: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/40.jpg)
Polyfills
![Page 41: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/41.jpg)
No, non ho detto “polisucco”
![Page 42: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/42.jpg)
Modernizr
http://www.modernizr.com/
![Page 43: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/43.jpg)
HTML5 Shiv
http://code.google.com/p/html5shiv/
![Page 44: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/44.jpg)
Boilerplates
![Page 45: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/45.jpg)
HTML5 Boilerplate
http://html5boilerplate.com/
![Page 46: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/46.jpg)
Initializr
http://initializr.com/
![Page 47: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/47.jpg)
Baker
http://bakerframework.com/
![Page 48: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/48.jpg)
Font-services
![Page 49: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/49.jpg)
Typekit
http://typekit.com/
![Page 50: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/50.jpg)
Fontdeck
http://fontdeck.com/
![Page 51: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/51.jpg)
Fontspring
http://www.fontspring.com/fontface
![Page 52: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/52.jpg)
Kernest
http://kernest.com/
![Page 53: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/53.jpg)
Typotheque
http://www.typotheque.com/webfonts
![Page 54: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/54.jpg)
Fonts.com
http://webfonts.fonts.com/
![Page 55: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/55.jpg)
FontShop
http://www.fontshop.com
![Page 56: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/56.jpg)
The League of Moveable Type
http://www.theleagueofmoveabletype.com/
![Page 57: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/57.jpg)
ESPERIENZA
![Page 58: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/58.jpg)
L’effetto iPad
![Page 59: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/59.jpg)
L’effetto iPad (1)
Se non si vede oppure non funziona su iPad, non esiste.
![Page 60: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/60.jpg)
L’effetto iPad (2)
web-application<html5>
native-application (shell)
browser (player)
![Page 61: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/61.jpg)
iTunes Store è in HTML!
![Page 62: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/62.jpg)
Adozione nei progetti recenti
Chi Cosa Come
Quotidiano Web-App per iPad CSS3
Quotidiano Mobile Web Version CSS3
Finanziaria Gestionale Web CSS3 + Chrome-only
Evento Sito Web HTML5 + CSS3 avanzato
Scuola Sito Web HTML5 + CSS3
Banca Magazine Web HTML5 + CSS3 avanzato
![Page 63: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/63.jpg)
Adozione nei progetti recenti
Chi Cosa Come
Quotidiano Web-App per iPad CSS3
Quotidiano Mobile Web Version CSS3
Finanziaria Gestionale Web CSS3 + Chrome-only
Evento Sito Web HTML5 + CSS3 avanzato
Scuola Sito Web HTML5 + CSS3
Banca Magazine Web HTML5 + CSS3 avanzato
Prossimi progetti: 6 su 6 con HTML5+CSS3 avanzati
![Page 64: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/64.jpg)
Requisiti di progetto
![Page 65: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/65.jpg)
“Il sito andrà sviluppato per versioni di Internet Explorer 7 e superiori.
In una fase immediatamente successiva al lancio, verrà valutata l’opportunità di realizzare versioni ad-hoc per iPad, tablet e terminali mobili.
Si richiede infine che, in una fase successiva, il sito sia compatibile anche con Internet Explorer 6.”
Requisiti di progetto
![Page 66: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/66.jpg)
Confini ben delimitati
![Page 67: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/67.jpg)
Molteplicità + Compatibilità
Multi-Browser
Multi-Platform
Multi-Device
![Page 68: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/68.jpg)
“Hortus conclusus”
![Page 69: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/69.jpg)
CONCRETAMENTE
![Page 70: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/70.jpg)
Frameworks & co.
• HTML5 Shiv: it really rules!
• Domani: Modernizr (forse)
• Boilerplates: si può imparare molto studiando come sono realizzati, ma in un contesto di “hortus-conclusus” spesso sono troppo o generici o specifici per essere usati
• Molto “trial & error”!
![Page 71: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/71.jpg)
Svolta davvero “epocale”!
Progressive Enhancement
Graceful Degradation
Sviluppo per IE6, poi lo faccio andare bene anche su Firefox, Chrome e Safari
Sviluppo per browser di tipo evoluto (iPad compreso)facendo in modo che su browser più vecchi
si veda comunque in modo decente
![Page 72: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/72.jpg)
<HEAD/>
<!-- [META TAGS] --><meta name="viewport" content="width=device-width, maximum-scale=1.0, user-scalable=yes"><meta name="apple-mobile-web-app-capable" content="yes" /><meta name="apple-mobile-web-app-status-bar-style" content="black" />
<!-- [FILE CSS] --><link rel="stylesheet" href="style.css" media="screen" /><link rel="stylesheet" href="style_iphone.css" media="screen and (max-device-width: 480px)" /> <link rel="stylesheet" href="style_ipad.css" media="screen and (min-device-width: 768px) and (max-device-width: 1024px)" />
<!-- [ICONS] --><link rel="apple-touch-icon" href="/home_icon.png"/><link rel="apple-touch-startup-image" href="/splash_image.png" />
<!--[if lt IE 9]><script src="script/js/html5shim.js"></script><![endif]-->
![Page 73: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/73.jpg)
“Divitis”
Rif: [21] [22]
![Page 74: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/74.jpg)
“Divitis”
Rif: [21] [22]
<body> <div id=”boxWrapper”> <div id=”boxHeaderWrap”> <div id=”boxHeader”/> <div id=”boxMenu”/> </div> <div id=”boxRoot”> <div class=”heading”> <h1/> </div> <div id=”boxMain”> ……… </div> </div> </div> <div id=”boxFooter”>…</div></body>
PR
IMA
![Page 75: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/75.jpg)
“Divitis”
Rif: [21] [22]
<body> <div id=”boxWrapper”> <div id=”boxHeaderWrap”> <div id=”boxHeader”/> <div id=”boxMenu”/> </div> <div id=”boxRoot”> <div class=”heading”> <h1/> </div> <div id=”boxMain”> ……… </div> </div> </div> <div id=”boxFooter”>…</div></body>
PR
IMA
<body> <section> <aside> <header/> <nav/> </aside> <article> <hgroup> <h1/> </hgroup> <section> ……… </section> </article> </section> <footer>…</footer></body>
DO
PO
![Page 76: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/76.jpg)
CSS3
• @font-face (font-embedding)
• @media-orientation (iPad/iPhone)
• multiple backgrounds
• gradients
• rounded corners
• box & text shadows
• alpha colors (rgba)
• transitions & transformations
![Page 77: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/77.jpg)
@font-face
@font-face { font-family: 'MySuperWebFont'; src: url('superwebfont.eot'); src: local('☺'), url('superwebfont.woff') format('woff'), url('superwebfont.ttf') format ('truetype'), url('superwebfont.svg#webfontc2vQD8pF') format('svg'); font-weight: normal; font-style: normal;}
p { font-family: MySuperWebFont, Verdana, Arial, sans; }
![Page 78: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/78.jpg)
@font-face
@font-face { font-family: 'MySuperWebFont'; src: url('superwebfont.eot'); src: local('☺'), url('superwebfont.woff') format('woff'), url('superwebfont.ttf') format ('truetype'), url('superwebfont.svg#webfontc2vQD8pF') format('svg'); font-weight: normal; font-style: normal;}
p { font-family: MySuperWebFont, Verdana, Arial, sans; }
![Page 79: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/79.jpg)
@media-orientation
![Page 80: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/80.jpg)
Sfruttare il “cascade”/* ---- layout ---- */margin: 0px; padding: 0px;
/* ---- formatting ---- */font-family: Helvetica, Arial, sans-serif; font-size: 16px; color: #333333;background: #E4E4E4 url(xxx.png) repeat-x top left;border: 10px solid #FFFFFF;
/* ---- css3 ---- */background-image: -webkit-gradient(linear, 0 0, 0 100%, from(rgba), to(rgba));background-image: -moz-linear-gradient(rgba, rgba);-webkit-background-size: 1200px 375px;-moz-background-size: 1200px 375px;-webkit-border-radius: 10px;-moz-border-radius: 10px;border-radius: 10px;
![Page 81: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/81.jpg)
Sfruttare il “cascade”/* ---- layout ---- */margin: 0px; padding: 0px;
/* ---- formatting ---- */font-family: Helvetica, Arial, sans-serif; font-size: 16px; color: #333333;background: #E4E4E4 url(xxx.png) repeat-x top left;border: 10px solid #FFFFFF;
/* ---- css3 ---- */background-image: -webkit-gradient(linear, 0 0, 0 100%, from(rgba), to(rgba));background-image: -moz-linear-gradient(rgba, rgba);-webkit-background-size: 1200px 375px;-moz-background-size: 1200px 375px;-webkit-border-radius: 10px;-moz-border-radius: 10px;border-radius: 10px;
![Page 82: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/82.jpg)
NoSQL Day (Brescia - 25 marzo 2011)
Rif: [23]
![Page 83: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/83.jpg)
PREVISIONI
![Page 84: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/84.jpg)
“It's taken 20 years because the underlying standards had to evolve from the proprietary Mac and Windows platforms. But they have both adoptedHTML5 as a future direction.
So that means in future a lot of appswill be running in HTML5 in both mobile and non-mobile form”
Eric Schmidt - CEO Google Inc.
HTML5, la piattaforma
![Page 85: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/85.jpg)
www.didoo.net
Grazie per l’attenzione.
Cristiano Rastelli
![Page 86: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/86.jpg)
REFERENZE
![Page 87: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/87.jpg)
http://www.w3.org/TR/html5/[1]
Links[2]
[3]
[4]
http://dev.w3.org/html5/spec/
http://www.whatwg.org/html/
http://www.brucelawson.co.uk/2010/meet-newt-new-exciting-web-technologies/[5] http://robertnyman.com/2009/10/14/an-introduction-to-html5/[6] http://caniuse.com/ [7] http://www.html5test.com/ [8] http://www.findmebyip.com/[9] http://wiki.whatwg.org/wiki/Implementations_in_Web_browsers[10] http://en.wikipedia.org/wiki/Comparison_of_layout_engines_(HTML5)[11] http://www.w3.org/html/logo/[12] http://www.webstandards.org/2011/01/18/regarding-the-html5-logo/[13] http://adactio.com/journal/4289/[14] http://blog.whatwg.org/html-is-the-new-html5[15] http://www.zeldman.com/2011/01/27/html5-vs-html/[16] http://www.456bereastreet.com/archive/201101/html_beyond_html5/[17] http://www.apple.com/hotnews/thoughts-on-flash/[18] http://www.apple.com/html5/[19] http://www.html5rocks.com/
![Page 88: Html5 - Un anno dopo](https://reader038.vdocuments.mx/reader038/viewer/2022102700/54c763154a79598d1a8b4623/html5/thumbnails/88.jpg)
http://ie.microsoft.com/testdrive/[20]
Links[21]
[22]http://en.wiktionary.org/wiki/divitis
http://nate.koechley.com/blog/2006/12/15/divitis_and_correct_div_usage/
»
»»
http://diveintohtml5.org/
»
http://html5doctor.com/
»
http://html5demos.com/
»
http://html5gallery.com/
http://html5test.com/
http://www.html5rocks.com/
[23] http://nosqlday.it