Attractive HTML5 HTML5の魅力をこっそりと      @shoito     HTML5-FIT
自己紹介/shoito
宮城 → 福井 [3.5y]
ソフトウェア設計ツールの開発
Flex(Flash)アプリ開発 [3y]
技術系コミュニティ
HTML5に興味を持った訳
ITシステムの変遷高               C/S          RIAユーザビリティ              1990年代初頭∼   2003年後半∼            メインフレーム        Web          ...
HTML5とワタシ
Hokuriku.lang - HTML5      2009/10
HTML5 Tech Talk in 金沢     2009/10
HTML5勉強会@めがね会館   2010/03/12
WCAF Seminar Vol.3 - HTML5      2010/03/20
Chrome Extensions with HTML5作ろう会         2010/04/12
Google Hackathon for Chrome Extension          2010/04/17, 24
今日の目的HTML5の魅力を✤ 皆さんに共有すること✤ 皆さんから共有してもらうこと
まずはご覧ください
9elements.com
Sketchpad
HTML5 presentation
Mozilla Bespin
HTML5 QUEST
chrome://newtab
私が感じる魅力
標準技術HTML, CSS, JavaScript
標準技術HTML, CSS, JavaScript
デザイナ                                1                                       ー                                       3     ...
Browser is a PlatformWebアプリケーションの制約からの解放
No Plug-inFlash player, Silverlight plug-in, JavaFX runtime
Cross-PlatformWindows, Mac OS X, Linux, Chrome OS
Multi-devicePC, Mac, Mobile, .....
余談
叶わなかった願い - FlashiPhone OSへのFlash Playerの搭載
iAdiPhone/iPad向け、モバイル広告 ­ 広告はHTML5で作る
非Andoide Mobile AP-PFの共同開発ブラウザのHTML5対応はどうなる?
Server-Side lessオフライン、ローカルストレージ、Drag&Drop、File API、WebWorker
Web/Desktopの低い垣根Drag&Drop/File API、ネイティブアプリケーションとしてラッピング
<header>                                 <section>                                 <header>          <nav>                ...
HTML5 is Simple!doctype, meta, script, link 省略...<!doctype html><meta charset= utf-8 ><script src= xxx.js ></script><link ...
段階的変化の許容HTML4/XHTMLからHTML5へ - 前方/後方互換性の維持(革新より発展)
N                     ew                       !常に最新のソフトウェアを使えるWebアプリケーションの特性
低コストな開発/実行環境デバッグ、プロファイラなどがブラウザに組み込める/まれている
私のイチバン
デザイナ                                1                                       ー                                       3     ...
皆さんが感じたHTML5の魅力って?時間がなかったら懇親会で話しましょう
HTML5対応チェック
When can I use...
HTML5 Demos and Examples
Modernizr
巷のFlash悲観論FlashってFlash Playerのこと?      Flash CSのこと?
HTML5とFlashの共存   ExternalInterfaceを利用した  JavaScript   ActionScript連携
HTML5 / Flash 比較          HTML5                 Flash 公平性      ○    (標準技術)               (Adobe独占) 互換性          (ブラウザ依存)  ...
HTML5に関してコメント
HTML5,いつから使えるの?
もう, 使える機能から部分的に
iPhone/Android       &IE以外のブラウザでは   既に結構イケる
HTML5はデザイナ/開発者にとって魅力的
次期Web標準技術なので   無視できない
これまでのWebの制約が変わります
提案
別に作りたいサイトやWebアプリはないという方
Chrome Extensionsで便利なツールを作っては?
Thanks!    shoito    sho.ito@air-life.net    http://twitter.com/shoito    HTML5-FIT
Attractive HTML5
Attractive HTML5
Upcoming SlideShare
Loading in...5
×

Attractive HTML5

1,850

Published on

HTML5について私が感じる魅力を語る
2010/04/29

Published in: Technology
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
1,850
On Slideshare
0
From Embeds
0
Number of Embeds
3
Actions
Shares
0
Downloads
13
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Attractive HTML5

  1. 1. Attractive HTML5 HTML5の魅力をこっそりと @shoito HTML5-FIT
  2. 2. 自己紹介/shoito
  3. 3. 宮城 → 福井 [3.5y]
  4. 4. ソフトウェア設計ツールの開発
  5. 5. Flex(Flash)アプリ開発 [3y]
  6. 6. 技術系コミュニティ
  7. 7. HTML5に興味を持った訳
  8. 8. ITシステムの変遷高 C/S RIAユーザビリティ   1990年代初頭∼ 2003年後半∼  メインフレーム Web 1990年代中頃∼   /ダム端末 ∼1980年代頃低 コストパフォーマンス 高 参考文献:RIAシステム構築ガイド Essential 2007 p005
  9. 9. HTML5とワタシ
  10. 10. Hokuriku.lang - HTML5 2009/10
  11. 11. HTML5 Tech Talk in 金沢 2009/10
  12. 12. HTML5勉強会@めがね会館 2010/03/12
  13. 13. WCAF Seminar Vol.3 - HTML5 2010/03/20
  14. 14. Chrome Extensions with HTML5作ろう会 2010/04/12
  15. 15. Google Hackathon for Chrome Extension 2010/04/17, 24
  16. 16. 今日の目的HTML5の魅力を✤ 皆さんに共有すること✤ 皆さんから共有してもらうこと
  17. 17. まずはご覧ください
  18. 18. 9elements.com
  19. 19. Sketchpad
  20. 20. HTML5 presentation
  21. 21. Mozilla Bespin
  22. 22. HTML5 QUEST
  23. 23. chrome://newtab
  24. 24. 私が感じる魅力
  25. 25. 標準技術HTML, CSS, JavaScript
  26. 26. 標準技術HTML, CSS, JavaScript
  27. 27. デザイナ 1 ー 3 JavaScript CSS HTML 各種APIの拡張により 見栄えを表現 データ構造を表現 機能を実現 1 ー 開発者 3標準技術HTML, CSS, JavaScript
  28. 28. Browser is a PlatformWebアプリケーションの制約からの解放
  29. 29. No Plug-inFlash player, Silverlight plug-in, JavaFX runtime
  30. 30. Cross-PlatformWindows, Mac OS X, Linux, Chrome OS
  31. 31. Multi-devicePC, Mac, Mobile, .....
  32. 32. 余談
  33. 33. 叶わなかった願い - FlashiPhone OSへのFlash Playerの搭載
  34. 34. iAdiPhone/iPad向け、モバイル広告 ­ 広告はHTML5で作る
  35. 35. 非Andoide Mobile AP-PFの共同開発ブラウザのHTML5対応はどうなる?
  36. 36. Server-Side lessオフライン、ローカルストレージ、Drag&Drop、File API、WebWorker
  37. 37. Web/Desktopの低い垣根Drag&Drop/File API、ネイティブアプリケーションとしてラッピング
  38. 38. <header> <section> <header> <nav> <aside> <article> <footer> <footer>Webがよりセマンティックにheader, nav, section, article, footer, aside
  39. 39. HTML5 is Simple!doctype, meta, script, link 省略...<!doctype html><meta charset= utf-8 ><script src= xxx.js ></script><link rel= stylesheet href= xxx.css ></link>
  40. 40. 段階的変化の許容HTML4/XHTMLからHTML5へ - 前方/後方互換性の維持(革新より発展)
  41. 41. N ew !常に最新のソフトウェアを使えるWebアプリケーションの特性
  42. 42. 低コストな開発/実行環境デバッグ、プロファイラなどがブラウザに組み込める/まれている
  43. 43. 私のイチバン
  44. 44. デザイナ 1 ー 3 JavaScript CSS HTML 各種APIの拡張により 見栄えを表現 データ構造を表現 機能を実現 1 ー 開発者 3標準技術HTML, CSS, JavaScript
  45. 45. 皆さんが感じたHTML5の魅力って?時間がなかったら懇親会で話しましょう
  46. 46. HTML5対応チェック
  47. 47. When can I use...
  48. 48. HTML5 Demos and Examples
  49. 49. Modernizr
  50. 50. 巷のFlash悲観論FlashってFlash Playerのこと? Flash CSのこと?
  51. 51. HTML5とFlashの共存 ExternalInterfaceを利用した JavaScript ActionScript連携
  52. 52. HTML5 / Flash 比較 HTML5 Flash 公平性 ○ (標準技術) (Adobe独占) 互換性 (ブラウザ依存) ○ (Flash Playerのみ) PC普及率 (IE未サポート) ○ (ほぼ100%)モバイル普及率 △ △ 開発者数 ○(HTML, JavaScript) △ (ActionScript)開発ツール ○ ○
  53. 53. HTML5に関してコメント
  54. 54. HTML5,いつから使えるの?
  55. 55. もう, 使える機能から部分的に
  56. 56. iPhone/Android &IE以外のブラウザでは 既に結構イケる
  57. 57. HTML5はデザイナ/開発者にとって魅力的
  58. 58. 次期Web標準技術なので 無視できない
  59. 59. これまでのWebの制約が変わります
  60. 60. 提案
  61. 61. 別に作りたいサイトやWebアプリはないという方
  62. 62. Chrome Extensionsで便利なツールを作っては?
  63. 63. Thanks! shoito sho.ito@air-life.net http://twitter.com/shoito HTML5-FIT
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×