• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content


Flash Player 9 (or above) is needed to view presentations.
We have detected that you do not have it on your computer. To install it, go here.

Like this presentation? Why not share!

W3C Widgets: Apps made with Web Standards



15 min talk to Sydney Web Standards Group on W3C Widgets for mobile and cross-device apps made with HTMLL5, CSS and JavaScript.

15 min talk to Sydney Web Standards Group on W3C Widgets for mobile and cross-device apps made with HTMLL5, CSS and JavaScript.

Bruce Lawson, Opera Software, 22 November 2020



Total Views
Views on SlideShare
Embed Views



2 Embeds 42

http://my.opera.com 41
http://localhost 1


Upload Details

Uploaded via 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.

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

    W3C Widgets: Apps made with Web Standards W3C Widgets: Apps made with Web Standards Presentation Transcript

    • HTML5 you may ask yourself: how did we get here? Bruce Lawson, Opera Software WIPA tour/ Sydney, Melbourne, Canberra, Perth, Brisbane / November 2010
    • Archiutect pic
    • XHTML 2 <img />
    • Thank you @mamipeko http://d.hatena.ne.jp/Mamipeko/
    • We consider Web Applications to be an important area that has not been adequately served by existing technologies… There is a rising threat of single- vendor solutions addressing this problem before jointly-developed specifications. http://www.w3.org/2004/04/webapps-cdf-ws/papers/opera.html
    • © Copyright 2004-2010 Apple Computer, Inc., Mozilla Foundation, and Opera Software ASA. You are granted a license to use, reproduce and create derivative works of this document. http://www.whatwg.org/specs/web-apps/current-work/
    • 2007 W3C HTML group revived
    • Why HTML5 wins ● Backwards compatibility, and a clear migration path. ● Well-defined error handling. ● Users should not be exposed to authoring errors.
    • Why HTML5 wins ● Practical use: every feature that goes into the Web- applications specifications must be justified by a practical use case. ●Scripting is here to stay (but should be avoided where more convenient declarative mark-up can be used). ● Open process (arguable!).
    • Other Design Principles ● Pave the cowpaths. ● 80/ 20 rule ●Consider users over authors over implementors over specifiers over theoretical purity.
    • HTML5 <!DOCTYPE html>
    • Geolocation SVG CSS
    • HTML5 does not replace HTML 4.01
    • HTML5 has more bling!
    • HTML5 is umbrella term: markup elements and JavaScript APIs
    • 30 new elements (or maybe 31)
    • Top class names 1. footer 11. button 2. menu 12. main 3. style1 13. style3 4. msonormal 14. small 5. text 15. nav 6. content 16. clear 7. title 17. search 8. style2 18. style4 9. header 19. logo 10. copyright 20. body http://devfiles.myopera.com/articles/572/classlist-url.htm
    • Top 20 id names 1. footer 11. search 2. content 12. nav 3. header 13. wrapper 4. logo 14. top 5. container 15. table2 6. main 16. layer2 7. table1 17. sidebar 8. menu 18. image1 9. layer1 19. banner 10. autonumber1 20. navigation http://devfiles.myopera.com/articles/572/idlist-url.htm
    • Webforms – more powerful form elements
    • standardise commonly-used rich form elements – without JavaScript
    • built-in validation (of course you should still validate on the server) <input type=email> <input type=url required> <input type=range min=10 max=100> <input type=date min=2010-01-01 max=2010-12-31> <input pattern="[0-9][A-Z]{3}" placeholder="9AAA"> http://people.opera.com/brucel/demo/html5-forms-demo.html
    • HTML5 Myths
    • “...extending the language to better support Web applications, since that is one of the directions the Web is going in and is one of the areas least well served by HTML so far. This puts HTML in direct competition with other technologies intended for applications deployed over the Web, in particular Flash and Silverlight.” Ian Hickson, Editor of HTML5 http://lists.w3.org/Archives/Public/public-html/2009Jan/0215.html
    • Photo credits Mamipeko's nails and face by Mamipeko, used with permission All 5 Mamipeko's nails together http://www.flickr.com/photos/drzuco/4826509298/sizes/o/in/photostream/ (with permission) Green tea: http://en.wikipedia.org/wiki/File:Sencha.jpg Sad farewell, overturned wheelchair from iStockphoto, all rights reserved. NOT FOR BEING RE-USED. All others, me or public domain
    • www.opera.com/developer bruce.lawson@opera.com www.brucelawson.co.uk twitter.com/brucel