D2-301 現時点の本資料は 完成版のスライドではありません。

Presentation on theme: "D2-301 現時点の本資料は 完成版のスライドではありません。"— Presentation transcript:

1

2 D2-301 現時点の本資料は 完成版のスライドではありません。
開催当日までに内容に変更がありますので、印刷を 行われる方は後日更新される版をご利用になり、会場にお持ちください。会場には印刷資料はございません。

3 HTML5 でも安心！ Visual Studioでの Web 開発
日本マイクロソフト株式会社 デベロッパー & プラットフォーム統括本部 エバンジェリスト 物江 修 (ものえおさむ) D2-301

4 セッションの目的とゴール Session Objectives and Takeaways
HTML5 がアプリケーションにもたらす価値を ご理解いただく Visual Studio 2010、ASP.NET を使った HTML5 アプリケーションの作成方法の紹介 セッションのゴール ASP.NET アプリケーションに効果的に HTML5 の機能を組み込めるようになる Visual Studio 2010 を使用してHTML5 コンテンツを効率よく記述できるようになる

5 アジェンダ HTML5 とは? ASP.NET における HTML5 の利用 Visual Studio 2010 の HTML5 サポート
Internet Explorer 9 : F12 開発者ツール

6 HTML5 とは?

7 HTML5 とは? ～ 新しいバージョンの HTML です ～
Same Markup, Same Code アプリケーションの プラットフォーム セマンティック

8 「HTML5」と呼ばれるもの SVG MathML WebGL Etc.. キーワードとしての HTML5 CSS3 JavaScript
(マークアップ) JavaScript API CSS3 SVG MathML WebGL Etc.. キーワードとしての HTML5

9 ASP.NET における HTML5 の利用

10 ASP.NET MVC3 Tools Update
セマンティック タグ Modernizr JavaScript ライブラリ

11 セマンティック タグ とは? ～ ページ内の文に意味付けを行うもの ～
見出し ロジカルな 文書構造 マシン リーダブル SEO 案内 時間 レコード(*) 記事

12 Modernizr 古い Web ブラウザー対応 本来は Web ブラウザーが HTML5/CSS3 のどの機能に 対応しているかをチェック
modernizr.com で配布 OSS JavaScript ライブラリ MVC3 Tools Update に 含まれているのは v1.7 Modernizr-*.*.js

13 MVC HTML5 Toolkit HTML5 タグのヘルパー CodePlex で配布 NuGet からインストール
ｗeb.config に名前空間 の追加が必要 Razor でも使用可 System.Web.Mvc.Html5.dll

14 Demo ASP.NET MVC3 Tools Update MVC HTML5 Toolkit

15 におけるHTML5 サポート

16 HTML5 への対応状況 Service Pack 1 CSS3 Intellisense Schema
HTML5 Intellisense for Visual Studio 2010 and 2008 2010.June 2011.February CSS3 Intellisense Schema Service Pack 1 2011.April 2011.June Web Standards Update for Microsoft Visual Studio 2010 SP1

17 Web Standards Update for Microsoft Visual Studio 2010 SP1
ターゲット スキーマと インテリセンス HTML5 タグ ブラウザー API CSS3 ＋

18 Demo Web Standards Update for SP1

19 F12 開発者ツール

20 F12 開発者ツール [F12] キーで起動 Internet Explorer 9 標準搭載 オンライン上のコンテンツも 　デバッグ可能

21 F12 開発者ツールの機能 エレメント情報 の表示 HTTP キャプチャ HTML、CSS の編集 JavaScript の デバッグ
互換性のチェック

22 Demo F12 開発者ツール ～ 基本機能紹介 ～

23 セッションのまとめ Session Wrap Up
ASP.NET は HTML5 を意識した機能追加が行われており、 それを使用することで新しい時代に対応した アプリケーションを作成することができます。 Visual Studio 2010 を使用すると、HTML5 を使用した コンテンツを効率よく記述することができます。

24 関連セッション D2-201：さらっと眺めてみよう! Web 関連テクノロジ "超" 概要
D2-202：Internet Explorer 9 と HTML5。そして、IE10

25 リファレンス #1 Microsoft Visual Studio ホームページ Visual Studio 2010 Service Pack 1 について (技術情報) Web Standards Update for Microsoft Visual Studio 2010 SP1 ASP.NET MVC3 Tools Update MVC HTML5 Toolkit

26 リファレンス #2 Microsoft Web Platform http://www.microsoft.com/web
Internet Explorer デベロッパー センター monoe’s blog Internet Explorer 9 ダウンロード

27 ご清聴ありがとうございました アンケート にご協力 ください D2-301

28 © 2011 Microsoft Corporation. All rights reserved
© 2011 Microsoft Corporation. All rights reserved. Microsoft, Windows, Windows Vista ,Windows 7 and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries. The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.