SlideShare a Scribd company logo
1 of 35
Download to read offline
Web Standar
            by Zibin Cheah




                    University Tour 2009

Tuesday, December 8, 2009
Tuesday, December 8, 2009
Tuesday, December 8, 2009
Tuesday, December 8, 2009
Tuesday, December 8, 2009
Tuesday, December 8, 2009
Tuesday, December 8, 2009
Permulaan Web



Tuesday, December 8, 2009
Tuesday, December 8, 2009
Tim Berner Lee
              In1989, this guy named his baby WWW
Tuesday, December 8, 2009
OpenWeb stack
                                                 [OGG/ VMS/Dirac]?                        Widgets
                                                 Audio & Video
                                SMIL
                  Media




                                Sycronise-

                                                 SVG               PNG/JPG/GIF                   <canvas>
                                ation

                                                 Vector Graphics   Raster Graphics               Drawing API
                 Behaviour




                                 DOM                               ECMA/JavaScript
                                  Document API                     Scripting
                 Presentation




                                 CSS
                                  Style sheets
                 Structure




                                 XML                XHTML/HTML                       RDFa          ARIA
                                                    Markup                           Semantics     Accessibility



Tuesday, December 8, 2009
OpenWeb stack
                                                 [OGG/ VMS/Dirac]?                        Widgets
                                                 Audio & Video
                                SMIL
                  Media




                                Sycronise-

                                                 SVG               PNG/JPG/GIF                   <canvas>
                                ation

                                                 Vector Graphics   Raster Graphics               Drawing API
                 Behaviour




                                 DOM                               ECMA/JavaScript
                                  Document API                     Scripting
                 Presentation




                                 CSS
                                  Style sheets
                 Structure




                                 XML                HTML 5/XHTML                     RDFa          ARIA
                                                    Markup                           Semantics     Accessibility



Tuesday, December 8, 2009
OpenWeb stack
                                                 [OGG/ VMS/Dirac]?                        Widgets
                                                 Audio & Video
                                SMIL
                  Media




                                Sycronise-

                                                 SVG               PNG/JPG/GIF                   <canvas>
                                ation

                                                 Vector Graphics   Raster Graphics               Drawing API
                 Behaviour




                                 DOM                               ECMA/JavaScript
                                  Document API                     Scripting
                 Presentation




                                 CSS
                                  Style sheets
                 Structure




                                 XML                HTML 5/XHTML                     RDFa          ARIA
                                                    Markup                           Semantics     Accessibility


                                        + Opera Unite & Opera Turbo
Tuesday, December 8, 2009
Browser


              Platform



               Device



Tuesday, December 8, 2009
Exciting Graphics !




                                           Boring Graphics......
                               SV
                                 G




Tuesday, December 8, 2009
Tuesday, December 8, 2009
Tuesday, December 8, 2009
Example Time!




Tuesday, December 8, 2009
Industry leading SVG support
                                                 SVG 1.1 support (%)


                 Opera 10                                                          93.89




                    Safari 4                                           81.93




                Firefox 3.5                                60.40




                            IE 8


                                   0        25           50            75                       100

                                                                               Source: http://www.codedread.com/svg-support.php

Tuesday, December 8, 2009
Exciting applications !



                            W
                              idg              Boring
                                 ets        Application......




Tuesday, December 8, 2009
Tuesday, December 8, 2009
W3C Standards
                            Browser Independent
                            Runs on phone, TV, desktop




Tuesday, December 8, 2009
More Example !




Tuesday, December 8, 2009
Opera Turbo
      X-Forwarded-For HTTP Header




Tuesday, December 8, 2009
Tuesday, December 8, 2009
Let’s watch a movie !




Tuesday, December 8, 2009
Local Storage
       Opera Unite




   unite.opera.com
Tuesday, December 8, 2009
Tuesday, December 8, 2009
Tuesday, December 8, 2009
Tuesday, December 8, 2009
Tuesday, December 8, 2009
Tab browsing, speed dial, touch / keypad, save password




Tuesday, December 8, 2009
tusen takk, terima kasih!

                            More Info
                            dev.opera.com
                            my.opera.com/odin
                            zibin@opera.com
                            twitter: zibin
                            zibin.tehais.com


Tuesday, December 8, 2009
Creative Commons license image

               Phone booth http://www.flickr.com/photos/rickharris/261846074/
               Speedometer: http://www.flickr.com/photos/adc/391594014/
               Danish sockets: http://www.flickr.com/photos/xoxoryan/3767746478/
               People Globe http://www.flickr.com/photos/linhngan/2645589939/
               Norwegian mountains
               Baby face http://www.flickr.com/photos/hypertypos/
               Baby face 2 http://www.flickr.com/photos/dq090702/
               World map http://www.flickr.com/photos/kahtava/

               Other Slides/images

               HTML5 scientist by Bruce Lawson
               Closed and Open platform by David Storey
               ACID3 test snapshot by David Storey
               Opera Unite globe by Oleg Melnychuk

               Slides design and contents by Zibin Cheah




Tuesday, December 8, 2009
Opera 10            Safari 4




                            Firefox 3.5   Internet Explorer 8
Tuesday, December 8, 2009

More Related Content

Viewers also liked

W3C/Webkit test integration presentation
W3C/Webkit test integration presentationW3C/Webkit test integration presentation
W3C/Webkit test integration presentationjacobg415
 
Webseiten für mobile Geräte - M-Days - Frankfurt 27.01.2011
Webseiten für mobile Geräte - M-Days - Frankfurt 27.01.2011Webseiten für mobile Geräte - M-Days - Frankfurt 27.01.2011
Webseiten für mobile Geräte - M-Days - Frankfurt 27.01.2011Patrick Lauke
 
Making your site mobile-friendly / RIT++
Making your site mobile-friendly / RIT++Making your site mobile-friendly / RIT++
Making your site mobile-friendly / RIT++Patrick Lauke
 
HTML5 APIs - native multimedia support and beyond - University of Leeds 05.05...
HTML5 APIs - native multimedia support and beyond - University of Leeds 05.05...HTML5 APIs - native multimedia support and beyond - University of Leeds 05.05...
HTML5 APIs - native multimedia support and beyond - University of Leeds 05.05...Patrick Lauke
 
Staying in the fast lane - tools to keep your site speedy and light
Staying in the fast lane - tools to keep your site speedy and lightStaying in the fast lane - tools to keep your site speedy and light
Staying in the fast lane - tools to keep your site speedy and lightstefanjudis
 
Node.js, le pavé dans la mare
Node.js, le pavé dans la mareNode.js, le pavé dans la mare
Node.js, le pavé dans la mareValtech
 
AngularJS Directives - DSL for your HTML
AngularJS Directives - DSL for your HTMLAngularJS Directives - DSL for your HTML
AngularJS Directives - DSL for your HTMLLukas Ruebbelke
 
Standards.Next: Canvas
Standards.Next: CanvasStandards.Next: Canvas
Standards.Next: CanvasMartin Kliehm
 
Bruce Lawson Opera Indonesia
Bruce Lawson Opera IndonesiaBruce Lawson Opera Indonesia
Bruce Lawson Opera Indonesiabrucelawson
 
Bruce lawson Stockholm Geek Meet
Bruce lawson Stockholm Geek MeetBruce lawson Stockholm Geek Meet
Bruce lawson Stockholm Geek Meetbrucelawson
 
Bruce Lawson, Web Development 2.0, SparkUp! Poznan Poland
Bruce Lawson, Web Development 2.0, SparkUp! Poznan PolandBruce Lawson, Web Development 2.0, SparkUp! Poznan Poland
Bruce Lawson, Web Development 2.0, SparkUp! Poznan Polandbrucelawson
 
HTML5 multimedia - where we are, where we're going
HTML5 multimedia - where we are, where we're goingHTML5 multimedia - where we are, where we're going
HTML5 multimedia - where we are, where we're goingbrucelawson
 
W3C Widgets: Apps made with Web Standards
W3C Widgets: Apps made with Web StandardsW3C Widgets: Apps made with Web Standards
W3C Widgets: Apps made with Web Standardsbrucelawson
 
Why Open Web Standards are cool and will save the world. Or the Web, at least.
Why Open Web Standards are cool and will save the world. Or the Web, at least.Why Open Web Standards are cool and will save the world. Or the Web, at least.
Why Open Web Standards are cool and will save the world. Or the Web, at least.brucelawson
 
Bruce lawson-over-the-air
Bruce lawson-over-the-airBruce lawson-over-the-air
Bruce lawson-over-the-airbrucelawson
 
The once and future web - Front Row Conference Krakow 20.10.2011
The once and future web - Front Row Conference Krakow 20.10.2011The once and future web - Front Row Conference Krakow 20.10.2011
The once and future web - Front Row Conference Krakow 20.10.2011Patrick Lauke
 
HTML5 Multimedia Accessibility
HTML5 Multimedia AccessibilityHTML5 Multimedia Accessibility
HTML5 Multimedia Accessibilitybrucelawson
 
Leaving Flatland: Getting Started with WebGL- SXSW 2012
Leaving Flatland: Getting Started with WebGL- SXSW 2012Leaving Flatland: Getting Started with WebGL- SXSW 2012
Leaving Flatland: Getting Started with WebGL- SXSW 2012philogb
 

Viewers also liked (20)

W3C/Webkit test integration presentation
W3C/Webkit test integration presentationW3C/Webkit test integration presentation
W3C/Webkit test integration presentation
 
Webseiten für mobile Geräte - M-Days - Frankfurt 27.01.2011
Webseiten für mobile Geräte - M-Days - Frankfurt 27.01.2011Webseiten für mobile Geräte - M-Days - Frankfurt 27.01.2011
Webseiten für mobile Geräte - M-Days - Frankfurt 27.01.2011
 
HTML5 and XHTML2
HTML5 and XHTML2HTML5 and XHTML2
HTML5 and XHTML2
 
Making your site mobile-friendly / RIT++
Making your site mobile-friendly / RIT++Making your site mobile-friendly / RIT++
Making your site mobile-friendly / RIT++
 
HTML5 APIs - native multimedia support and beyond - University of Leeds 05.05...
HTML5 APIs - native multimedia support and beyond - University of Leeds 05.05...HTML5 APIs - native multimedia support and beyond - University of Leeds 05.05...
HTML5 APIs - native multimedia support and beyond - University of Leeds 05.05...
 
Staying in the fast lane - tools to keep your site speedy and light
Staying in the fast lane - tools to keep your site speedy and lightStaying in the fast lane - tools to keep your site speedy and light
Staying in the fast lane - tools to keep your site speedy and light
 
Node.js, le pavé dans la mare
Node.js, le pavé dans la mareNode.js, le pavé dans la mare
Node.js, le pavé dans la mare
 
AngularJS Directives - DSL for your HTML
AngularJS Directives - DSL for your HTMLAngularJS Directives - DSL for your HTML
AngularJS Directives - DSL for your HTML
 
Standards.Next: Canvas
Standards.Next: CanvasStandards.Next: Canvas
Standards.Next: Canvas
 
Bruce Lawson Opera Indonesia
Bruce Lawson Opera IndonesiaBruce Lawson Opera Indonesia
Bruce Lawson Opera Indonesia
 
Bruce lawson Stockholm Geek Meet
Bruce lawson Stockholm Geek MeetBruce lawson Stockholm Geek Meet
Bruce lawson Stockholm Geek Meet
 
HTML5 and CSS 3
HTML5 and CSS 3HTML5 and CSS 3
HTML5 and CSS 3
 
Bruce Lawson, Web Development 2.0, SparkUp! Poznan Poland
Bruce Lawson, Web Development 2.0, SparkUp! Poznan PolandBruce Lawson, Web Development 2.0, SparkUp! Poznan Poland
Bruce Lawson, Web Development 2.0, SparkUp! Poznan Poland
 
HTML5 multimedia - where we are, where we're going
HTML5 multimedia - where we are, where we're goingHTML5 multimedia - where we are, where we're going
HTML5 multimedia - where we are, where we're going
 
W3C Widgets: Apps made with Web Standards
W3C Widgets: Apps made with Web StandardsW3C Widgets: Apps made with Web Standards
W3C Widgets: Apps made with Web Standards
 
Why Open Web Standards are cool and will save the world. Or the Web, at least.
Why Open Web Standards are cool and will save the world. Or the Web, at least.Why Open Web Standards are cool and will save the world. Or the Web, at least.
Why Open Web Standards are cool and will save the world. Or the Web, at least.
 
Bruce lawson-over-the-air
Bruce lawson-over-the-airBruce lawson-over-the-air
Bruce lawson-over-the-air
 
The once and future web - Front Row Conference Krakow 20.10.2011
The once and future web - Front Row Conference Krakow 20.10.2011The once and future web - Front Row Conference Krakow 20.10.2011
The once and future web - Front Row Conference Krakow 20.10.2011
 
HTML5 Multimedia Accessibility
HTML5 Multimedia AccessibilityHTML5 Multimedia Accessibility
HTML5 Multimedia Accessibility
 
Leaving Flatland: Getting Started with WebGL- SXSW 2012
Leaving Flatland: Getting Started with WebGL- SXSW 2012Leaving Flatland: Getting Started with WebGL- SXSW 2012
Leaving Flatland: Getting Started with WebGL- SXSW 2012
 

Similar to Standards Talk - Opera Uni Tour Indonesia

Mozilla in Vietnam 2009
Mozilla in Vietnam 2009Mozilla in Vietnam 2009
Mozilla in Vietnam 2009Gen Kanai
 
Web Standards @ Opera Talk Oslo
Web Standards @ Opera Talk OsloWeb Standards @ Opera Talk Oslo
Web Standards @ Opera Talk OsloZi Bin Cheah
 
Dive into HTML5: SVG and Canvas
Dive into HTML5: SVG and CanvasDive into HTML5: SVG and Canvas
Dive into HTML5: SVG and CanvasDoris Chen
 
An Intro to Mobile HTML5
An Intro to Mobile HTML5An Intro to Mobile HTML5
An Intro to Mobile HTML5James Pearce
 
HTML5: State of the Union
HTML5: State of the UnionHTML5: State of the Union
HTML5: State of the UnionSencha
 
Next Generation Web Attacks – HTML 5, DOM(L3) and XHR(L2)
Next Generation Web Attacks – HTML 5, DOM(L3) and XHR(L2)Next Generation Web Attacks – HTML 5, DOM(L3) and XHR(L2)
Next Generation Web Attacks – HTML 5, DOM(L3) and XHR(L2)Shreeraj Shah
 
Web Standards Infographics
Web Standards InfographicsWeb Standards Infographics
Web Standards Infographicsdynamis
 
Qcon flex体系架构深度剖析
Qcon flex体系架构深度剖析Qcon flex体系架构深度剖析
Qcon flex体系架构深度剖析youzitang
 
Adobe Flex体系架构深度剖析
Adobe Flex体系架构深度剖析Adobe Flex体系架构深度剖析
Adobe Flex体系架构深度剖析George Ang
 
Flex体系架构剖析
Flex体系架构剖析Flex体系架构剖析
Flex体系架构剖析ematrix
 
Mozilla In Malaysia
Mozilla In MalaysiaMozilla In Malaysia
Mozilla In MalaysiaGen Kanai
 
Building Cloud-Based Cross-Platform Mobile Web Apps
Building Cloud-Based Cross-Platform Mobile Web AppsBuilding Cloud-Based Cross-Platform Mobile Web Apps
Building Cloud-Based Cross-Platform Mobile Web AppsJames Pearce
 
Dive Into HTML5
Dive Into HTML5Dive Into HTML5
Dive Into HTML5Doris Chen
 
FOSS Sthlm: Realtime Communication Update
FOSS Sthlm: Realtime Communication UpdateFOSS Sthlm: Realtime Communication Update
FOSS Sthlm: Realtime Communication UpdateOlle E Johansson
 
HTML5, Silverlight & Kinect
HTML5, Silverlight & KinectHTML5, Silverlight & Kinect
HTML5, Silverlight & KinectFrank La Vigne
 
Talk by Tomas Lin on Building Killer RIAs with Flex and Grails at the Groovy ...
Talk by Tomas Lin on Building Killer RIAs with Flex and Grails at the Groovy ...Talk by Tomas Lin on Building Killer RIAs with Flex and Grails at the Groovy ...
Talk by Tomas Lin on Building Killer RIAs with Flex and Grails at the Groovy ...Skills Matter
 
A Snapshot of the Mobile HTML5 Revolution
A Snapshot of the Mobile HTML5 RevolutionA Snapshot of the Mobile HTML5 Revolution
A Snapshot of the Mobile HTML5 RevolutionJames Pearce
 
Building cross platform mobile web apps
Building cross platform mobile web appsBuilding cross platform mobile web apps
Building cross platform mobile web appsJames Pearce
 
Modern Architectures with Spring and JavaScript
Modern Architectures with Spring and JavaScriptModern Architectures with Spring and JavaScript
Modern Architectures with Spring and JavaScriptmartinlippert
 

Similar to Standards Talk - Opera Uni Tour Indonesia (20)

Mozilla in Vietnam 2009
Mozilla in Vietnam 2009Mozilla in Vietnam 2009
Mozilla in Vietnam 2009
 
Web Standards @ Opera Talk Oslo
Web Standards @ Opera Talk OsloWeb Standards @ Opera Talk Oslo
Web Standards @ Opera Talk Oslo
 
Dive into HTML5: SVG and Canvas
Dive into HTML5: SVG and CanvasDive into HTML5: SVG and Canvas
Dive into HTML5: SVG and Canvas
 
An Intro to Mobile HTML5
An Intro to Mobile HTML5An Intro to Mobile HTML5
An Intro to Mobile HTML5
 
HTML5: State of the Union
HTML5: State of the UnionHTML5: State of the Union
HTML5: State of the Union
 
Next Generation Web Attacks – HTML 5, DOM(L3) and XHR(L2)
Next Generation Web Attacks – HTML 5, DOM(L3) and XHR(L2)Next Generation Web Attacks – HTML 5, DOM(L3) and XHR(L2)
Next Generation Web Attacks – HTML 5, DOM(L3) and XHR(L2)
 
Web Standards Infographics
Web Standards InfographicsWeb Standards Infographics
Web Standards Infographics
 
Qcon flex体系架构深度剖析
Qcon flex体系架构深度剖析Qcon flex体系架构深度剖析
Qcon flex体系架构深度剖析
 
Adobe Flex体系架构深度剖析
Adobe Flex体系架构深度剖析Adobe Flex体系架构深度剖析
Adobe Flex体系架构深度剖析
 
Flex体系架构剖析
Flex体系架构剖析Flex体系架构剖析
Flex体系架构剖析
 
Mozilla In Malaysia
Mozilla In MalaysiaMozilla In Malaysia
Mozilla In Malaysia
 
Building Cloud-Based Cross-Platform Mobile Web Apps
Building Cloud-Based Cross-Platform Mobile Web AppsBuilding Cloud-Based Cross-Platform Mobile Web Apps
Building Cloud-Based Cross-Platform Mobile Web Apps
 
Dive Into HTML5
Dive Into HTML5Dive Into HTML5
Dive Into HTML5
 
FOSS Sthlm: Realtime Communication Update
FOSS Sthlm: Realtime Communication UpdateFOSS Sthlm: Realtime Communication Update
FOSS Sthlm: Realtime Communication Update
 
HTML5, Silverlight & Kinect
HTML5, Silverlight & KinectHTML5, Silverlight & Kinect
HTML5, Silverlight & Kinect
 
Talk by Tomas Lin on Building Killer RIAs with Flex and Grails at the Groovy ...
Talk by Tomas Lin on Building Killer RIAs with Flex and Grails at the Groovy ...Talk by Tomas Lin on Building Killer RIAs with Flex and Grails at the Groovy ...
Talk by Tomas Lin on Building Killer RIAs with Flex and Grails at the Groovy ...
 
A Snapshot of the Mobile HTML5 Revolution
A Snapshot of the Mobile HTML5 RevolutionA Snapshot of the Mobile HTML5 Revolution
A Snapshot of the Mobile HTML5 Revolution
 
Building cross platform mobile web apps
Building cross platform mobile web appsBuilding cross platform mobile web apps
Building cross platform mobile web apps
 
Modern Architectures with Spring and JavaScript
Modern Architectures with Spring and JavaScriptModern Architectures with Spring and JavaScript
Modern Architectures with Spring and JavaScript
 
Svghtml5 Meetup
Svghtml5 MeetupSvghtml5 Meetup
Svghtml5 Meetup
 

More from Zi Bin Cheah

W3C HTML5 Chinese IG Report
W3C HTML5 Chinese IG ReportW3C HTML5 Chinese IG Report
W3C HTML5 Chinese IG ReportZi Bin Cheah
 
Beyond HTML5:Device, Graphics, Orientation, Real Time
Beyond HTML5:Device, Graphics, Orientation, Real TimeBeyond HTML5:Device, Graphics, Orientation, Real Time
Beyond HTML5:Device, Graphics, Orientation, Real TimeZi Bin Cheah
 
Opera Mobile HTML5 CSS3 Standards
Opera Mobile HTML5 CSS3 StandardsOpera Mobile HTML5 CSS3 Standards
Opera Mobile HTML5 CSS3 StandardsZi Bin Cheah
 
不懂HTML5 非好汉 Be a man, learn HTML5
不懂HTML5 非好汉 Be a man, learn HTML5不懂HTML5 非好汉 Be a man, learn HTML5
不懂HTML5 非好汉 Be a man, learn HTML5Zi Bin Cheah
 
Taiwan Web Standards Talk 2011
Taiwan Web Standards Talk 2011Taiwan Web Standards Talk 2011
Taiwan Web Standards Talk 2011Zi Bin Cheah
 
Nigeria & Designing for the Mobile Web
Nigeria & Designing for the Mobile WebNigeria & Designing for the Mobile Web
Nigeria & Designing for the Mobile WebZi Bin Cheah
 
Web Standards Indonesia Tour
Web Standards Indonesia TourWeb Standards Indonesia Tour
Web Standards Indonesia TourZi Bin Cheah
 
let's talk web standards
let's talk web standardslet's talk web standards
let's talk web standardsZi Bin Cheah
 
Mobile Web Trends inIndonesia
Mobile Web Trends inIndonesiaMobile Web Trends inIndonesia
Mobile Web Trends inIndonesiaZi Bin Cheah
 
Browsers & Web Technology - an Opera talk
Browsers & Web Technology - an Opera talkBrowsers & Web Technology - an Opera talk
Browsers & Web Technology - an Opera talkZi Bin Cheah
 
Designing for the mobile web
Designing for the mobile webDesigning for the mobile web
Designing for the mobile webZi Bin Cheah
 
Standards: politics, case studies
Standards: politics, case studiesStandards: politics, case studies
Standards: politics, case studiesZi Bin Cheah
 
CSS3大補貼 - COSCUP/GNOME.asia
CSS3大補貼 - COSCUP/GNOME.asiaCSS3大補貼 - COSCUP/GNOME.asia
CSS3大補貼 - COSCUP/GNOME.asiaZi Bin Cheah
 
Html5/CSS3 in shanghai 2010
Html5/CSS3 in shanghai 2010Html5/CSS3 in shanghai 2010
Html5/CSS3 in shanghai 2010Zi Bin Cheah
 
HTML5/CSS3 @ Baidu
HTML5/CSS3 @ BaiduHTML5/CSS3 @ Baidu
HTML5/CSS3 @ BaiduZi Bin Cheah
 
谈一谈HTML5/CSS3 @ WebRebuild 2010
谈一谈HTML5/CSS3 @ WebRebuild 2010谈一谈HTML5/CSS3 @ WebRebuild 2010
谈一谈HTML5/CSS3 @ WebRebuild 2010Zi Bin Cheah
 
Cutting Edge CSS3 @ WebExpo Tour 2010
Cutting Edge CSS3 @ WebExpo Tour 2010Cutting Edge CSS3 @ WebExpo Tour 2010
Cutting Edge CSS3 @ WebExpo Tour 2010Zi Bin Cheah
 
Browser War 2: Standards strikes back
Browser War 2: Standards strikes backBrowser War 2: Standards strikes back
Browser War 2: Standards strikes backZi Bin Cheah
 

More from Zi Bin Cheah (19)

W3C HTML5 Chinese IG Report
W3C HTML5 Chinese IG ReportW3C HTML5 Chinese IG Report
W3C HTML5 Chinese IG Report
 
Html5games
Html5gamesHtml5games
Html5games
 
Beyond HTML5:Device, Graphics, Orientation, Real Time
Beyond HTML5:Device, Graphics, Orientation, Real TimeBeyond HTML5:Device, Graphics, Orientation, Real Time
Beyond HTML5:Device, Graphics, Orientation, Real Time
 
Opera Mobile HTML5 CSS3 Standards
Opera Mobile HTML5 CSS3 StandardsOpera Mobile HTML5 CSS3 Standards
Opera Mobile HTML5 CSS3 Standards
 
不懂HTML5 非好汉 Be a man, learn HTML5
不懂HTML5 非好汉 Be a man, learn HTML5不懂HTML5 非好汉 Be a man, learn HTML5
不懂HTML5 非好汉 Be a man, learn HTML5
 
Taiwan Web Standards Talk 2011
Taiwan Web Standards Talk 2011Taiwan Web Standards Talk 2011
Taiwan Web Standards Talk 2011
 
Nigeria & Designing for the Mobile Web
Nigeria & Designing for the Mobile WebNigeria & Designing for the Mobile Web
Nigeria & Designing for the Mobile Web
 
Web Standards Indonesia Tour
Web Standards Indonesia TourWeb Standards Indonesia Tour
Web Standards Indonesia Tour
 
let's talk web standards
let's talk web standardslet's talk web standards
let's talk web standards
 
Mobile Web Trends inIndonesia
Mobile Web Trends inIndonesiaMobile Web Trends inIndonesia
Mobile Web Trends inIndonesia
 
Browsers & Web Technology - an Opera talk
Browsers & Web Technology - an Opera talkBrowsers & Web Technology - an Opera talk
Browsers & Web Technology - an Opera talk
 
Designing for the mobile web
Designing for the mobile webDesigning for the mobile web
Designing for the mobile web
 
Standards: politics, case studies
Standards: politics, case studiesStandards: politics, case studies
Standards: politics, case studies
 
CSS3大補貼 - COSCUP/GNOME.asia
CSS3大補貼 - COSCUP/GNOME.asiaCSS3大補貼 - COSCUP/GNOME.asia
CSS3大補貼 - COSCUP/GNOME.asia
 
Html5/CSS3 in shanghai 2010
Html5/CSS3 in shanghai 2010Html5/CSS3 in shanghai 2010
Html5/CSS3 in shanghai 2010
 
HTML5/CSS3 @ Baidu
HTML5/CSS3 @ BaiduHTML5/CSS3 @ Baidu
HTML5/CSS3 @ Baidu
 
谈一谈HTML5/CSS3 @ WebRebuild 2010
谈一谈HTML5/CSS3 @ WebRebuild 2010谈一谈HTML5/CSS3 @ WebRebuild 2010
谈一谈HTML5/CSS3 @ WebRebuild 2010
 
Cutting Edge CSS3 @ WebExpo Tour 2010
Cutting Edge CSS3 @ WebExpo Tour 2010Cutting Edge CSS3 @ WebExpo Tour 2010
Cutting Edge CSS3 @ WebExpo Tour 2010
 
Browser War 2: Standards strikes back
Browser War 2: Standards strikes backBrowser War 2: Standards strikes back
Browser War 2: Standards strikes back
 

Recently uploaded

What's New in Teams Calling, Meetings and Devices March 2024
What's New in Teams Calling, Meetings and Devices March 2024What's New in Teams Calling, Meetings and Devices March 2024
What's New in Teams Calling, Meetings and Devices March 2024Stephanie Beckett
 
DevEX - reference for building teams, processes, and platforms
DevEX - reference for building teams, processes, and platformsDevEX - reference for building teams, processes, and platforms
DevEX - reference for building teams, processes, and platformsSergiu Bodiu
 
Story boards and shot lists for my a level piece
Story boards and shot lists for my a level pieceStory boards and shot lists for my a level piece
Story boards and shot lists for my a level piececharlottematthew16
 
"LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks...
"LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks..."LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks...
"LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks...Fwdays
 
Search Engine Optimization SEO PDF for 2024.pdf
Search Engine Optimization SEO PDF for 2024.pdfSearch Engine Optimization SEO PDF for 2024.pdf
Search Engine Optimization SEO PDF for 2024.pdfRankYa
 
Vertex AI Gemini Prompt Engineering Tips
Vertex AI Gemini Prompt Engineering TipsVertex AI Gemini Prompt Engineering Tips
Vertex AI Gemini Prompt Engineering TipsMiki Katsuragi
 
Scanning the Internet for External Cloud Exposures via SSL Certs
Scanning the Internet for External Cloud Exposures via SSL CertsScanning the Internet for External Cloud Exposures via SSL Certs
Scanning the Internet for External Cloud Exposures via SSL CertsRizwan Syed
 
TrustArc Webinar - How to Build Consumer Trust Through Data Privacy
TrustArc Webinar - How to Build Consumer Trust Through Data PrivacyTrustArc Webinar - How to Build Consumer Trust Through Data Privacy
TrustArc Webinar - How to Build Consumer Trust Through Data PrivacyTrustArc
 
Commit 2024 - Secret Management made easy
Commit 2024 - Secret Management made easyCommit 2024 - Secret Management made easy
Commit 2024 - Secret Management made easyAlfredo García Lavilla
 
Developer Data Modeling Mistakes: From Postgres to NoSQL
Developer Data Modeling Mistakes: From Postgres to NoSQLDeveloper Data Modeling Mistakes: From Postgres to NoSQL
Developer Data Modeling Mistakes: From Postgres to NoSQLScyllaDB
 
How AI, OpenAI, and ChatGPT impact business and software.
How AI, OpenAI, and ChatGPT impact business and software.How AI, OpenAI, and ChatGPT impact business and software.
How AI, OpenAI, and ChatGPT impact business and software.Curtis Poe
 
Nell’iperspazio con Rocket: il Framework Web di Rust!
Nell’iperspazio con Rocket: il Framework Web di Rust!Nell’iperspazio con Rocket: il Framework Web di Rust!
Nell’iperspazio con Rocket: il Framework Web di Rust!Commit University
 
CloudStudio User manual (basic edition):
CloudStudio User manual (basic edition):CloudStudio User manual (basic edition):
CloudStudio User manual (basic edition):comworks
 
WordPress Websites for Engineers: Elevate Your Brand
WordPress Websites for Engineers: Elevate Your BrandWordPress Websites for Engineers: Elevate Your Brand
WordPress Websites for Engineers: Elevate Your Brandgvaughan
 
"Subclassing and Composition – A Pythonic Tour of Trade-Offs", Hynek Schlawack
"Subclassing and Composition – A Pythonic Tour of Trade-Offs", Hynek Schlawack"Subclassing and Composition – A Pythonic Tour of Trade-Offs", Hynek Schlawack
"Subclassing and Composition – A Pythonic Tour of Trade-Offs", Hynek SchlawackFwdays
 
Designing IA for AI - Information Architecture Conference 2024
Designing IA for AI - Information Architecture Conference 2024Designing IA for AI - Information Architecture Conference 2024
Designing IA for AI - Information Architecture Conference 2024Enterprise Knowledge
 
Hyperautomation and AI/ML: A Strategy for Digital Transformation Success.pdf
Hyperautomation and AI/ML: A Strategy for Digital Transformation Success.pdfHyperautomation and AI/ML: A Strategy for Digital Transformation Success.pdf
Hyperautomation and AI/ML: A Strategy for Digital Transformation Success.pdfPrecisely
 
"Debugging python applications inside k8s environment", Andrii Soldatenko
"Debugging python applications inside k8s environment", Andrii Soldatenko"Debugging python applications inside k8s environment", Andrii Soldatenko
"Debugging python applications inside k8s environment", Andrii SoldatenkoFwdays
 
How to write a Business Continuity Plan
How to write a Business Continuity PlanHow to write a Business Continuity Plan
How to write a Business Continuity PlanDatabarracks
 
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024BookNet Canada
 

Recently uploaded (20)

What's New in Teams Calling, Meetings and Devices March 2024
What's New in Teams Calling, Meetings and Devices March 2024What's New in Teams Calling, Meetings and Devices March 2024
What's New in Teams Calling, Meetings and Devices March 2024
 
DevEX - reference for building teams, processes, and platforms
DevEX - reference for building teams, processes, and platformsDevEX - reference for building teams, processes, and platforms
DevEX - reference for building teams, processes, and platforms
 
Story boards and shot lists for my a level piece
Story boards and shot lists for my a level pieceStory boards and shot lists for my a level piece
Story boards and shot lists for my a level piece
 
"LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks...
"LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks..."LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks...
"LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks...
 
Search Engine Optimization SEO PDF for 2024.pdf
Search Engine Optimization SEO PDF for 2024.pdfSearch Engine Optimization SEO PDF for 2024.pdf
Search Engine Optimization SEO PDF for 2024.pdf
 
Vertex AI Gemini Prompt Engineering Tips
Vertex AI Gemini Prompt Engineering TipsVertex AI Gemini Prompt Engineering Tips
Vertex AI Gemini Prompt Engineering Tips
 
Scanning the Internet for External Cloud Exposures via SSL Certs
Scanning the Internet for External Cloud Exposures via SSL CertsScanning the Internet for External Cloud Exposures via SSL Certs
Scanning the Internet for External Cloud Exposures via SSL Certs
 
TrustArc Webinar - How to Build Consumer Trust Through Data Privacy
TrustArc Webinar - How to Build Consumer Trust Through Data PrivacyTrustArc Webinar - How to Build Consumer Trust Through Data Privacy
TrustArc Webinar - How to Build Consumer Trust Through Data Privacy
 
Commit 2024 - Secret Management made easy
Commit 2024 - Secret Management made easyCommit 2024 - Secret Management made easy
Commit 2024 - Secret Management made easy
 
Developer Data Modeling Mistakes: From Postgres to NoSQL
Developer Data Modeling Mistakes: From Postgres to NoSQLDeveloper Data Modeling Mistakes: From Postgres to NoSQL
Developer Data Modeling Mistakes: From Postgres to NoSQL
 
How AI, OpenAI, and ChatGPT impact business and software.
How AI, OpenAI, and ChatGPT impact business and software.How AI, OpenAI, and ChatGPT impact business and software.
How AI, OpenAI, and ChatGPT impact business and software.
 
Nell’iperspazio con Rocket: il Framework Web di Rust!
Nell’iperspazio con Rocket: il Framework Web di Rust!Nell’iperspazio con Rocket: il Framework Web di Rust!
Nell’iperspazio con Rocket: il Framework Web di Rust!
 
CloudStudio User manual (basic edition):
CloudStudio User manual (basic edition):CloudStudio User manual (basic edition):
CloudStudio User manual (basic edition):
 
WordPress Websites for Engineers: Elevate Your Brand
WordPress Websites for Engineers: Elevate Your BrandWordPress Websites for Engineers: Elevate Your Brand
WordPress Websites for Engineers: Elevate Your Brand
 
"Subclassing and Composition – A Pythonic Tour of Trade-Offs", Hynek Schlawack
"Subclassing and Composition – A Pythonic Tour of Trade-Offs", Hynek Schlawack"Subclassing and Composition – A Pythonic Tour of Trade-Offs", Hynek Schlawack
"Subclassing and Composition – A Pythonic Tour of Trade-Offs", Hynek Schlawack
 
Designing IA for AI - Information Architecture Conference 2024
Designing IA for AI - Information Architecture Conference 2024Designing IA for AI - Information Architecture Conference 2024
Designing IA for AI - Information Architecture Conference 2024
 
Hyperautomation and AI/ML: A Strategy for Digital Transformation Success.pdf
Hyperautomation and AI/ML: A Strategy for Digital Transformation Success.pdfHyperautomation and AI/ML: A Strategy for Digital Transformation Success.pdf
Hyperautomation and AI/ML: A Strategy for Digital Transformation Success.pdf
 
"Debugging python applications inside k8s environment", Andrii Soldatenko
"Debugging python applications inside k8s environment", Andrii Soldatenko"Debugging python applications inside k8s environment", Andrii Soldatenko
"Debugging python applications inside k8s environment", Andrii Soldatenko
 
How to write a Business Continuity Plan
How to write a Business Continuity PlanHow to write a Business Continuity Plan
How to write a Business Continuity Plan
 
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
 

Standards Talk - Opera Uni Tour Indonesia

  • 1. Web Standar by Zibin Cheah University Tour 2009 Tuesday, December 8, 2009
  • 10. Tim Berner Lee In1989, this guy named his baby WWW Tuesday, December 8, 2009
  • 11. OpenWeb stack [OGG/ VMS/Dirac]? Widgets Audio & Video SMIL Media Sycronise- SVG PNG/JPG/GIF <canvas> ation Vector Graphics Raster Graphics Drawing API Behaviour DOM ECMA/JavaScript Document API Scripting Presentation CSS Style sheets Structure XML XHTML/HTML RDFa ARIA Markup Semantics Accessibility Tuesday, December 8, 2009
  • 12. OpenWeb stack [OGG/ VMS/Dirac]? Widgets Audio & Video SMIL Media Sycronise- SVG PNG/JPG/GIF <canvas> ation Vector Graphics Raster Graphics Drawing API Behaviour DOM ECMA/JavaScript Document API Scripting Presentation CSS Style sheets Structure XML HTML 5/XHTML RDFa ARIA Markup Semantics Accessibility Tuesday, December 8, 2009
  • 13. OpenWeb stack [OGG/ VMS/Dirac]? Widgets Audio & Video SMIL Media Sycronise- SVG PNG/JPG/GIF <canvas> ation Vector Graphics Raster Graphics Drawing API Behaviour DOM ECMA/JavaScript Document API Scripting Presentation CSS Style sheets Structure XML HTML 5/XHTML RDFa ARIA Markup Semantics Accessibility + Opera Unite & Opera Turbo Tuesday, December 8, 2009
  • 14. Browser Platform Device Tuesday, December 8, 2009
  • 15. Exciting Graphics ! Boring Graphics...... SV G Tuesday, December 8, 2009
  • 19. Industry leading SVG support SVG 1.1 support (%) Opera 10 93.89 Safari 4 81.93 Firefox 3.5 60.40 IE 8 0 25 50 75 100 Source: http://www.codedread.com/svg-support.php Tuesday, December 8, 2009
  • 20. Exciting applications ! W idg Boring ets Application...... Tuesday, December 8, 2009
  • 22. W3C Standards Browser Independent Runs on phone, TV, desktop Tuesday, December 8, 2009
  • 23. More Example ! Tuesday, December 8, 2009
  • 24. Opera Turbo X-Forwarded-For HTTP Header Tuesday, December 8, 2009
  • 26. Let’s watch a movie ! Tuesday, December 8, 2009
  • 27. Local Storage Opera Unite unite.opera.com Tuesday, December 8, 2009
  • 32. Tab browsing, speed dial, touch / keypad, save password Tuesday, December 8, 2009
  • 33. tusen takk, terima kasih! More Info dev.opera.com my.opera.com/odin zibin@opera.com twitter: zibin zibin.tehais.com Tuesday, December 8, 2009
  • 34. Creative Commons license image Phone booth http://www.flickr.com/photos/rickharris/261846074/ Speedometer: http://www.flickr.com/photos/adc/391594014/ Danish sockets: http://www.flickr.com/photos/xoxoryan/3767746478/ People Globe http://www.flickr.com/photos/linhngan/2645589939/ Norwegian mountains Baby face http://www.flickr.com/photos/hypertypos/ Baby face 2 http://www.flickr.com/photos/dq090702/ World map http://www.flickr.com/photos/kahtava/ Other Slides/images HTML5 scientist by Bruce Lawson Closed and Open platform by David Storey ACID3 test snapshot by David Storey Opera Unite globe by Oleg Melnychuk Slides design and contents by Zibin Cheah Tuesday, December 8, 2009
  • 35. Opera 10 Safari 4 Firefox 3.5 Internet Explorer 8 Tuesday, December 8, 2009

Editor's Notes

  1. Opera 2 sessions &amp;#x628A;&amp;#x591A;&amp;#x6807;&amp;#x7B7E;&amp;#x540C;&amp;#x65F6;&amp;#x50A8;&amp;#x5B58;&amp;#x8D77;&amp;#x6765;&amp;#xFF0C;&amp;#x4E0B;&amp;#x6B21;&amp;#x6253;&amp;#x5F00; - firefox copied &amp;#x7F29;&amp;#x653E; zoom - full page scalling Opera 4 (2000) &amp;#x5220;&amp;#x9664;&amp;#x79C1;&amp;#x4EBA;&amp;#x8D44;&amp;#x6599;&amp;#xFF0F;&amp;#x6D4F;&amp;#x89C8;&amp;#x5386;&amp;#x53F2;(history, cookies) copied by firefox, IE Opera 5(2001) integrated web search, tabs
  2. email client &amp;#x90AE;&amp;#x7BB1;&amp;#x5BA2;&amp;#x6237;&amp;#x7AEF; speedi dial &amp;#x5FEB;&amp;#x901F;&amp;#x64AD;&amp;#x53F7; mouse gesture &amp;#x9F20;&amp;#x6807;&amp;#x624B;&amp;#x52BF;
  3. &amp;#x6211;&amp;#x60F3;&amp;#x5E26;&amp;#x5927;&amp;#x5BB6;&amp;#x56DE;&amp;#x5230;&amp;#x5F53;&amp;#x521D;&amp;#xFF0C;&amp;#x6700;&amp;#x521D;&amp;#x7684;web&amp;#x53D1;&amp;#x5C55;&amp;#x3002; &amp;#x5F88;&amp;#x591A;&amp;#x4EBA;&amp;#x90FD;&amp;#x8BF4;tim bernes lee &amp;#x53D1;&amp;#x660E;&amp;#x4E86;&amp;#x4E92;&amp;#x8054;&amp;#x7F51;&amp;#xFF08;specify the protocol and hyperlink&amp;#xFF09; how do u say &amp;#x2018;protocol&amp;#x2019; in chinese? &amp;#x90A3;&amp;#x4E3A;&amp;#x4EC0;&amp;#x4E48;&amp;#x6211;&amp;#x8981;&amp;#x8C08;&amp;#x6D4F;&amp;#x89C8;&amp;#x5668;&amp;#x5927;&amp;#x6218;&amp;#x5462;&amp;#xFF1F;&amp;#x56E0;&amp;#x4E3A;&amp;#x9664;&amp;#x4E86;IE&amp;#x628A;&amp;#x7F51;&amp;#x666F;&amp;#x5E72;&amp;#x6389;&amp;#x4EE5;&amp;#x5916;&amp;#xFF0C;
  4. &amp;#x638C;&amp;#x63E1;&amp;#x8FD9;&amp;#x4E9B;&amp;#x6280;&amp;#x672F;&amp;#xFF0C;&amp;#x7406;&amp;#x89E3;&amp;#x8FD9;&amp;#x4E9B;&amp;#x6280;&amp;#x672F;&amp;#x4EE5;&amp;#x4E3A;&amp;#x7740;&amp;#x4E0B;&amp;#x4E00;&amp;#x4EE3;&amp;#x524D;&amp;#x7AEF;web&amp;#x7684;&amp;#x8FDB;&amp;#x5C55; &amp;#x628A;&amp;#x6280;&amp;#x672F;&amp;#x8FDB;&amp;#x5165;&amp;#x6807;&amp;#x51C6;&amp;#x5316;&amp;#x8FC7;&amp;#x7A0B;
  5. &amp;#x638C;&amp;#x63E1;&amp;#x8FD9;&amp;#x4E9B;&amp;#x6280;&amp;#x672F;&amp;#xFF0C;&amp;#x7406;&amp;#x89E3;&amp;#x8FD9;&amp;#x4E9B;&amp;#x6280;&amp;#x672F;&amp;#x4EE5;&amp;#x4E3A;&amp;#x7740;&amp;#x4E0B;&amp;#x4E00;&amp;#x4EE3;&amp;#x524D;&amp;#x7AEF;web&amp;#x7684;&amp;#x8FDB;&amp;#x5C55; &amp;#x628A;&amp;#x6280;&amp;#x672F;&amp;#x8FDB;&amp;#x5165;&amp;#x6807;&amp;#x51C6;&amp;#x5316;&amp;#x8FC7;&amp;#x7A0B;
  6. &amp;#x638C;&amp;#x63E1;&amp;#x8FD9;&amp;#x4E9B;&amp;#x6280;&amp;#x672F;&amp;#xFF0C;&amp;#x7406;&amp;#x89E3;&amp;#x8FD9;&amp;#x4E9B;&amp;#x6280;&amp;#x672F;&amp;#x4EE5;&amp;#x4E3A;&amp;#x7740;&amp;#x4E0B;&amp;#x4E00;&amp;#x4EE3;&amp;#x524D;&amp;#x7AEF;web&amp;#x7684;&amp;#x8FDB;&amp;#x5C55; &amp;#x628A;&amp;#x6280;&amp;#x672F;&amp;#x8FDB;&amp;#x5165;&amp;#x6807;&amp;#x51C6;&amp;#x5316;&amp;#x8FC7;&amp;#x7A0B;
  7. web2.0&amp;#x5BF9;&amp;#x4E0D;&amp;#x540C;&amp;#x4EBA;&amp;#x6765;&amp;#x8BF4;&amp;#x6709;&amp;#x7740;&amp;#x4E0D;&amp;#x540C;&amp;#x7684;&amp;#x610F;&amp;#x4E49; - &amp;#x5BF9;&amp;#x4E00;&amp;#x4E9B;&amp;#x4EBA;&amp;#x6765;&amp;#x8BF4;&amp;#xFF0C;&amp;#x4ED6;&amp;#x662F;&amp;#x53D1;&amp;#x8D22;&amp;#x7684;&amp;#x7BA1;&amp;#x9053; &amp;#xFF0D;&amp;#x5BF9;&amp;#x4E00;&amp;#x4E9B;&amp;#x4EBA;&amp;#x6765;&amp;#x8BF4;&amp;#x5B83;&amp;#x6709;&amp;#x5F88;&amp;#x591A;&amp;#x65B0;&amp;#x7684;idea &amp;#x5728;&amp;#x8FD9;&amp;#x4E4B;&amp;#x524D;&amp;#x5E76;&amp;#x6CA1;&amp;#x6709;web1.0&amp;#x7684;&amp;#x6982;&amp;#x5FF5;
  8. good for phones good for search engines good for compression svgz All major modern web browsers except Microsoft Internet Explorer support and render SVG markup directly.[3] To view SVG files in Internet Explorer, either users have to download and install a browser plugin, or the webmaster can include SVG Web, a JavaScript library currently under development at Google Code.[4] SVG is also well-suited to small and mobile devices. The SVG Basic and SVG Tiny specifications were developed with just such uses in mind and many current mobile devices support them.
  9. web2.0&amp;#x5BF9;&amp;#x4E0D;&amp;#x540C;&amp;#x4EBA;&amp;#x6765;&amp;#x8BF4;&amp;#x6709;&amp;#x7740;&amp;#x4E0D;&amp;#x540C;&amp;#x7684;&amp;#x610F;&amp;#x4E49; - &amp;#x5BF9;&amp;#x4E00;&amp;#x4E9B;&amp;#x4EBA;&amp;#x6765;&amp;#x8BF4;&amp;#xFF0C;&amp;#x4ED6;&amp;#x662F;&amp;#x53D1;&amp;#x8D22;&amp;#x7684;&amp;#x7BA1;&amp;#x9053; &amp;#xFF0D;&amp;#x5BF9;&amp;#x4E00;&amp;#x4E9B;&amp;#x4EBA;&amp;#x6765;&amp;#x8BF4;&amp;#x5B83;&amp;#x6709;&amp;#x5F88;&amp;#x591A;&amp;#x65B0;&amp;#x7684;idea &amp;#x5728;&amp;#x8FD9;&amp;#x4E4B;&amp;#x524D;&amp;#x5E76;&amp;#x6CA1;&amp;#x6709;web1.0&amp;#x7684;&amp;#x6982;&amp;#x5FF5;
  10. built with standards, first to use W3C recommendation independent from browser run on different platform such as phones, TV, desktop
  11. Video........