Download - HTML5 for PHP Developers - DPC11
![Page 1: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/1.jpg)
© 2011 Mayflower GmbH
Thorsten Rinne I 20th May 2011
HTML5 for PHP Developers
![Page 2: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/2.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
Team LeadScrum MasterHead of Open Source Labs
@ThorstenRinne2
![Page 3: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/3.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I 3
Who are you?
![Page 4: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/4.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
I won‘t talk about <video> and <audio>
4
![Page 5: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/5.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
And I don‘t speak about ...
5
![Page 6: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/6.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
Flash is dead.But don‘t tell Adobe.
6
![Page 7: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/7.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
Who‘s already using ...
7
... ?
![Page 8: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/8.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
HTML5 in one sentence?
8
![Page 9: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/9.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
„HTML5 is about moving from
documents to applications and from hacks to solutions.“
9
Chris Heilmann auf Twitter
![Page 10: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/10.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
HTML5 for Developers?
10
![Page 11: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/11.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
HTML5 ~= HTML + CSS + JS
11
![Page 12: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/12.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
1999:PHP 3.0 - MySQL 3.22
Apache 1.3
12
![Page 13: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/13.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I 13
![Page 14: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/14.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
1999:XMLHttpRequest Object
14
![Page 15: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/15.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
As time goes by ...
15
![Page 16: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/16.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I 16
since 5.0 (1999)
since 1.0 (2004)
since 1.2 (2004)
since 7.6 (2004)
![Page 17: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/17.jpg)
2005:Ajax: A New Approach to
Web ApplicationsHTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I 17
Blog entry by Jesse James Garret
![Page 18: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/18.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I 18
![Page 19: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/19.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
Google Suggest
Google Mail
Google Maps
19
![Page 20: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/20.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I 20
2006:Comet
![Page 21: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/21.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I 21
![Page 22: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/22.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I 22
Push Ajax
Push
Helgi‘sbirthday
![Page 23: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/23.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
Okay, what‘s happening?
23
![Page 24: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/24.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
Contentvs.
Context24
![Page 25: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/25.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
Facebook is an application!
25
![Page 26: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/26.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
Pagevs.
Stream26
![Page 27: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/27.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I 27
Twitter is an application!
![Page 28: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/28.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
Applications?
28
![Page 29: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/29.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
Apps!
29
![Page 30: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/30.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I 30
![Page 31: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/31.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I 31
![Page 32: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/32.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
online == offline32
![Page 33: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/33.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
Is this the new web?
33
![Page 34: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/34.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
The future is a web app!
34
![Page 35: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/35.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
The mobile browser is almost identical to the
desktop browser.
35
![Page 36: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/36.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
The mobile browser has short release cycles.
36
![Page 37: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/37.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
The mobile browser is a „cross platform
realtime runtime“.
37
![Page 38: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/38.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
But what about HTML5?And what about PHP?
38
![Page 39: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/39.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
Requests
Events39
![Page 40: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/40.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
2000: PHP chat style polling
40
Client Server
![Page 41: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/41.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
2000: PHP chat style polling
41
Client Server
Hey, wazzup?
![Page 42: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/42.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
2000: PHP chat style polling
42
Client Server
Um, nothing actually...Hey, wazzup?
![Page 43: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/43.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
2000: PHP chat style polling
43
Client Server
Hey, wazzup?
1 sec
Um, nothing actually...
![Page 44: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/44.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
2000: PHP chat style polling
44
Client Server
![Page 45: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/45.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
2000: PHP chat style polling
45
Client Server
Hey, wazzup?
![Page 46: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/46.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
2000: PHP chat style polling
46
Client Server
Hey, wazzup?Um, nothing actually...
![Page 47: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/47.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
2000: PHP chat style polling
47
Client Server
Hey, wazzup?
1 sec
Um, nothing actually...
![Page 48: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/48.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
2000: PHP chat style polling
48
Client Server
WTF???
![Page 49: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/49.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
1 user = 1 req / secCPU #FAIL
49
![Page 50: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/50.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
2006: Comet style long poll
50
Client Server
![Page 51: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/51.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
2006: Comet style long poll
51
Client Server
Hey, wazzup?
![Page 52: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/52.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
2006: Comet style long poll
52
Client Server
Um, nothing actually...
1 sec
![Page 53: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/53.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
2006: Comet style long poll
53
Client Server
Well ...
1 sec
![Page 54: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/54.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
2006: Comet style long poll
54
Client Server
Wait ...
1 sec
![Page 55: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/55.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
2006: Comet style long poll
55
Client Server
Uh, there is something!
1 sec
![Page 56: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/56.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
2006: Comet style long poll
56
Client Server
No, nothing!
1 sec
![Page 57: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/57.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
2006: Comet style long poll
57
Client Server
WTF???
![Page 58: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/58.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
1 user = 1 apache childMEMORY #FAIL
58
![Page 59: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/59.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
We have a problem.59
![Page 60: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/60.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I 60
![Page 61: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/61.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
We need help.
61
![Page 62: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/62.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I 62
MEMORY: WINCPU: 1/2 WIN
![Page 63: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/63.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I 63
Client
Client
Client
PHP Server
![Page 64: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/64.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I 64
Client
Client
Client
PHP Server
![Page 65: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/65.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
We know PHPWe know node.js
65
![Page 66: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/66.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
What about the client?
66
![Page 67: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/67.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
WebSockets
67
if ("WebSocket" in window) { var ws = new WebSocket("ws://example.com/service"); ws.onopen = function() { // WebSocket is connected. // You can send data by send() method. ws.send("message to send");
// .... }; ws.onmessage = function (evt) { var received_msg = evt.data; }; ws.onclose = function() { // WebSocket is closed }; } else { // the browser doesn't support WebSockets. }
![Page 68: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/68.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I 68
GET /demo HTTP/1.1Upgrade: WebSocketConnection: UpgradeHost: example.comOrigin: http://example.comSec-WebSocket-Key1: 4 @1 46546xW%0l 1 5Sec-WebSocket-Key2: 12998 5 Y3 1 .P00 ^n:ds[4U
HTTP/1.1 101 WebSocket Protocol HandshakeUpgrade: WebSocketConnection: UpgradeSec-WebSocket-Origin: http://example.comSec-WebSocket-Location: ws://example.com/demoSec-WebSocket-Protocol: sample 8jKS'y:G*Co,Wxa-
Client
Server
![Page 69: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/69.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
More logic will move to the client... the browser.
69
![Page 70: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/70.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
WebWorker
70
var myWorker = new Worker('backgroundtask.js');
myWorker.onmessage = function(event) { alert(event.data); };
self.onmessage = function(event) { // Do some heavy work self.postMessage('Hello, Amsterdam'); }
backgroundtask.js
main.js
![Page 71: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/71.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
WebMessaging
71
<form> <input type="text" name="msg" value="My message" id="msg"> <input type="submit"> <h2>Ziel iFrame:</h2> <iframe id="iframe" src="postmessage.html"></iframe> </form> <script> var win = document.getElementById("iframe").contentWindow; addEvent(
document.getElementsByTagName('form')[0], 'submit', function (e) {
if (e.preventDefault) e.preventDefault(); win.postMessage(document.getElementById("msg").value, "http://www.phpconference.nl"); e.returnValue = false; return false; }); </script>
![Page 72: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/72.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I 72
Offline application cache <html manifest="cache.manifest"> <script> window.applicationCache.addEventListener( 'checking', updateCacheStatus, false) </script>
index.html
CACHE MANIFEST
CACHE: /html5/demo/index.html /html5/demo/css/style.css /html5/demo/images/background.png /html5/demo/js/application.js
cache.manifest
![Page 73: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/73.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I 73
Web Storage‣„short living“ data‣sessionStorage object‣will be deleted by closing the browser‣„long living“ data‣localStorage object‣won‘t be deleted after closing the browser
Safari/Chrome Firefox IE Opera
2 MB 5 MB ~ 200MB 5 MB 4 MB
![Page 74: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/74.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I 74
Web Storage <p>This page was requested <b> <script> if (!sessionStorage.pageCounter) { sessionStorage.setItem('pageCounter',0); } sessionStorage.setItem('pageCounter', parseInt(sessionStorage.pageCounter)+1); document.write(sessionStorage.pageCounter); </script> </b> times.</p> <p> <input value="sessionStorage leeren" type="button" onClick="sessionStorage.clear();location.reload(true);"> <input value="Seite laden" type="button" onClick="location.reload(true);"> </p>
![Page 75: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/75.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I 75
2007: iPhone web apps should be only based on
HTML5,CSS3, JavaScript,
offline application cache and
web storage.
![Page 76: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/76.jpg)
Work on specs have stopped in late 2010. Don‘t use it.
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
Web SQL Database
76
var db = openDatabase('myDatabase', '1.0', 'My first Web SQL database', 2 * 1024 * 1024);
db.transaction(function (tx) { tx.executeSql('CREATE TABLE IF NOT EXISTS conferences (id unique, text)'); tx.executeSql('INSERT INTO conferences (id, text) VALUES (1, "Dutch PHP Conference")'); });
![Page 77: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/77.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
Geolocation
77
if (navigator.geolocation) { navigator.geolocation.getCurrentPosition( function(position) { var lat = position.coords.latitude; var lng = position.coords.longitude; var options = { position: new google.maps.LatLng(lat, lng) } var marker = new google.maps.Marker(options); marker.setMap(map); }); }
![Page 78: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/78.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
Drag and Drop API
78
<li draggable="true" id="pic" ondragstart="drag(this, event)"> <span>foobar.png</span></li>
<div id="trash" ondrop="drop(this, event)" ondropenter="return false" ondropover="return false"></div>
function drag(target, e) { e.dataTransfer.setData("Text", target.id); }
function drop(target, e) { var id = e.dataTransfer.getData("Text"); target.appendChild(document.getElementById(id); e.preventDefault(); }
![Page 79: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/79.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
FileReader API (I)
79
var reader = new FileReader();
reader.onload = function(e) { var bin = e.target.result; // bin is a binary string };
reader.readAsBinaryString(file);
![Page 80: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/80.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
FileReader API (II)
80
var xhr = new XMLHttpRequest();
xhr.open("POST", "upload.php"); xhr.overrideMimeType("text/plain; charset=x-user-defined-binary"); xhr.sendAsBinary();
xhr.upload.addEventListener("progress", function(e) { if (e.lengthComputable) { var percentage = Math.round((e.loaded * 100) / e.total); // do something } }, false);
![Page 81: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/81.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
This was just the JavaScript part of HTML5.
81
![Page 82: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/82.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
What‘s left for us PHP Developers?
82
![Page 83: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/83.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
HTML5 is part of an application framework.
83
![Page 84: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/84.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
The LAMP stack gets a bust of Janus.
84
![Page 85: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/85.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I 85
Realtimecomponent
Webcomponent
HTML5 / JS PHP / MySQL
![Page 86: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/86.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
PHP Developer have to learn JavaScript as well!
86
![Page 87: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/87.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
Modern PHP applications use both techniques:
87
JavaScript50%
PHP50%
![Page 88: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/88.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I 88
![Page 89: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/89.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
<!DOCTYPE html>
89
![Page 90: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/90.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
Page structure tags
90
<header><hgroup><nav>
<article><footer>
![Page 91: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/91.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
Article structure tags
91
<section><aside>
![Page 92: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/92.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
New semantic tags
92
<time><details><figure>
<figcaption><mark>
![Page 93: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/93.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
New <link> relations
93
<link rel="alternate" type="application/atom+xml" title="My Weblog feed" href="http://www.phpconference.nl/feed/"> <link rel="search" type="application/opensearchdescription+xml" title="My Weblog search" href="http://www.phpconference.nl/opensearch.xml"> <link rel="icon" href="/favicon.ico">
<link rel="pingback" href="http://www.phpconference.nl/xmlrpc.php"> <link rel="prefetch" href="http://www.phpconference.nl/main.php"> <link rel="archives" href="http://www.phpconference.nl/archive/"> <link rel="external" href="http://www.php.net"> <link rel="license" href="http://www.gnu.org/licenses/gpl.html"> <link rel="nofollow" href="http://www.ruby-lang.org">
![Page 94: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/94.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
WebForms
94
![Page 95: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/95.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
WebForms attributes (I)
95
<input type="text" placeholder="Mayflower GmbH">
![Page 96: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/96.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
WebForms attributes (II)
96
<input type="text" maxlength="256" name="q" autofocus>
<input type="text" maxlength="256" name="q" required="true">
![Page 97: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/97.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
WebForms attributes (III)
97
<input type="tel" name="phonenumber">
<input type="url" name="url">
<input type="email" name="emailaddress">
![Page 98: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/98.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
WebForms attributes (IV)
98
<input type="number" min="0" max="10" step="2" value="6">
![Page 99: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/99.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
WebForms attributes (V)
99
<input type="range" min="0" max="10" step="2" value="6">
![Page 100: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/100.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
HTML5 Speech Input
100
<input type="text" x-webit-speech>
![Page 101: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/101.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
Date Picker
101
<input type="date"> <input type="month"> <input type="week"> <input type="time"> <input type="datetime">
![Page 102: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/102.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
Color Picker
102
<input type="color">
![Page 103: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/103.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
contenteditable
103
<p contenteditable="true">Hello, Amsterdam!</p>
You can save the content to‣ sessionStorage‣ localStorage ‣ or with PHP using XMLHttpRequest
![Page 104: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/104.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
Canvas
104
![Page 105: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/105.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
Canvas
105
<canvas id="rss" width="24" height="24"></canvas>
<script type="text/javascript"> function draw() { var canvas = document.getElementById('rss'); if (canvas.getContext){ var ctx = canvas.getContext('2d'); } } </script>
![Page 106: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/106.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
Canvas
106
// The triangle ctx.fillStyle = 'rgb(236,138,68)'; ctx.fillRect(0,0,24,24);
// The lines and the dot ctx.strokeStyle = "#ffffff"; ctx.lineWidth = 3; ctx.beginPath(); ctx.arc(4,21,15,Math.PI*3/2,0,false); ctx.moveTo(4,11); ctx.arc(4,21,10,Math.PI*3/2,0,false); ctx.moveTo(8,18); ctx.arc(7,18,1,Math.PI*2,0,false); ctx.stroke();
![Page 107: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/107.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
Canvas
107
// The gradient var gradient = ctx.createLinearGradient(0,0,24,24); gradient.addColorStop(0, 'rgb(236,138,68)'); gradient.addColorStop(0.5, 'rgb(252,158,60)'); gradient.addColorStop(1, 'rgb(220,98,44)'); ctx.fillStyle = gradient;
ctx.beginPath(); ctx.moveTo(0,5); ctx.quadraticCurveTo(0,0,5,0); ctx.lineTo(19,0); ctx.quadraticCurveTo(24,0,24,5); ctx.lineTo(24,19); ctx.quadraticCurveTo(24,24,19,24); ctx.lineTo(5,24); ctx.quadraticCurveTo(0,24,0,19); ctx.fill();
![Page 108: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/108.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
Canvas
108
![Page 109: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/109.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
And what about CSS3?
109
![Page 110: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/110.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
New selectors
110
.row:nth-child(even) { background: #cccccc; } .row:nth-child(odd) { background: #ffffff; }
row 1
row 2
row 3
row 4
![Page 111: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/111.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
Web Fonts
111
@font-face { font-family: 'Papyrus'; src: url(Papyrus.otf); } header { font-family: 'Papyrus'; }
Ik zal handhaven
![Page 112: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/112.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
More new CSS3 features...
112
![Page 113: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/113.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I 113
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Multi-column layouts
![Page 114: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/114.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
Opacity
114
OpacityOpacityOpacityOpacity
![Page 115: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/115.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I 115
HSL / HSLA colours
![Page 116: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/116.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I 116
Finally rounded corners! :-)
![Page 117: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/117.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
Gradients
117
![Page 118: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/118.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
Shadows118
![Page 119: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/119.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
Shadows119
![Page 120: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/120.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
Transitions and animations
120
![Page 121: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/121.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
Great.But can I use HTML5 today?
121
![Page 122: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/122.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
HTML5 in Browsern
122
33 %
52 %57 %
64 % 65 %
73 %
IE9 Mobile Safari Safari 5 Firefox 4 Opera 11.1 Chrome 11
![Page 123: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/123.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
HTML5 support in the year 2011
123
![Page 124: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/124.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I 124
Cross
Document
Messaging
content
editableNew tags <audio> <video>
IE 9 yes yes yes yes yes
FF 4 yes yes yes yes yes
Chrome 11 yes yes yes yes yes
Safari 5 yes yes yes yes yes
Opera 11.10 yes yes yes yes yes
![Page 125: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/125.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I 125
Simple
<canvas>
support
Texts in
<canvas>Drag and Drop
Offline Application
Cache
HTML5
WebForms
IE 9 yes no yes no no
FF 4 yes yes yes yes yes
Chrome 11 yes yes yes yes yes
Safari 5 yes yes yes yes yes
Opera 11.10 yes yes no yes yes
![Page 126: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/126.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
But...
126
![Page 127: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/127.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
Browser statistics 2011
127
![Page 128: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/128.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
What‘s safe to use today?
128
![Page 129: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/129.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
contenteditablepostMessage
Web Storage (IE 8+)New semantic tags
129
![Page 130: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/130.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
Any HTML5 helpers?
130
![Page 131: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/131.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I 131
![Page 132: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/132.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I 132
![Page 133: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/133.jpg)
HTML5 for PHP Developer I Mayflower GmbH I 20th May 2011 I
Questions?
133
![Page 134: HTML5 for PHP Developers - DPC11](https://reader033.vdocuments.mx/reader033/viewer/2022052505/55512af2b4c905f1528b4c1b/html5/thumbnails/134.jpg)
Thank you very much!
© 2011 Mayflower GmbH
Contact Thorsten [email protected]+49 89 242054-31@ThorstenRinne
Mayflower GmbHMannhardtstr. 680538 MünchenGermany
Please rate me at http://joind.in/3239