Your SlideShare is downloading. ×
The State of Web Development
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

The State of Web Development

2,545

Published on

2010.05.14 Tomorrow`s web today のスライド …

2010.05.14 Tomorrow`s web today のスライド
こちらは、詳細データはありません。

URL
http://www.webdirections.org/sotw10/

Published in: Technology
0 Comments
3 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
2,545
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
19
Comments
0
Likes
3
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide




  • State of Web Development は Opera mama のように、Web業界でなにがおこっているのかの全体像をつかみ、その使われているテクノロジー、技術、そして使っているツールなどを調べるために Web Directions のおこなっています。
  • State of Web Development は Opera mama のように、Web業界でなにがおこっているのかの全体像をつかみ、その使われているテクノロジー、技術、そして使っているツールなどを調べるために Web Directions のおこなっています。
  • State of Web Development は Opera mama のように、Web業界でなにがおこっているのかの全体像をつかみ、その使われているテクノロジー、技術、そして使っているツールなどを調べるために Web Directions のおこなっています。
  • 対象へのアプローチは、過去にWeb Directions のカンファレンスに参加された人へメール配信や、開発者のブログやウェブサイトへリンクを貼るなどして、調査に参加してもらいました。
  • 対象へのアプローチは、過去にWeb Directions のカンファレンスに参加された人へメール配信や、開発者のブログやウェブサイトへリンクを貼るなどして、調査に参加してもらいました。
  • この調査は今までに2回おこなわれて、1回目は2008年は12月におこない、2回目はそれから13ヶ月たった2010年1月におこないました。









  • いくつかのキーワードを抜き出しました。
  • いくつかのキーワードを抜き出しました。




  • いくつかのキーワードを抜き出しました。
  • いくつかのキーワードを抜き出しました。






  • いくつかのキーワードを抜き出しました。
  • いくつかのキーワードを抜き出しました。





























  • 最後にFlash の話題がでましたので、CANVAS と SVGの話をおみせしたいと思います。







































  • Transcript

    • 1. The State of Web Development Tomorrow’s Web Today Takashi Kikuchi 2010.05.14 Roppongi hills Tomorrow’s Web Today
    • 2. The State Of Web Development Tomorrow’s Web Today
    • 3. The State Of Web Development Tomorrow’s Web Today
    • 4. MAMA http://dev.opera.com/articles/view/mama/ Tomorrow’s Web Today
    • 5. Web
    • 6. Web
    • 7. Web
    • 8. 2008 2010 2011 12 1 12
    • 9. 2008 2010 2011 12 1 12 13
    • 10. 1400
    • 11. 6 1400
    • 12. slideshare “mantangs” http://www.slideshare.net/mantangs/ state-of-web-development
    • 13. 2008
    • 14. 2008 →
    • 15. 2008 →
    • 16. 2008 → Javascript
    • 17. 2008 → Javascript Web
    • 18. 2010
    • 19. Mac OS CSS3 Webkit Webfonts HTML5 jQuery
    • 20. Mac OS
    • 21. Mac OS
    • 22. OS Mac OS X Windows 2008 46% 47% Mac OS X Windows 2010 52% 41% 0 50 100
    • 23. OS Mac OS X Windows 2008 46% 47% Mac OS X Windows 2010 52% 41% 0 50 100
    • 24. iPhone
    • 25. iPhone CSS3 animation ?
    • 26. Mac OS CSS3 Webkit Webfonts HTML5 jQuery
    • 27. Webkit
    • 28. Webkit
    • 29. 2008 25% Webkit
    • 30. 2008 25% Webkit
    • 31. 2008 2010 25% 47% Webkit
    • 32. 2010 Webkit
    • 33. 2010 x2 Webkit
    • 34. 1,Web 2, 3,
    • 35. Mac OS CSS3 Webkit Webfonts HTML5 jQuery
    • 36. HTML5
    • 37. HTML5
    • 38. 2008 1.3% HTML5 Doctype
    • 39. 2008 1.3% HTML5 Doctype
    • 40. 2008 2010 1.3% 12.6% HTML5 Doctype
    • 41. 2010 HTML5 Doctype
    • 42. 2010 x10 HTML5 Doctype
    • 43. Mac OS CSS3 Webkit Webfonts HTML5 jQuery
    • 44. CSS3
    • 45. CSS3
    • 46. 2008 45% CSS3
    • 47. 2008 45% CSS3
    • 48. 2008 2010 45% 68% CSS3
    • 49. 2010 CSS3
    • 50. 2010 70% CSS3
    • 51. Mac OS CSS3 Webkit Webfonts HTML5 jQuery
    • 52. Webfonts
    • 53. Webfonts
    • 54. 2008 4% Webfont
    • 55. 2008 4% Webfont
    • 56. 2008 2010 4% 23% Webfont
    • 57. 2010 Webfont
    • 58. 2010 4 1 Webfont
    • 59. Mac OS CSS3 Webkit Webfonts HTML5 jQuery
    • 60. Mac OS CSS3 Webkit Webfonts HTML5 jQuery
    • 61. Mac OS CSS3 Webkit jQuery Webfonts HTML5
    • 62. 2008 63% jQuery
    • 63. 2008 63% jQuery
    • 64. 2008 2010 63% 80% jQuery
    • 65. 2010 jQuery
    • 66. 2010 80% jQuery
    • 67. 2010
    • 68. 2010 HTML5 & CSS3
    • 69. 2010 HTML5 & CSS3 Web
    • 70. 2010 HTML5 & CSS3 Web
    • 71. 2010 HTML5 & CSS3 Web javascript
    • 72. The State Of Web Development Tomorrow’s Web Today
    • 73. Thanks Opera It`s Fridays
    • 74. Thanks Opera It`s Fridays
    • 75. CANVAS & SVG
    • 76. CANVAS & SVG
    • 77. SVG <?xml version="1.0" encoding="utf-8"?> <!DOCTYPE svg PUBLIC "-//W3C// DTD SVG 1.1//EN" "http://www.w3.org/ Graphics/SVG/1.1/DTD/svg11.dtd"> <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <rect fill="#333" width="426" height="260.667"/> <ellipse cx="213" cy="130" rx="205" ry="117"> </svg> <animate <animate attributeName="fill" attributeType="CSS" begin="0s" dur="6s" fill="freeze" from="#000" to="#f00"/> attributeName="rx" begin="0s" dur="6s" fill="freeze" from="205" to="117"/> </ellipse> <path fill="none" stroke="#fff" stroke-width="5"
    • 78. Canvas <canvas></canvas> window.onload = function () { var elem = document.createElement("canvas"); elem.width = 500; elem.height = 500; document.body.appendChild( elem ); var context = elem.getContext("2d"); context.fillRect(0, 0, elem.width, elem.height); var pos = 0, dir = 1; setInterval(function () { context.rotate( 15 ); context.fillStyle = "rgba(0,0,0,0.05)"; context.fillRect(0, 0, elem.width, elem.height); context.fillStyle = "rgba(255, 0, 0, 1)"; context.fillRect(pos, pos, 20, 20); pos += dir; if ( pos > elem.width ) { dir = -1; } else if ( pos + 20 < 0 ) { dir = 1; } }, 10);
    • 79. Canvas SVG http://www.slideshare.net/Dmitry.Baranovskiy/web-vector-graphics-presentation
    • 80. Canvas SVG http://www.slideshare.net/Dmitry.Baranovskiy/web-vector-graphics-presentation
    • 81. Canvas SVG http://www.slideshare.net/Dmitry.Baranovskiy/web-vector-graphics-presentation
    • 82. Canvas
    • 83. Canvas
    • 84. Canvas HTML
    • 85. Canvas JavaScript HTML
    • 86. Canvas JavaScript HTML
    • 87. SVG
    • 88. SVG XML
    • 89. SVG XML HTML
    • 90. SVG XML HTML iphone to 40”
    • 91. SVG XML HTML iphone to 40”
    • 92. SVG XML HTML iphone to 40” SEO
    • 93. SVG XML HTML iphone to 40” SEO DOM
    • 94. Test
    • 95. Canvas 788 http://philip.html5.org/tests/canvas/suite/tests/results.html 2 22
    • 96. SVG 280 http://www.codedread.com/svg-support.php 5 6
    • 97. Canvas + SVG 2
    • 98. 77%
    • 99. 81%
    • 100. SVG
    • 101. 31% SVG
    • 102. 87%
    • 103. 87% No.1
    • 104. Canvas
    • 105. BA Enter
    • 106. Canvas Game
    • 107. SVG
    • 108. Video
    • 109. SVG Map in the real world !!
    • 110. Nissan
    • 111. Raphael.js
    • 112. Pie Chart
    • 113. Work in Progress
    • 114. Song http://svg-wow.org/
    • 115. flickr & other resources http://www.flickr.com/photos/65819195@N00/4561033659/sizes/o/ http://www.slideshare.net/Dmitry.Baranovskiy/web-vector-graphics-presentation http://philip.html5.org/tests/canvas/suite/tests/results.html http://www.codedread.com/svg-support.php
    • 116. Thank you !! mail mantangs@gmail.com twitter mantangs

    ×