タグ

ブックマーク / standards.mitsue.co.jp (15)

  • SVGをimg要素で | Web標準Blog | ミツエーリンクス

    IE9が(ある程度までの)実装を決め、昨今注目を集めつつあるSVG。Gecko(Firefoxなど)でも、レンダリングそのものは以前よりサポートされてきました。 しかし、Geckoでは外部SVGファイルをimg要素を使って参照することはできませんでした。次のマークアップ断片のようにSVGファイルを参照しようとしても、レンダリングされなかったのです: <p><img src="foobar.svg" alt="Foo Bar" /></p> そのため、object要素やiframe要素を使って参照する必要がありました。 この問題はBug 276431として解決が図られてきました。また、HTML5仕様のimg要素src属性値定義では、Noteとして(スクリプトを含まない)SVGを参照できることが明記されました。 そしてつい先日、パッチが適用されました。このまま何事もなければFirefox 4(

    teppeis
    teppeis 2012/01/27
    WebKit, Opera, FF4, IE9でimg要素にSVGファイルを読める
  • CSSグラデーションの構文変更とベンダー接頭辞 | Web標準Blog | ミツエーリンクス

    前回のベンダー接頭辞に関するエントリで、接頭辞なしの機能を併記してもうまくいかないことがあると書きました。 これは、標準化された(接頭辞のない)機能の構文もしくは解釈が変わってしまう場合を意図しています。そして、CSSのグラデーションでそうした変更が加えられています。 linear-gradient()のキーワードが変更に 少し前の話になりますが、9月8日に更新されたCSS3 Image Values草案では、linear-gradient()の構文で利用されるキーワードの書式が変更されています。 これまでの構文 linear-gradient( [deg | to side-or-corner] , color-stops) これまで、キーワードは、topなら下向きのグラデーション、rightは左向きのグラデーションなど、グラデーションの基点を示していました。 しかし、7月12日版の草案

    teppeis
    teppeis 2011/11/29
    「接頭辞なしの機能を併記してもうまくいかないことがある」linear-gradient
  • WebSocketプロトコルがLast Callに | Web標準Blog | ミツエーリンクス

    WebSocketのプロトコル仕様がIETFのLast Callになりました。 [hybi] Last Call: (The WebSocket protocol) to Proposed Standard 対象となっている文書は、先日公開されたdraft-ietf-hybi-thewebsocketprotocol-10になります。 The WebSocket protocol (draft-ietf-hybi-thewebsocketprotocol-10) WebSocketプロトコルは古いバージョンの実装が進められていましたが、セキュリティに問題があることがわかり、古いプロトコルを実装したブラウザのうちFirefoxやOperaは、WebSocketを無効にした状態でリリースしています。 プロトコルがLast Callになったことで、ブラウザの実装も更新されていくでしょう。古いプロ

  • 基礎となりつつあるCSS3と、CSSの現在、これから | Web標準Blog | ミツエーリンクス

    3月はブラウザのリリースが続いた一ヶ月でした。Internet Explorer 9, Firefox 4, Chrome 10が正式版となり、またOpera 11.10, Chrome 11がそれぞれベータ版として公開されました。 それぞれのCSSサポート状況を見ながら、CSS3の現在とこれからについて考えてみました。 スナップショットがベースラインに IE9でがセレクタとColor, 名前空間、メディアクエリーを実装したので、デスクトップブラウザにおいてCSSスナップショットが満たされたことになります。IE9がWindows Phone 7に提供されると、スマートフォンにおいてもそれが完了します。CSS3は一部ではありますが、CSSの基礎となったのです。現在のPCサイトでは主にCSS 2.1段階のCSSが開発の基礎技術として認識されていたように思いますが、今後はスナップショットに移行し

    teppeis
    teppeis 2011/03/28
  • 2010年のWeb標準 | Web標準Blog | ミツエーリンクス

    2010年もあと数日を残すのみとなりました。というわけで、2010年のWeb標準について感じたことをまとめ、来年以降の動きについて考えてみました。 HTML5と周辺技術 2010年は昨年に盛り上がった「HTML5」への注目が、さらに広がった一年であるように思えます。とはいえ、どういった機能があり、どのような展開が見込まれるのかというよい紹介が増えたこともあり、昨年にあった「XHTMLはなくなる」といったような誤解がとても少なくなったのは良かったと感じています。 さらに今年は「HTML5」と括られる技術で構成されたショーケースの登場、スマートフォンの普及もあり、実際のWebアプリケーションでの採用といった出来事が重なりました。これからの基盤技術として「使っていく」技術という認識が固まったのではないでしょうか。今後は「使うこと」にフォーカスした情報が多く出てくるのではないかと思います。 Web

  • HTML5フォームのセレクタとCSSのエラー処理 | Web標準Blog | ミツエーリンクス

    Firefox Hacksに、HTML5フォームに関する記事が掲載されています。新しいinputタイプや、フォームとコントロールの分離、値のvalidationについての紹介など、盛り沢山な内容になっています。 Firefox 4: HTML5 Forms さて、記事の中に「New CSS selectors」というセクションがあります。HTML5仕様では、いくつかの新しいフォーム関連セレクタ(擬似クラス)が定義されているのですが、記事では検証に関わる:requiredや:valid, :invalid、およびinput, textareaのplaceholder属性のスタイルを変更するセレクタを紹介しています。 HTML5仕様では、プレースホルダのスタイルを変更することに関しては何も言及がありません。そこで、WebKit, Geckoはそれぞれ固有拡張として::-webkit-input

    teppeis
    teppeis 2010/11/28
    「これは、Geckoでは-webkit-な擬似要素が、WebKitでは-moz-な擬似クラスが不明のセレクタと認識されパースされず、結果としてそのあとのブロック全体が無視されてしまうからです。」
  • Last Callに向け進むHTML5 | Web標準Blog | ミツエーリンクス

    HTML5の新しい草案が、日公開されました。 HTML 5 (2009年4月23日版) HTML 5 differences from HTML 4 (2009年4月23日版) いつもの通り、変更点の日語訳を更新しています。 HTML 5 ― HTML 4 からの変更点 前回の草案との差異から、気になったものを取り上げてみます。 spellcheck属性の追加。Chromeで実装されているようです。 SVGtext/htmlにおける処理の追加。追加されて間もなく、また提案段階ですので、実装はありません。 さて、前回の草案が2月12日公開ということから、2ヶ月ちょっとでの更新となります。前回の草案については8ヶ月も間があったわけですが、いったいこの早期の更新は何を意味するのでしょうか。 制作者のためのHTML5 ひとつは、仕様書に大きな手が加わったことです。 HTML5の仕様書は、「実

    teppeis
    teppeis 2009/04/24
  • Operaの「Web Standards Curriculum」日本語訳に協力 | Web標準Blog | ミツエーリンクス

    「Web Standards Curriculum」とは、Web標準の普及と啓発に積極的なブラウザベンダーのOpera Software社(以下「Opera社」)が公開しているカリキュラムです。HTMLCSSを含め、Web標準に基づくデザインを初心者が学ぶには、大変有用な内容となっています。 同カリキュラムは英語で執筆された50以上の記事から構成されていますが、当Blogの記事「OperaのWeb標準カリキュラムに複数の翻訳版が登場」でご紹介したように、複数の言語に翻訳され始めています。 このたびミツエーリンクスは、Opera社の協力のもと、同カリキュラムの日語訳に着手することになりました。翻訳した記事は、双方のWebサイト上で公開されます。すべての記事の公開までには、かなりの時間を要するかもしれませんが、逐次公開を実施する予定です。 今後、同カリキュラムがより多くの方々にご活用いただ

    teppeis
    teppeis 2009/04/21
  • CSSの実装状況を知るには? | Web標準Blog | ミツエーリンクス

    BlogではHTML5やCSS3などの策定状況をお伝えしていますが、実装状況についてはあまり触れていませんでした。というわけで、今回は実装状況を調べるためのリソースを取り上げてみようと思います。 Firefox Firefoxについては、開発者のDavid Baronが、CSS WGのメーリングリストに“CSS implementation status reports (and a first one from Mozilla)”というメールを投稿しています。Firefox 3.5とその次のバージョンについて、実装している機能と実装されていない機能がまとめられています。 Davidは「実装状況や今後のプランなどを共有して、より相互運用性を高めよう」という考えのもとこの企画をはじめたようで、メールでは今後実装を考えているモジュールについても触れられています。 Firefoxは他にも、Mo

  • iPhone/Android版GmailがHTML5を利用 | Web標準Blog | ミツエーリンクス

    Official Gmail Blogの“A new mobile Gmail experience for iPhone and Android”というポストにて、新しいiPhone/Android版のGmailが発表されています。インターフェースの刷新もさることながら、HTML5の機能を利用したと書かれていることが興味を引きました。 利用している機能は、canvasやクライアントサイドストレージで、canvasはスピナー(ロード中にくるくる回るもの)に、ストレージはオフライン用のデータ格納に用いられているようです。canvasはMozillaのBespinでもインターフェースの描画に使われており、アプリケーションのUIに利用する例が今後も増えてきそうです。 インターフェース面でも、border-imageやCSS Transitionsなど新しい機能を使用しているようです。また画像はd

    teppeis
    teppeis 2009/04/08
    モバイルのようにブラウザを限定できるならHTML5が現実解になる。
  • IE8のモードスイッチ | Web標準Blog | ミツエーリンクス

    IEBlogの“IE8 Beta 2 Coming in August”という記事にて、IE8 Beta 2が8月にリリースされるというアナウンスがありました。Beta 2ではCSS 2.1準拠に向けたバグ修正や、スクリプトのパフォーマンス向上が見込まれるようです。また、日語を含む各言語版のBetaも配布されます。 さて、同じ記事にて「meta要素によるレンダリングモード指定の文書を公開しました。」という報告がありました。今回はこの“Defining Document Compatibility”という文書を参考に、改めてIE8のレンダリングモードについて解説したいと思います。 3つのレンダリングモード IE8には3つのレンダリングモードが存在します。 IE8モード CSS 2.1やSelectors APIなど、Web標準を強く意識したモード。 IE7モード IE7の標準準拠モードと同

    teppeis
    teppeis 2009/03/23
  • ブラウザーベンダーとCSS3 | Web標準Blog | ミツエーリンクス

    今週前半にテキサスのオースティンで開催されたSXSW Interactiveにて、CSS3に関するパネルセッションが開かれていたようです。 パネルにはMozilla, Microsoft, Operaが参加し、各ブラウザとCSS3の対応状況について語っています。プレゼンターをつとめたOpera SoftwareのMolly E. Holzschlag氏がスライドを公開しているので、すこし見てみましょう。 注:スライド中のサンプルは、実際にCSS3のプロパティを利用しています。このため、それらのプロパティが実装されていないバージョンでは、その効果を見ることができません。 Mozilla 開発者のDavid Baron氏による、CSS3のプロパティを主に解説したスライド(注:XHTMLのためInternet Explorerでは開けません)では、border-imageやtext-shadow

    teppeis
    teppeis 2009/03/19
  • Graceful DegradationとProgressive Enhancementの実践 | Web標準Blog | ミツエーリンクス

    Chris Heilmanによる“Graceful degradation versus progressive enhancement”という記事について、前回は概要とその意義について紹介しました。今回は後半にあるの例をもとに、どのように実践していくのかを考えてみたいと思います。 「印刷する」というリンク オンラインショッピングの決済画面には、印刷して手元に保管したいというニーズがあるからか「印刷する」といったリンクやボタンが設けられています。クリックしたときに印刷用ページが現れるものもありますが、記事では印刷ダイアログが現れる簡単なものを取り上げています。 このようなリンクは、JavaScriptにより実現されています。 <p id="printthis"> <a href="javascript:windowprint()">Print this page</a> </p> しかしな

    teppeis
    teppeis 2009/02/26
    スタートラインの差
  • HTML5 における HTML4 からの変更点

    この文書は「HTML5 differences from HTML4 (W3C Working Draft 25 May 2011)」の日語訳です。 原文の最新版 は、この日語訳が参照した版から更新されている可能性があります。 この日語訳は参考情報であり、正式な文書ではないことにご注意ください。また、翻訳において生じた誤りが含まれる可能性があります。他の仕様の訳については Web 標準仕様 日語訳一覧 を参照してください。 更新日: 2011-09-15 公開日: 2011-05-26 翻訳者: 矢倉 眞隆 <yakura-masataka@mitsue.co.jp> HTML5 における HTML4 からの変更点 2011年5月25日付 W3C 草案 (Working Draft) この版: http://www.w3.org/TR/2011/WD-html5-diff-2011

    teppeis
    teppeis 2009/02/13
  • HTML 5の草案が公開 | Web標準Blog | ミツエーリンクス

    HTMLワーキンググループより、HTML 5の最初の草案が公開されました。あわせて、HTML 4(XHTML 1.0)との変更点を簡単にまとめた解説文書も公開されています。 HTML 5は、ユーザーエージェント間の相互運用性を高め、またユーザーにとって便利である機能を追加した、WebサイトやWebアプリケーションを構築するための新しい仕様です。これまでのHTMLやXHTMLとは異なり、要素や属性の定義だけではなく、それらにアクセスするためのDOMインターフェースや、オフラインストレージ機能などが盛り込まれています。 名前はHTMLとなっていますが、HTML 5にはXMLによる構文も定義されています。このためHTML 5は、HTML 4.01やXHTML 1.0の後継仕様ととらえることができるでしょう。あわせて公開されたHTML 5 differences from HTML4という文書では

    teppeis
    teppeis 2008/01/23
    和訳
  • 1