ミツエーリンクス

Web標準Blog

Home > メソッド > Web標準Blog

Web標準Blogでは、Web標準の利用に興味のあるWebサイト管理者、Webデザイナーの方向けに、Web標準を利用するための手法やノウハウ、参考になるリソース等を、国内外を問わずご紹介します。

なお当Blogでは、Web標準に関する疑問や質問を募集しています。Webコンテンツ実装プロセスにまつわるお悩みでも結構ですので、お気軽に電子メールでstandards@mitsue.co.jp宛にお送りください。

当Blogの更新情報は、Twitter経由でも配信しています。興味のある方はぜひ、@mlcstandardsをフォローしてください。当Blogへのご意見・ご質問は、Twitter経由でも受け付けております。

2010年02月04日

RDFa WGが設立

フロントエンド・エンジニア 矢倉

W3Cより、RDFa WGの設立が発表されています。

RDFaはXHTMLをはじめとするマークアップ言語に構造化データを埋め込み、RDFとして抽出できるようにする仕組みです。「メタ情報をXHTMLに埋め込むRDFa」で簡単にですが紹介しています。

憲章から、RDFa WGは現在のRDFa 1.0をベースに、次のような拡張を検討していることがわかります。

RDFa 1.0はXHTML 1.1と統合された形で2008年に勧告されましたが、その後HTML5への組み込みSVG Tiny 1.2に取り込まれたこともあり、ホスト言語に依存しない仕様が必要とされていました。

HTML5にはRDFaとは別に、マイクロデータという、メタ情報を埋め込む語彙とAPIが定義されています。また、RDFやJSONによるデータ出力も用意されています。HTML5では要素や語彙がDOMとして定義されていることもあり、RDFaについてもDOM APIが必要とされているようです。

RDFaはすでにGoogleのRich SnippetsやYahoo!のSearchMonkeyで利用されており、またYahoo! JAPANの検索プラグインでもサポート予定とのことで、広がりが予想されます。編集が簡易になることが検討されているようなので、RDFa自体の発展も楽しみです。

恒久リンク | コメント [0件] | 関連情報(トラックバック) [0件]

2010年02月01日

2010年1月のW3C

フロントエンド・エンジニア 矢倉

Indexed Database API

1月5日付けで、Indexed Database APIの草案が公開されました。これは昨年までWebSimpleDB APIと呼ばれていた仕様です。

先月分のエントリにてお伝えしましたが、Web SQL Databaseの進展が考えにくい状況になったことから、WebApps WGと各ブラウザーベンダーはこの仕様の策定に移っています。

Selectors API Level 2

1月19日付けで、Selectors API Level 2の草案が公開されました。

この仕様は、昨年末に勧告候補が公開された (日本語訳) の上位レベル仕様になります。開発者からの要望が高かったコンテキスト参照 (クエリの起点を指定する) を盛り込み、querySelector, querySelectorAll の拡張や、ショートハンドであるqueryScopedSelector, queryScopedSelectorAll という新しいメソッドの追加が提案されています。また、ある要素が特定のセレクターにマッチするかを返す matchesSelector という新しい機能も提案されています。

matchesSelector はGeckoおよびWebKitでの実装が始められるなど、早い段階で利用できる可能性があります。一方、コンテキスト参照についてはまだ議論が続いている段階のようです。

CSS Styling Attributes Level 1 最終草案

1月21日付で、CSS WGよりCSS Styling Attribute Level 1の最終草案が公開されました。

なんの仕様かというと、style属性内でのスタイルシートの処理を定めた仕様です。

この仕様、もともとはCSS3の一つとして、擬似要素/擬似クラスへの対応、スコープを限定したスタイル適用など拡張が検討されていたのですが、進行することがありませんでした。そして昨年のCSS WG F2Fにて、拡張に関する機能を省き、HTML5や他のスタイル属性を定義する仕様が参照できる仕様としてまとめるということが決定され、この仕様の公開に至りました。

恒久リンク | コメント [0件] | 関連情報(トラックバック) [0件]

2010年01月27日

第一回HTML5 Japanese IG F2Fが終了しました

フロントエンド・エンジニア 矢倉

先週金曜日に、HTML5 Japanese IGのF2Fが慶應義塾大学日吉キャンパスにて行われました。110人もの方にご参加いただき、盛況のうちに終了しました。

今回はOpera, Mozilla, Microsoft, Googleの方をお招きし、HTML5や関連仕様についてお話していただきました。現時点で、次のスライドが公開されています。

また、参加された方のTwitterのログやBlogエントリでも、当日の様子をご覧いただけます。

今後もこういった催しを行うことを検討しています。ぜひHTML5 Japanese IGにご参加いただき、HTML5に関する意見・質問などを寄せていただけたらと思います。

恒久リンク | コメント [0件] | 関連情報(トラックバック) [0件]

2010年01月18日

HTML5 Japanese IG F2F開催のお知らせ

フロントエンド・エンジニア 矢倉

昨年のおわりに活動がスタートしたHTML5 Japanese IGですが、今週金曜日にFace-to-Faceミーティングを開催することになりました。慶應義塾大学日吉キャンパスにて、17:30より始まります。

今回はOpera, Mozilla, Microsoft, Googleより人をお招きし、新しい技術などのデモや説明をしていただきます。参加をご希望の方は、上記ページの案内に従ってメールを送信していただければと思います。

恒久リンク | コメント [0件] | 関連情報(トラックバック) [0件]

2010年01月15日

HTML5でアクセシブルな字幕付きビデオを

フロントエンド・エンジニア 矢倉

OperaでWebエバンジェリストを努めるBruce Lawsonが、「アクセシブルなHTML5のビデオ」という記事を実装方法とともに紹介しています。

videoのアクセシビリティ

video要素やaudio要素のアクセシビリティは、動画や音声にデータとして情報を含む事が望ましいとされています。ただ、それが難しい場合のことを考えて、このデモではビデオの字幕をページ内に記述し、それをビデオの上に重ねるという手法で字幕を表示させています(JavaScriptが有効でない環境では、トランスクリプトが表示されます)。

タイムシートはカスタムデータ属性で

さて、ビデオの内容もそうなのですが、このデモでなによりユニークなのはタイムシート情報をキャプションを囲むspan要素に持たせているところです。

HTML5にはアプリケーション作者や文書作成者が独自の情報を埋め込める「カスタムデータ属性」が用意されており、デモではこれを利用しキャプションに対応する動画の開始時間と終了時間を埋め込んでいます。

カスタムデータは、data-***というかたちで要素に埋めこめます。デモのソースコードを抜き出してみましょう。

<span data-begin=1 data-end=6>Hi, my name's Dr Archimedes Einstein ...
<span data-begin=6 data-end=9>in a very famous town that you're too ...
<span data-begin=9.5 data-end=11.5>Anyway, today we're going to talk ...
<span data-begin=12 data-end=15>A lot of people are worried about ...

HTML5では、埋め込んだ情報はelement.datalist.***から取得できると定義されているので、この場合はspan.datalist.begin/span.datalist.endでデータにアクセスできる事になります。しかし、現時点でこのカスタムデータ属性を実装しているブラウザーがないことから、デモでは属性の名前から値をとっています。

そして、取得したデータに該当する再生時間になったら、キャプションを表示する箇所にそのテキストを挿入するという仕組みです。

videoのアクセシビリティやカスタムデータ属性についてはまだ議論中なのですが、とても面白いデモだなと思いました。

恒久リンク | コメント [0件] | 関連情報(トラックバック) [0件]

2010年01月06日

2009年12月のW3C

フロントエンド・エンジニア 矢倉

2010年になりました。今年もWeb標準Blogをよろしくお願いいたします。

WAI-ARIA草案

12月15日付で、WAI (Web Accessibility Initiative) のProtocols and Formats WGより、WAI-ARIAの草案が公開されました。オーサリングに関する文書もあわせて更新されています。

昨年2月に最終草案が更新されましたが、多くのコメントがよせられたこともあり、草案に戻っての公開となっています。

CSS3セレクターの勧告案と、2モジュールの勧告候補

「CSS3セレクターの勧告案が公開」で取り上げましたが、CSS WGよりCSS3セレクターの勧告案が12月15日付で公開されました。

また、12月17日付でCSS3 Backgrounds & Bordersと、CSS3 Multi-column Layoutの勧告候補も公開されています。

Selectors API Level 1勧告候補

Web Applications WGより、Selectors API Level 1の勧告候補が公開されました。

名称にLevel 1がつけられたのは、Level 2が検討中という理由があるようです。

すべての主要ブラウザーの最新版で対応していますので、テストスイートの作成と検証が行われれば勧告になるのにそれほど時間はかからないでしょう。

HTML5関連仕様の最終草案と草案

同じくWebApps WGより同日付で、Web Storage, Web Workers, Server-Sent Eventsの最終草案が公開されました。

Web Sockets APIとWeb SQL Databaseについては、草案の更新のみにとどまっています。

このうち、Web SQL Databaseは今後の策定が実質的に停止する旨が仕様書に書かれました。これは、仕様が利用するSQLの構文についてベンダーの合意が得られなかったことが原因です。とはいえ、データベース機能についてはそのニーズがあることから、WebApps WGは現在、Indexed Database APIという別の仕様を策定しています。

Web SQL DatabaseはすでにWebKitで実装されており、またデータベースを利用したアプリケーション(Gmailなど)もあることから、実装から無くなってしまうということはないと思いますが、注意が必要かもしれません。

恒久リンク | コメント [0件] | 関連情報(トラックバック) [0件]

2009年12月28日

2009年のWeb標準

フロントエンド・エンジニア 矢倉

2009年もあと数日ということで、今年のWeb標準について簡単ですが本Blogのエントリをもとに振り返ってみようと思います。

XHTML

1月にXHTML Media Typesの第二版が公開され、XHTML文書を公開する際のガイドラインがより現実を反映したものになりました。

7月にはXHTML2 Working Groupの活動終了がアナウンスされました。

XHTML 2.0の策定は中止されますが、XHTML自体が終了するわけではありません。

HTML5と関連API

2009年はHTML5の注目がとくにまった一年であるように感じました。

来年は最終草案の公開が予定されていますし、実装のさらなる進歩や実際に利用するケースもより多く見られるのではないかとおもっています。

CSS2, CSS3

3月に公開されたInternet Explorer 8でのサポートもあり、CSS 2.1がまた勧告に近づきました。CSS3については、Web FontsやBackgrounds & Bordersが実装・仕様ともに進んだ年であったように思います。
Web Fontsはフォーマットの違いこそありますがIEでサポートされていることもあり、海外では普通に利用しているものを見かけるようになりました。Internet Explorerについても、次期バージョンではセレクターやborder-radiusの対応を考えているようです。

HTML5とともに「古いブラウザーについてどう考えるか」が今後さらに重要なトピックになっていきそうですね。

おわりに

今年は、gihyo.jpでの連載、Web標準カリキュラムの翻訳、Web Designingへの執筆・連載やCSS Niteでの講演、書籍の監修など様々な機会をいただくことができました。

今後も様々な情報を公開していこうと思っています。来年も、Web標準Blogをよろしくお願いいたします。

恒久リンク | コメント [0件] | 関連情報(トラックバック) [0件]


関連情報

バックナンバー

RSS1.0による
最新記事一覧

RSS1.0による最新記事のご案内

プライバシー&サイトポリシーCopyright (c) 2010 Mitsue-Links Co.,Ltd. All Rights Reserved.

Web制作、ホームページ作成、Flash制作:Webサイト構築、Webサイト運用:ブロードバンドコンテンツ(音声制作、動画制作):システム開発、Webマーケティング、Webブランディング、Webコンサルティング・・>のWeb Integrationならミツエーリンクスにお任せください。