• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
HTML5 for PHP Developers - DPC11
 

HTML5 for PHP Developers - DPC11

on

  • 4,262 views

 

Statistics

Views

Total Views
4,262
Views on SlideShare
4,262
Embed Views
0

Actions

Likes
9
Downloads
253
Comments
0

0 Embeds 0

No embeds

Accessibility

Categories

Upload Details

Uploaded via SlideShare as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    HTML5 for PHP Developers - DPC11 HTML5 for PHP Developers - DPC11 Presentation Transcript

    • HTML5 for PHP DevelopersThorsten Rinne I 20th May 2011 © 201 Mayflower GmbH 1
    • Team LeadScrum MasterHead of Open Source Labs@ThorstenRinne HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 2 1
    • Who are you? HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 3 1
    • I won‘t talk about<video> and <audio> HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 4 1
    • And I don‘t speak about ... HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 5 1
    • Flash is dead.But don‘t tell Adobe. HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 6 1
    • Who‘s already using ... ... ? HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 7 1
    • HTML5 in one sentence? HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 8 1
    • „HTML5 is about moving from documents toapplications and fromhacks to solutions.“ Chris Heilmann auf Twitter HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 9 1
    • HTML5 for Developers? HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 10 1
    • HTML5 ~= HTML + CSS + JS HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 1 1 1
    • 1999:PHP 3.0 - MySQL 3.22 Apache 1.3 HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 12 1
    • HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 13 1
    • 1999:XMLHttpRequest Object HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 14 1
    • As time goes by ... HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 15 1
    • since 5.0 (1999) since 1.0 (2004) since 1.2 (2004) since 7.6 (2004) HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 16 1
    • 2005:Ajax: A New Approach to Web Applications Blog entry by Jesse James Garret HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 17 1
    • HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 18 1
    • Google Suggest Google MailGoogle Maps HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 19 1
    • 2006: Comet HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 20 1
    • HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 21 1
    • Push Ajax Push Helgi‘s birthday HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 22 1
    • Okay, what‘s happening? HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 23 1
    • Content vs.Context HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 24 1
    • Facebook is an application! HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 25 1
    • Page vs.Stream HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 26 1
    • Twitter is anapplication! HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 27 1
    • Applications? HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 28 1
    • Apps! HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 29 1
    • HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 30 1
    • HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 31 1
    • online == offline HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 32 1
    • Is this the new web? HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 33 1
    • The future is a web app! HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 34 1
    • The mobile browser isalmost identical to the desktop browser. HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 35 1
    • The mobile browser has short release cycles. HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 36 1
    • The mobile browser is a „cross platform realtime runtime“. HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 37 1
    • But what about HTML5? And what about PHP? HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 38 1
    • Requests Events HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 39 1
    • 2000: PHP chat style polling Client Server HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 40 1
    • 2000: PHP chat style polling Hey, wazzup? Client Server HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 41 1
    • 2000: PHP chat style polling Um, nothing Hey, wazzup? actually... Client Server HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 42 1
    • 2000: PHP chat style polling Um, nothing Hey, wazzup? actually... Client 1 sec Server HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 43 1
    • 2000: PHP chat style polling Client Server HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 44 1
    • 2000: PHP chat style polling Hey, wazzup? Client Server HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 45 1
    • 2000: PHP chat style polling Um, nothing Hey, wazzup? actually... Client Server HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 46 1
    • 2000: PHP chat style polling Um, nothing Hey, wazzup? actually... Client 1 sec Server HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 47 1
    • 2000: PHP chat style polling WTF??? Client Server HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 48 1
    • 1 user = 1 req / sec CPU #FAIL HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 49 1
    • 2006: Comet style long poll Client Server HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 50 1
    • 2006: Comet style long poll Hey, wazzup? Client Server HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 51 1
    • 2006: Comet style long poll Um, nothing actually... Client 1 sec Server HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 52 1
    • 2006: Comet style long poll Well ... Client 1 sec Server HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 53 1
    • 2006: Comet style long poll Wait ... Client 1 sec Server HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 54 1
    • 2006: Comet style long poll Uh, there is something! Client 1 sec Server HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 55 1
    • 2006: Comet style long poll No, nothing! Client 1 sec Server HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 56 1
    • 2006: Comet style long poll WTF??? Client Server HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 57 1
    • 1 user = 1 apache child MEMORY #FAIL HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 58 1
    • We have a problem. HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 59 1
    • HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 60 1
    • We need help. HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 61 1
    • MEMORY: WINCPU: 1/2 WIN HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 62 1
    • PHP ServerClient Client Client HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 63 1
    • PHP ServerClient Client Client HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 64 1
    • We know PHPWe know node.js HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 65 1
    • What about the client? HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 66 1
    • WebSocketsif ("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 doesnt support WebSockets.} HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 67 1
    • ClientGET /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 Server HTTP/1.1 101 WebSocket Protocol Handshake Upgrade: WebSocket Connection: Upgrade Sec-WebSocket-Origin: http://example.com Sec-WebSocket-Location: ws://example.com/demo Sec-WebSocket-Protocol: sample 8jKSy:G*Co,Wxa- HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 68 1
    • More logic will move to the client... the browser. HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 69 1
    • WebWorker main.jsvar myWorker = new Worker(backgroundtask.js);myWorker.onmessage = function(event) { alert(event.data);}; backgroundtask.jsself.onmessage = function(event) { // Do some heavy work self.postMessage(Hello, Amsterdam);} HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 70 1
    • WebMessaging<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> HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 71 1
    • Offline application cache index.html<html manifest="cache.manifest"><script>window.applicationCache.addEventListener( checking, updateCacheStatus, false)</script> cache.manifestCACHE MANIFESTCACHE:/html5/demo/index.html/html5/demo/css/style.css/html5/demo/images/background.png/html5/demo/js/application.js HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 72 1
    • 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 browserSafari/Chrome Firefox IE Opera 2 MB 5 MB ~ 200MB 5 MB 4 MB HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 73 1
    • 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> HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 74 1
    • 2007: iPhoneweb apps shouldbe only based on HTML5,CSS3, JavaScript, offline application cache and web storage. HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 75 1
    • Web SQL Databasevar 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 Work on specs have stopped in (id unique, text)); tx.executeSql(INSERT INTO conferences (id, text) VALUES (1, "Dutch PHP Conference")); late 2010. Don‘t use it.}); HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 76 1
    • Geolocationif (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); });} HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 77 1
    • Drag and Drop API <li draggable="true" id="pic" ondragstart="drag(this, event)"> <span>foobar.png</span></li> <div id="trash" ondrop="drop(this, event)" ondropenter="returnfalse" 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(); } HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 78 1
    • FileReader API (I)var reader = new FileReader();reader.onload = function(e) { var bin = e.target.result; // bin is a binary string};reader.readAsBinaryString(file); HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 79 1
    • FileReader API (II)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); HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 80 1
    • This was just the JavaScript part of HTML5. HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 81 1
    • What‘s left for usPHP Developers? HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 82 1
    • HTML5 is part of anapplication framework. HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 83 1
    • The LAMP stack gets a bust of Janus. HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 84 1
    • Realtime Webcomponent component HTML5 / JS PHP / MySQL HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 85 1
    • PHP Developer have to learn JavaScript as well! HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 86 1
    • Modern PHP applications use both techniques: JavaScript PHP 50% 50% HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 87 1
    • HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 88 1
    • <!DOCTYPE html> HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 89 1
    • Page structure tags <header> <hgroup> <nav> <article> <footer> HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 90 1
    • Article structure tags <section> <aside> HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 91 1
    • New semantic tags <time> <details> <figure> <figcaption> <mark> HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 92 1
    • New <link> relations<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"> HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 93 1
    • WebForms HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 94 1
    • WebForms attributes (I)<input type="text" placeholder="Mayflower GmbH"> HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 95 1
    • WebForms attributes (II)<input type="text" maxlength="256" name="q" autofocus><input type="text" maxlength="256" name="q" required="true"> HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 96 1
    • WebForms attributes (III)<input type="tel" name="phonenumber"><input type="url" name="url"><input type="email" name="emailaddress"> HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 97 1
    • WebForms attributes (IV)<input type="number" min="0" max="10" step="2" value="6"> HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 98 1
    • WebForms attributes (V)<input type="range" min="0" max="10" step="2" value="6"> HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 99 1
    • HTML5 Speech Input<input type="text" x-webit-speech> HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 100 1
    • Date Picker<input type="date"><input type="month"><input type="week"><input type="time"><input type="datetime"> HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 101 1
    • Color Picker<input type="color"> HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 102 1
    • contenteditable<p contenteditable="true">Hello, Amsterdam!</p>You can save the content to‣ sessionStorage‣ localStorage‣ or with PHP using XMLHttpRequest HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 103 1
    • Canvas HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 104 1
    • Canvas<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> HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 105 1
    • Canvas// The trianglectx.fillStyle = rgb(236,138,68);ctx.fillRect(0,0,24,24);// The lines and the dotctx.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(); HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 106 1
    • Canvas// The gradientvar 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(); HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 107 1
    • Canvas HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 108 1
    • And what about CSS3? HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 109 1
    • New selectors.row:nth-child(even) { background: #cccccc; }.row:nth-child(odd) { background: #ffffff; } row 1 row 2 row 3 row 4 HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 1 1 10
    • Web Fonts@font-face { font-family: Papyrus; src: url(Papyrus.otf);}header { font-family: Papyrus;} Ik zal handhaven HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 1 1 1 1
    • More new CSS3 features... HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 1 1 12
    • Lorem ipsum dolor sit Lorem ipsum dolor sit Lorem ipsum dolor sit Lorem ipsum dolor sitamet, consectetur amet, consectetur amet, consectetur amet, consecteturadipisicing elit, sed adipisicing elit, sed adipisicing elit, sed adipisicing elit, seddo eiusmod tempor do eiusmod tempor do eiusmod tempor do eiusmod temporincididunt ut labore et incididunt ut labore et incididunt ut labore et incididunt ut labore etdolore magna aliqua. dolore magna aliqua. dolore magna aliqua. dolore magna aliqua.Ut enim ad minim Ut enim ad minim Ut enim ad minim Ut enim ad minimveniam, quis nostrud veniam, quis nostrud veniam, quis nostrud veniam, quis nostrud Multi-column layoutsexercitation ullamco exercitation ullamco exercitation ullamco exercitation ullamcolaboris nisi ut aliquip laboris nisi ut aliquip laboris nisi ut aliquip laboris nisi ut aliquipex ea commodo ex ea commodo ex ea commodo ex ea commodoconsequat. Duis aute consequat. Duis aute consequat. Duis aute consequat. Duis auteirure dolor in irure dolor in irure dolor in irure dolor inreprehenderit in reprehenderit in reprehenderit in reprehenderit involuptate velit esse voluptate velit esse voluptate velit esse voluptate velit essecillum dolore eu cillum dolore eu cillum dolore eu cillum dolore eufugiat nulla pariatur. fugiat nulla pariatur. fugiat nulla pariatur. fugiat nulla pariatur.Excepteur sint Excepteur sint Excepteur sint Excepteur sintoccaecat cupidatat occaecat cupidatat occaecat cupidatat occaecat cupidatatnon proident, sunt in non proident, sunt in non proident, sunt in non proident, sunt inculpa qui officia culpa qui officia culpa qui officia culpa qui officiadeserunt mollit anim deserunt mollit anim deserunt mollit anim deserunt mollit animid est laborum. id est laborum. id est laborum. id est laborum. HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 1 1 13
    • OpacityOpacityOpacityOpacityOpacity HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 1 1 14
    • HSL / HSLA colours HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 1 1 15
    • Finally rounded corners! :-) HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 1 1 16
    • Gradients HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 1 1 17
    • Shadows HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 1 1 18
    • Shadows HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 1 1 19
    • Transitions and animations HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 120 1
    • Great.But can I use HTML5 today? HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 121 1
    • HTML5 in Browsern 73 % 65 % 64 % 57 % 52 %33 %IE9 Mobile Safari Safari 5 Firefox 4 Opera 11.1 Chrome 11 HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 122 1
    • HTML5 supportin the year 2011 HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 123 1
    • Cross content Document New tags <audio> <video> editable MessagingIE 9 yes yes yes yes yesFF 4 yes yes yes yes yesChrome 11 yes yes yes yes yesSafari 5 yes yes yes yes yesOpera 11.10 yes yes yes yes yes HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 124 1
    • Simple Offline Texts in HTML5 <canvas> Drag and Drop Application <canvas> Cache WebForms supportIE 9 yes no yes no noFF 4 yes yes yes yes yesChrome 11 yes yes yes yes yesSafari 5 yes yes yes yes yesOpera 11.10 yes yes no yes yes HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 125 1
    • But... HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 126 1
    • Browser statistics 2011 HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 127 1
    • What‘s safe to use today? HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 128 1
    • contenteditable postMessageWeb Storage (IE 8+)New semantic tags HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 129 1
    • Any HTML5 helpers? HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 130 1
    • HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 131 1
    • HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 132 1
    • Questions? HTML5 for PHP Developer I Mayflower GmbH I 20th May 201 I 133 1
    • Thank you very much!Please rate me at http://joind.in/3239Contact Thorsten Rinne thorsten.rinne@mayflower.de +49 89 242054-31 @ThorstenRinne Mayflower GmbH Mannhardtstr. 6 80538 München Germany © 201 Mayflower GmbH 1