Expression Web 4 にて HTML5 がサポートされました。アドオンを追加すればインテリセンスがきくようになります。

2010/10/10

Expression Web 4 にて HTML5 がサポートされました。
アドオンを追加すればインテリセンスがきくようになります。

http://blogs.msdn.com/b/shosuz/archive/2010/10/07/html5-schema-configuration-add-in-for-expression-web.aspx

以下、上記URLから本文を引用して紹介します。

※ 最終段落に、既知の問題について書かれています。

HTML5 Schema Configuration Add-In for Expression Webとは

皆様、こんにちは!

今日は、下記のURLで登場したExpression Web 4のHTML5 support 追加について、取り急ぎご紹介します。

image

これはExpression Web 4のアドインですので、インストールすると、HTML5でオーサリングができます。HTML5でインテリセンスが聞くようになりますので、非常に便利です。もちろん日本語版でも動くことを確認しました。

インストール

それでは早速インストールしてみましょう。

まずは、Expression Web 4を起動中の方は、終了してください。同時に、このURLより、HTML 5 Schema Configuration Add-In をダウンロードし、ローカルに保存しておきます。

そして、Expression Web 4を起動して、[ツール]メニューの[アドイン] を選択し、”アドインの管理”ダイアログボックスを表示します。

image

その中のインストールボタンから、インストールを選ぶと、下記のダイアログが開きますので、このアドインを選んで、開きます。

image

すると、下記のダイアログボックスが出てきますので、Yesを押します。

もし、このアドインが正しくインストールされていれば、 アドインの管理ダイアログボックス内に表示され、また、標準ツールバーに、新しい “HTML5” ボタンが表示されるはずです。

image

image 

ここまで確認したら、いったんExpression Web 4を終了します。

HTML5 Schema Configuration Add-Inを使ってみる

  1. まずExpression Web 4 を、管理者権限で起動します。
  2. 表運ツールバーにあるHTML5ボタンをクリックします。Configure HTML 5 Schemas ダイアログボックスが出ますので、この中のボタンで、有効無効を設定できます。
    image_thumb[33]
  3. Enable HTML 5 ボタンをっクリックして、Expression Web HTML 5 schemasを更新します。右上のX をクリックしてこのダイアログボックスをクローズします。
  4. ここで、デフォルトの新規作成ページのDOCTYPE を全てHTML5にしたい場合には、[ツール]> [ページ編集オプション]を選択し、”作成”タブを開いて、””ドキュメントの型宣言と”セカンダリスキーマ”のいずれも HTML5にします。

 image

これで、Expression Web 4で新しいWebページを作成するときは、常に新ページはHTML5のdoctypeを含むことになります。

<!DOCTYPE html>

デフォルトのDocTypeをHTML5 にしない場合には、新しくHTML5 ページを作るには、コードビュー上で、手動でやる必要があります。または既存のHTML5 ドキュメントを開いて、Expression Web 4で編集することもできます。

いずれにしても、HTML5 ドキュメントをコードビューで編集する際には、Expression Web 4 が現在提供しているIntelliSenseの機能が、HTML 5 のelements、attributes、そしてvalues等で有効になります。

image

image

いかがでしょうか?Expression Web 4が、HTML 5 対応Webアプリケーション用の偉大なエディターに変身した瞬間です。ぜひ使ってみてください!

今後の弊社のテクニカルセッション等でもどんどんご紹介したいと思います。

現時点での既知の問題

  • このアドインをアンインストールした場合、ファイルが残っていますので、再インストールがうまくいかない場合があります。対処法は次の通りです。
    • %APPDATA%\Microsoft\Expression\Web 4\Addins ディレクトリにある、HTML5Schema フォルダを削除してから、当アドインをインストールしてください。
  • 現在のSVG schema は、当アドインにより提供されています。しかし、SVGマークアップは、Expression Web 4により、時に不正と評価されてしまう場合があります。その場合の対処法は次の通りです。
    • Online code validatorを使いましょう。W3Cで提供されています。 
  • Expression Web 4 で、時々クロージングHTML 5 タグが(マークアップが正しいにも関わらず)ミスマッチと評価されてしまう場合があります。 対処法は次の通りです。
    • Online code validatorを使いましょう。W3Cで提供されています。
  • 当HTML 5 Schemaアドインを有効にする/無効にするには、Expression Web 4を、管理者権限で起動しなおす必要があります。

鈴木 章太郎

-未分類