• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
HTML5 for ASP.NET Developers
 

HTML5 for ASP.NET Developers

on

  • 3,104 views

HTML5 is the next wave of development for the web, with the support from IE9 and IE10. Even Windows 8 will support native apps written in HTML5. This session will give an overview and a deeper dive ...

HTML5 is the next wave of development for the web, with the support from IE9 and IE10. Even Windows 8 will support native apps written in HTML5. This session will give an overview and a deeper dive into writing effective HTML5 together with your existing ASP.NET experience to create the best next generation web experience.

Statistics

Views

Total Views
3,104
Views on SlideShare
3,060
Embed Views
44

Actions

Likes
0
Downloads
36
Comments
0

2 Embeds 44

http://justinlee.sg 42
http://feeds.feedburner.com 2

Accessibility

Categories

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

CC Attribution License

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

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

    HTML5 for ASP.NET Developers HTML5 for ASP.NET Developers Presentation Transcript

    • HTML5 and ASP.NET Justin LeeSoftware Development Consultant triplez@justinlee.sg http://justinlee.sg
    • HTML5• HTML5 + Browser API + CSS3 + JavaScript• New Elements and Attributes Markup• New APIs for DOM• Video, Audio, 2D, 3D, Animations, File, Drag- and-Drop, etc. support
    • Getting things set up• Microsoft Visual Studio 2010 SP1• Web Standards Update for Microsoft Visual Studio 2010 SP1• ASP.NET MVC3• NuGet
    • Look! HTML5!
    • NuGet Packages• JQuery• Modernizr• HTML5.Setup• MvcHtml5Templates• MVCHtml5Toolkit• Html5Boilerplate.Mvc3.Razor
    • Can I Use…
    • HTML5 New Markups• <!DOCTYPE html>• <header></header>, <section></section>, <footer></footer>• <nav></nav>• New <input></input> attributes• <audio></audio>, <video></video>• <progress></progress>• <meter></meter>• Etc. etc. etc. etc. etc.
    • HTML5 New Markups
    • HTML5 New APIs• Web Storage• Web Workers• Web Sockets• Notifications• Drag-and-Drop, Drag-in• Geolocation• Canvas• Etc. etc. etc. etc.
    • HTML5 + CSS3• CSS Selectors• Webfonts• Text wrapping• Columns• Text Stroke• Opacity• HSL support• Rounded Corners• Gradients• Shadows• Border Image• Flexible Box Model• Transitions, Transforms, Animations• Etc. etc. etc. etc.
    • CSS SelectorsSelectors Negation.row:nth-child(even) { :not(.box) { background: #dde; color: #00c;} }.row:nth-child(odd) { :not(span) { background: white; display: block;} }Image-like display More specific targettingdiv { h2:first-child { ... } display: inline-block;} div.text > div { ... } h2 + header { ... }Specific attributesinput[type="text"] { background: #eee;}
    • Web Fonts@font-face { font-family: LeagueGothic; src: url(LeagueGothic.otf);}@font-face { font-family: Droid Sans; src: url(Droid_Sans.ttf);}header { font-family: LeagueGothic;}
    • HTML5 + JS• document.getElementsByClassName, document.querySelectorAll• Custom data-* attributes• Element.classList• History API• Etc. etc. etc. etc.
    • DemosHTML5 DEMOS
    • Futures for Visual Studio vNext• Web Form will be HTML5 compatible• MVC and Razor will also support HTML5• Visual Studio Intellisense will have better JS and CSS detection
    • Tips• Use ASP.NET MVC 3, not ASP.NET Web Forms (until ASP.NET 4.5)• Use Modernizr to maintain backward compatibility• Use Web Workers to maintain responsiveness
    • Tips• Consider carefully what should be processed Server-Side and Client-Side• Not all browsers support all features (Especially IE)• Learn the new markups, what you need might just be there.
    • Useful Links• Html5rocks.com• htmlfivewow.com• Caniuse.com• Supersocket.codeplex.com• Web Standards Update
    • Q&A Justin LeeSoftware Development Consultant triplez@justinlee.sg http://justinlee.sgExploring new career opportunities