HTML5: Not Just for Breakfast
•Als PPTX, PDF herunterladen•
0 gefällt mir•1,911 views
Presented at the 2011, Esri Developer Summit, this talk focuses on designing appropriate "experiences" for target platform - desktop, tablet or mobile, as well as how we can leverage HTML5 to do this efficiently.
Empfohlen
Empfohlen
Weitere ähnliche Inhalte
Was ist angesagt?
Was ist angesagt? (14)
Ähnlich wie HTML5: Not Just for Breakfast
Ähnlich wie HTML5: Not Just for Breakfast (15)
Mehr von Dave Bouwman
Mehr von Dave Bouwman (13)
Kürzlich hochgeladen
Kürzlich hochgeladen (20)
HTML5: Not Just for Breakfast
- 1. NOT JUST FOR BREAKFAST ANYMORE. Dave Bouwman, Head Geek Mike Juniper, Javascript Ninja
- 2. I’ve seen the FUTURE and it’s my BROWSER
- 4. We Bob Muglia, VP, Microsoft
- 8. vs. native web
- 9. Bret Taylor, CTO, FaceBook
- 11. WTF?
- 12. 4 things
- 14. <div id=“header”> <div id=“nav”> <div class=“article”> <div id=“sidebar”> <div class=“section”> <div id=“footer”>
- 15. <header> <nav> <article> <aside> <section> <footer>
- 17. 2) CSS3
- 18. Where is MAI Kitteh!
- 19. DEMO
- 22. Geolocation Local storage WebGL, Canvas*, WebWorkers, SVG*, Drag & Drop Geolocation http://www.flickr.com/photos/hendry/3642114424
- 23. key : value Local Storage
- 24. Canvas & SVG
- 25. WebGL
- 28. Die. Die. Die.
- 31. tehsuk.
- 33. != Touch vs. Point
- 35. Client Specific Views http://www.flickr.com/photos/gray_macbook/5371234004
- 36. View Controller ViewEngine Request View View Normal Request/Response
- 37. Controller Custom ViewEngine Request View Phone View Tablet View Desktop View UserAgent? Custom ViewEngine
- 38. I think in code…
- 40. Controller Custom ViewEngine Request View Mobile View iPad View Desktop View Sorry! HTML + Javascript Flex UserAgent? Views
- 41. CODE SCREEN CAP
- 44. Demo time!
- 45. WxMappr.com
- 46. Controller Custom ViewEngine Request View Mobile View iPad View Desktop View HTML + Javascript jQueryMobile HTML + Javascript Orientation Aware HTML + Javascript UserAgent? Views
- 48. Demo time!
- 50. Controller Custom ViewEngine Request View Small Screen View Large Screen View HTML + Javascript HTML + Javascript UserAgent + WURFL Views
- 51. Browser Capabilities added in CustomViews
- 52. Demo time!
- 53. Aw man… I hate server side code
- 54. Modernizr + Jquery + partials
- 57. I’ve seen the FUTURE and it’s my BROWSER
- 58. Resources & Questions WxMappr.com http://github.com/dtsagile Maps.saferoutesinfo.org
Hinweis der Redaktion
- And we all know Google Loves HTML – Google Apps is a web based version of an office suite, but if that’s not enough, they also wrote a love story about HTML5And recently, on Google has been re-mixing their logo using adding HTML5 – this one is an interactive tribute to 20,000 leagues under the sea
- Silverlight FirestarterGu, Tim Heuer, John Papa, Jesse Liberty and other cogniscenti all to try and convince everyone that MS loved Silverlight and that seemed to have worked for a while, until last week’s MVP summit where the ASP.NET team were spotted rollin like this. Anyhow Microsoft clearly loves HTML5 AND Silverlight
- Native is for “high touch” things. Web is for low touch.
- FaceBook supports 18 native applications – too much! Moving to HTML5… even farmville!
- So we have 4 of the largest technology companies agreeing (to some degree) that HTML5 is the future… but
- What IS HTML5
- For the purposes of this talk I’t really 3
- So if we look at a typical page layout… divs and pretty common ID’s and Classes – which mean things to you and I, but not to the machine…
- With HTML5, we get new DOM elements, which have semantic meaning.
- Allows computers to “understand” the content better
- Gradients and rounded corners – help avoid using images on pages. We also have much wider support for web fonts, which now allows
- Also WebDB – relational database in the browser.
- As well as some other less widely implemented stuff
- Google Body Browser in Chrome to see what this is all about.
- So – HTML5 brings unicorsand rainbows to the world. Great… just
- There are two things to contend with
- The second problem is IE
- It’s not just that IE does not support HTML5 in any meaningful way, even more important is javascript performanceSo – the latest version of IE is >5 times slower than other more modern browsers. And IE 6 and 7 are more than double that!So the simple answer has been to use Flex of Silverlight
- Desktopvs tablets vs phones – very different screen sizes, and user xpectations
- This alone means that you need a separate “view” for touch devices – also note that Flex on Android != same app for desktop and mobile!
- So – what do we do? Multiple devices, form factors, javascript environments
- Since we have different needs for different client devices, lets drop the idea that we can create ONE thing and run it everywhere – use some infrastructure to create optimized views for each device.
- Ags2.dtsagile.com/arcstache
- WURFL
- Ags2.dtsagile.com/arcstache