Your SlideShare is downloading. ×
0
0025 todo lo_que_queria_saber_de_html5_y_no_se_animaba_a_preguntar
0025 todo lo_que_queria_saber_de_html5_y_no_se_animaba_a_preguntar
0025 todo lo_que_queria_saber_de_html5_y_no_se_animaba_a_preguntar
0025 todo lo_que_queria_saber_de_html5_y_no_se_animaba_a_preguntar
0025 todo lo_que_queria_saber_de_html5_y_no_se_animaba_a_preguntar
0025 todo lo_que_queria_saber_de_html5_y_no_se_animaba_a_preguntar
0025 todo lo_que_queria_saber_de_html5_y_no_se_animaba_a_preguntar
0025 todo lo_que_queria_saber_de_html5_y_no_se_animaba_a_preguntar
0025 todo lo_que_queria_saber_de_html5_y_no_se_animaba_a_preguntar
0025 todo lo_que_queria_saber_de_html5_y_no_se_animaba_a_preguntar
0025 todo lo_que_queria_saber_de_html5_y_no_se_animaba_a_preguntar
0025 todo lo_que_queria_saber_de_html5_y_no_se_animaba_a_preguntar
0025 todo lo_que_queria_saber_de_html5_y_no_se_animaba_a_preguntar
0025 todo lo_que_queria_saber_de_html5_y_no_se_animaba_a_preguntar
0025 todo lo_que_queria_saber_de_html5_y_no_se_animaba_a_preguntar
0025 todo lo_que_queria_saber_de_html5_y_no_se_animaba_a_preguntar
0025 todo lo_que_queria_saber_de_html5_y_no_se_animaba_a_preguntar
0025 todo lo_que_queria_saber_de_html5_y_no_se_animaba_a_preguntar
0025 todo lo_que_queria_saber_de_html5_y_no_se_animaba_a_preguntar
0025 todo lo_que_queria_saber_de_html5_y_no_se_animaba_a_preguntar
0025 todo lo_que_queria_saber_de_html5_y_no_se_animaba_a_preguntar
0025 todo lo_que_queria_saber_de_html5_y_no_se_animaba_a_preguntar
0025 todo lo_que_queria_saber_de_html5_y_no_se_animaba_a_preguntar
0025 todo lo_que_queria_saber_de_html5_y_no_se_animaba_a_preguntar
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

0025 todo lo_que_queria_saber_de_html5_y_no_se_animaba_a_preguntar

697

Published on

0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
697
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
17
Comments
0
Likes
0
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. HTML5 - thefutureforthe Web - and IE9<br />Wilson Pais<br />wpais@microsoft.com<br />Gabriel Klestorny<br />t-gakles@microsoft.com<br />
  • 2. The HTML5 Web:Graphically- and Media-Rich<br />Evolution of the Web<br />The AJAX Web: JavaScript + DOM + Asynchronous Requests<br />Web “2.0”<br />The Content Web: HTML &amp; CSS<br />Web “1.0”<br />
  • 3. A Browser Decomposed<br />
  • 4. HTML introduction<br />Basis for any webpage<br />Web evolution  HTML evolution<br />4<br />
  • 5. HTML5: What’s in it for me<br />5<br />
  • 6. HTML5: New media elements and APIs<br />&lt;video&gt; tag<br />Example: <br />&lt;video src=“video.mp4” controls /&gt;<br />&lt;audio&gt; tag<br />Example: <br />&lt;audio src=“sample.wav” /&gt;<br />6<br />
  • 7. Rich Media Integration—Without Plugins<br />HTML5 &lt;video&gt; element<br />Industry-standard MPEG-4/H.264 video<br />Video can be composited with anything else on the page<br />HTML content, images, SVG graphics<br />GPU-based implementation capable of maintaining 60fps full-screen at full HD resolution<br />Supports both DXVA and full hardware video decoders<br />HTML5 &lt;audio&gt; element<br />Industry-standard MP3 and AAC audio<br />&lt;video width=&quot;800&quot; height=&quot;450&quot; src=&quot;myvideo.mp4&quot; autoplay&gt;<br />No video for you&lt;/video&gt;<br />
  • 8. HTML5: New media elements and APIs<br /> &lt;canvas&gt; tag<br />Example: <br />&lt;canvas id=“my_canvas” width=100 height=100 /&gt;<br />&lt;script&gt;<br />varmy_canvas = document.getElementById(“my_canvas”);<br />if (my_canvas.getContext) context = my_canvas.getContext(&quot;2d&quot;);<br />// draw<br />&lt;/script&gt;<br />8<br />
  • 9. HTML5: Semantic markup<br />New elements:<br />&lt;section&gt;, &lt;header&gt;, &lt;article&gt;, &lt;nav&gt;, …<br />9<br />
  • 10. HTML5: Semantic markup<br />Deprecated elements:<br />&lt;font&gt;, &lt;center&gt;, &lt;frame&gt;<br />10<br />
  • 11. HTML5: SVG (Vector Graphics)<br /> &lt;svg&gt; element<br />Example:<br />&lt;svg&gt;<br />&lt;rect x=0 y=0 width=100 height=100 fill=&quot;red&quot; /&gt;<br />&lt;rect x=100 y=0 width=100 height=100 fill=&quot;green&quot; /&gt;<br />&lt;rect x=0 y=100 width=100 height=100 fill=&quot;blue&quot; /&gt;<br />&lt;rect x=100 y=100 width=100 height=100 fill=&quot;yellow&quot; /&gt;<br />&lt;/svg&gt;<br />11<br />
  • 12. HTML5: Forms improvements<br />Input element types:<br />Tel, search, url, email, date, number, range, color<br />New form functions:<br />Autofocus, multiple files upload<br />12<br />
  • 13. HTML5: Related technologies overview<br />CSS3<br />SVG<br />WebFonts<br />13<br />
  • 14. IE9 support for HTML5<br />IE9<br />HTML5<br />GPU Acceleration<br />Same Markup <br />Performance<br />Platform Preview<br />14<br />
  • 15. Top Objectives of Internet Explorer 9<br />Interoperable HTML5 Markup<br />Interpret the same HTML and CSS markup the same way<br />Run the same JavaScript the same way<br />GPU-powered HTML5 Graphics and Media<br />HTML5 demands a high-performance graphics subsystem<br />Across-the-board High Performance HTML5<br />JavaScript execution<br />Page layout<br />Page display<br />
  • 16. Internet Explorer 9 Platform Preview<br />
  • 17. Flying Images – One Animation<br />IE8<br />IE9<br />17<br />
  • 18. CallToAction<br />Followthestandardon W3C. Microsoft isparticipating as a co-chair of HTML Working Group<br />Try Internet Explorer 9 PlatformPreview<br />Check demos on http://ietestdrive.com<br />Wait and try IE 9 Beta – More newsthisweek !<br />More info: http://blogs.msdn.com/ie<br />
  • 19. ¡THANKS! ¡GRACIAS!<br />Wilson Pais<br />wpais@microsoft.com<br />Gabriel Klestorny<br />t-gakles@microsoft.com<br />
  • 20. © 2010 Microsoft Corporation. All rights reserved. Microsoft, Windows, Windows Vista and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries.<br />The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.<br />
  • 21. AdditionalSlidesjustforreference<br />
  • 22. Markup and Programming Model in Internet Explorer Platform Preview<br />
  • 23. SVG in Internet Explorer Platform Preview<br />
  • 24. GPU-Powered HTML5<br />

×