Loading…

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!

let's talk web standards

on

  • 1,166 views

An evening of informal sharing with University of Oslo

An evening of informal sharing with University of Oslo

Statistics

Views

Total Views
1,166
Views on SlideShare
1,132
Embed Views
34

Actions

Likes
1
Downloads
139
Comments
0

1 Embed 34

http://my.opera.com 34

Accessibility

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.

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

let's talk web standards let's talk web standards Presentation Transcript

  • Have a pizza, let’s talk Web Standards Thursday, November 4, 2010
  • Hej hej zibin Web Evangelist twitter:zibin http://www.slideshare.net/zibin Thursday, November 4, 2010
  • God bless Internet http://mediaarchive.cern.ch/MediaArchive/Photo/Public/1998/9806033/9806033/9806033-A4-at-144-dpi.jpg Thursday, November 4, 2010
  • that’s the whole universe WWW http://obamapacman.com/wp-content/uploads/2009/08/First-World-Wide-Web-Server-at-CERN-made-possible-by-Tim-Berners-Lee-hosted-on-Steve-Jobs-NeXT-workstation- computer-300x225.jpg Thursday, November 4, 2010
  • W3C is WWW’s standards police Thursday, November 4, 2010
  • Why do open Red, orange, green...Standards GO! standards matter? Thursday, November 4, 2010
  • When Standards go wrong 13717712538 http://gpssystems.net/wp-content/uploads/2009/11/sao-paulo-traffic-jam.jpg Thursday, November 4, 2010
  • Everything you need Thursday, November 4, 2010
  • Everything you need...now runs in a browser Thursday, November 4, 2010
  • Evolution of HTML Thursday, November 4, 2010
  • HTML5 = HTML (with bling) Thursday, November 4, 2010
  • Web Workers Web Forms Cross Document Messaging HTML5 widgets Canvas Text Video geolocation HTML5 and friends http://www.flickr.com/photos/fuyoh/809640616/sizes/o/ Thursday, November 4, 2010
  • Video source: http://zibin.tehais.com/?p=1641 Thursday, November 4, 2010
  • Video <embed src="http://player.youku.com/player.php/sid/ XMTk1NjY4NDc2/v.swf" quality="high" width="480" height="400" align="middle" allowScriptAccess="sameDomain" type="application/x- shockwave-flash"></embed> Thursday, November 4, 2010
  • Video <video src="video.ogg" width="300" height="150" controls></video> Thursday, November 4, 2010
  • Canvas Thursday, November 4, 2010
  • SVG Thursday, November 4, 2010
  • Thursday, November 4, 2010
  • Web Forms Text type="date" Thursday, November 4, 2010
  • Appcache Web Storage WebDB http://dev.opera.com/articles/view/offline-applications-html5-appcache/ http://www.flickr.com/photos/bfionline/2380398365/ Thursday, November 4, 2010
  • Geolocation * shamefully taken while surfing a dating site www.moteplassen.com Thursday, November 4, 2010
  • Widgets (addons) Thursday, November 4, 2010
  • Widgets on desktop, TV, mobile....fridge? Thursday, November 4, 2010
  • WHAT-WG W3C has no intention to extend HTML4 as such. Instead, further work is focusing on a reformulatoin of HTML in XML ...while the ancestry of XHTML2 comes from HTML4, XHTML 1.0 and XHTML 1.1. It is not intended to be backward compatible with its earlier versions Thursday, November 4, 2010
  • CSS3 Thursday, November 4, 2010
  • border-radius aka rounded-corners border-radius: 25px; Thursday, November 4, 2010
  • border-radius aka rounded-corners border-bottom-left-radius: 40px; border-bottom-right-radius: 40px; Thursday, November 4, 2010
  • border-radius aka rounded-corners border-bottom-left-radius: 40px; border-bottom-right-radius: 40px; Thursday, November 4, 2010
  • border-radius aka rounded-corners Thursday, November 4, 2010
  • multiple background images Thursday, November 4, 2010
  • multiple background images background: url(rose.png) no-repeat 150px -20px, url(driedrose.png) no-repeat,! ! ! ! ! ! url(fieldsky.jpg) no-repeat; Thursday, November 4, 2010
  • box-shadow box-shadow: 10px 10px 0px #fff; Thursday, November 4, 2010
  • box-shadow box-shadow: 10px 10px 20px #fff; Thursday, November 4, 2010
  • Web fonts Thursday, November 4, 2010
  • Thursday, November 4, 2010
  • text-shadow: #000000 10px 10px 19px; Thursday, November 4, 2010
  • text-shadow: 0 0 4px white, 0 -5px 4px #ff3, 2px -10px 6px #fd3, -2px -15px 11px #f80, 2px -25px 18px #f20; Thursday, November 4, 2010
  • opacity opacity: 1.0; opacity: 0.5; opacity: 0.2; Thursday, November 4, 2010
  • rgba hsla rgba(255,0,0,1.0); rgba(255,0,0,0.8); rgba(255,0,0,0.6); rgba(255,0,0,0.4); rgba(255,0,0,0.2); Thursday, November 4, 2010
  • Challenges to Standards Thursday, November 4, 2010
  • Thursday, November 4, 2010
  • Thursday, November 4, 2010
  • It’s always about politics Thursday, November 4, 2010
  • Money talks Thursday, November 4, 2010
  • the right tool, especially for SVG and Canvas learn from other IDEs. Thursday, November 4, 2010
  • Branding, geeks need to learn how to brand technologies Thursday, November 4, 2010
  • In 2022, HTML5 will reach the W3C Recommendation In 2012, HTML5 will reach the W3C Public Draft Candidate Recommendation Candidate Recommendation Proposed Recommendation Closed Web W3C Recommendation slow is good, fast is good too (two sides to everything) Thursday, November 4, 2010
  • Face the real world 4.13% myspace, mozilla, google, apple...... * * MAMA Report, Jan 2008 Thursday, November 4, 2010
  • OtW case studies Thursday, November 4, 2010
  • Case study: South Korea Thursday, November 4, 2010
  • Many sites broke whenare locked into Active X South Koreans Vista was SSL/T released?? LS tiveX Ac Why? Thursday, November 4, 2010
  • Case study: India Thursday, November 4, 2010
  • legacy issue, sites used EOT fonts which is only supported in IE. Unicode is now the preferred choice but it is complicated to migrate UNICODE EOT FONTS Thursday, November 4, 2010
  • Case study: China Thursday, November 4, 2010
  • most banks, flight bookings, and ebay-like sites need ActiveX Airline Bank Alipay Thursday, November 4, 2010
  • Future is now Thursday, November 4, 2010
  • <Thank you:-)/> Thursday, November 4, 2010
  • Q&A zibin AT opera.com twitter: zibin Thursday, November 4, 2010
  • Creative Commons license image clap http://www.flickr.com/photos/tudor/953584594/ spider web http://www.flickr.com/photos/luc_viatour/2843025968/sizes/l/in/set-72157614714349217/ now http://www.gottabemobile.com/2010/01/18/ebook-readers-strike-back-at-publishers-trying-to- maximize-profits shadow http://www.flickr.com/photos/jenny-pics/3115479281/sizes/m/ transitions transform http://www.flickr.com/photos/28481088@N00/1298930743/ borders and background http://www.flickr.com/photos/cheekyneedle/178950842/sizes/o/ web fonts http://www.flickr.com/photos/sekimura/4363831481/sizes/o/ clapping photo http://splashclubpenguin.files.wordpress.com/2009/03/101606sly_claps.jpg sun flower http://www.flickr.com/photos/treyevan/429692359/sizes/l/ transition http://www.flickr.com/photos/28481088@N00/1290363773/sizes/o/ Thursday, November 4, 2010
  • Creative Commons license image Great Wall of China http://www.flickr.com/photos/smokingpermitted/ padlock http://www.flickr.com/photos/elnicofotos/ stick no bills/tamil http://www.flickr.com/photos/meanestindian/ Killbill http://www.flickr.com/photos/wili/ money http://www.flickr.com/photos/amagill/ baby http://www.flickr.com/photos/mackro/ Open Web Stack by David Storey Tomato http://www.flickr.com/photos/somemixedstuff/ lego plane http://www.flickr.com/photos/pmiaki/ American express http://www.flickr.com/photos/andresrueda/ bush baby http://bust-the-stress.blogspot.com/2009/01/baby-sitting.html napkin http://images2.cpcache.com/product/19388882v1_480x480_Front_Color-White.jpg south korea http://www.flickr.com/photos/bibbit/2948779230/sizes/l/in/photostream/ india http://www.flickr.com/photos/jasleen_kaur/3116354699/sizes/l/in/photostream/ Thursday, November 4, 2010
  • Demo & article background and borders articles http://dev.opera.com/articles/view/css3-border-background-boxshadow/ border-radius flower demo http://people.opera.com/zibin/css3flower/flower.html transiitons and transform article http://dev.opera.com/articles/view/css3-transitions-and-2d-transforms/ web fonts article http://dev.opera.com/articles/view/seven-web-fonts-showcases/ 9elements HTML5 demo http://9elements.com/io/projects/html5/canvas/ David’s photobook demo http://people.opera.com/dstorey/transforms/image-gallery.html Presentation reference introduction to CSS2.1 and CSS3 http://www.slideshare.net/marcamos/introduction-to-css-21-and-css-3 Thursday, November 4, 2010