Web

      HTML5   SVG
HTML5
HTML5

• HTML   10
HTML5

• HTML    10

• Apple   Google
HTML5

• HTML 10
• Apple Google
• HTML5 Web
HTML5

• HTML 10
• Apple Google
• HTML5 Web

• XHTML          RSS/Atom Ajax
             Web XML
SVG
SVG
•   Scalable Vector Graphics W3C   2D
                       2001
SVG
•   Scalable Vector Graphics W3C   2D
                       2001

•           Adobe SVG
SVG
•   Scalable Vector Graphics W3C     2D
                       2001

•           Adobe SVG

•         Web
            Opera   Safari Firefox
SVG
•   Scalable Vector Graphics W3C          2D
                       2001

•           Adobe SVG

•         Web
            Opera   Safari Firefox

•   7                         2008   12
                    SVG Tiny 1.2
• HTML5
• HTML5
• HTML5   SVG   Web
• HTML5
• HTML5     SVG           Web



•                 2D/3D
    HTML5   SVG
HTML5   XML
HTML5          XML

• HTML5            HTML   XML
          XHTML
HTML5          XML

• HTML5            HTML   XML
          XHTML

• HTML      DOCTYPE
     SGML
HTML5          XML

• HTML5            HTML   XML
          XHTML

• HTML      DOCTYPE
     SGML

• XHTML      XHTML
HTML5          XML

• HTML5            HTML   XML
          XHTML

• HTML      DOCTYPE
     SGML

• XHTML      XHTML

•
Web Storage
Web Storage
• Web Storage   Web   2
Web Storage
• Web Storage   Web   2



•
      Storage
Web Storage
• Web Storage     Web        2



•
        Storage

• SQL                   Database
Web Storage
• Web Storage   Web        2



•
      Storage

• SQL                 Database

• Database
Web Socket
Web Socket
• Web Socket
Web Socket
• Web Socket

• Google Wave
Web Socket
• Web Socket

• Google Wave

•               Internet Draft
Web Socket
• Web Socket

• Google Wave

•               Internet Draft

• HTTP                  Web
Web Workers
Web Workers
•   Web Workers
Web Workers
•   Web Workers



•   JavaScript Worker
Web Workers
•    Web Workers



•    JavaScript Worker


//
var worker = new Worker('worker.js');
worker.onmessage = function(event) {
   document.getElementById('data').textContent = event.data;
};

// worker.js -
postMessage(data);
HTML   SVG
HTML         SVG
•   HTML   SVG
HTML          SVG
•   HTML    SVG



•   HTML5   Web
HTML             SVG
•   HTML    SVG



•   HTML5    Web



•   SVG 1.2 HTML5
           API
HTML             SVG
•   HTML    SVG



•   HTML5    Web



•   SVG 1.2 HTML5
           API

•   Chrome OS WebOS
• HTML5    SVG 1.2   audio
   video
• HTML5     SVG 1.2   audio
    video

•
• HTML5     SVG 1.2   audio
    video

•

• HTML5     SVG 1.2
• HTML5        SVG 1.2    audio
      video

•

• HTML5        SVG 1.2

• Theora       H.264     W3C Video
    Activity
2D
2D

• HTML5            2D
          canvas
2D

• HTML5             2D
           canvas

•
     SVG
2D

• HTML5                 2D
               canvas

•
      SVG

• Canvas API   HTML5          SVG
                        API
3D
3D

• SVG   3D Transforms   3D
3D

• SVG   3D Transforms         3D



• HTML5      CSS Transforms
3D

• SVG   3D Transforms           3D



• HTML5        CSS Transforms



• Canvas API   3D
  WebGL Khronos Group
Widgets
Widgets
• Widgets   Mac OS X   Web
Widgets
• Widgets   Mac OS X        Web



•                      TV
Widgets
• Widgets   Mac OS X            Web



•                      TV

•           W3C Widgets     HTML5   SVG
Widgets
• Widgets   Mac OS X            Web



•                      TV

•           W3C Widgets     HTML5   SVG



•       Web
    Widgets

WebアプリプラットフォームとしてのHTML5とSVG