タグ

ブックマーク / hyper-text.org (46)

  • Chrome Canary が dialog 要素に対応、ダイアログボックスの表示が簡単に

    Chrome の Canary build が、HTML 5.1 で策定中の dialog 要素に対応したとのことで、HTML5Rocks でデモページが公開されています。その紹介と、dialog 要素についての簡単な解説。 HTML5Rocks の記事経由ですが、Chrome の Canary build が、HTML 5.1 で策定中の dialog 要素に対応したとのこと。 現状では、chrome://flags から enable-experimental-web-platform-features を有効にする必要がありますが、これによってダイアログボックス (モーダルウィンドウ) の表示を HTML と簡単な JavaScript API で行えます。また、::backdrop 疑似要素を使用することで、ダイアログボックス表示時の、画面背景を暗くするあれも CSS だけで簡単に

    Chrome Canary が dialog 要素に対応、ダイアログボックスの表示が簡単に
    kyaido
    kyaido 2013/09/24
  • WebKit (Nightly Builds) で srcset 属性がサポートされたらしい

    WebKit (Nightly Builds) で HTML の srcset 属性がサポートされたようですので、簡単に srcset 属性の仕様について解説してみます。 WebKit (Nightly Builds) で HTML の srcset 属性がサポートされたようです。 srcset 属性は、img 要素の属性として使用することで、高精細ディスプレイ (デバイスピクセル比に応じて) 向けや、ディスプレイサイズに応じて画像を出し分けるための属性。所謂、「Responsive images (レスポンシブ イメージ)」 を HTML のみで実現することができます。 Improved support for high-resolution displays with the srcset image attribute : Surfin' Safari WebKit Nightly

    WebKit (Nightly Builds) で srcset 属性がサポートされたらしい
    kyaido
    kyaido 2013/08/19
  • 富士通アクセシビリティ・アシスタンスが提供終了。感謝と共に代替手段も紹介してみる

    富士通さんが、2004年より無償ダウンロード提供していた視覚障害者や色覚障害者のアクセシビリティを高めるための診断ソフトウェアツール群 「Fujitsu Accessibility Assistance (富士通アクセシビリティ・アシスタンス)」 が 2013年の 8月 20日をもって、無償提供を終了するそうです。 富士通、色覚障がい者のための診断ソフトウェア無償提供8月20日をもって終了:「終了前に、ただ伝えてほしい」――多くの開発者に届きますように。 : @IT 富士通アクセシビリティ・アシスタンス : 富士通 富士通アクセシビリティ・アシスタンスは、2003年から公開されていた 「Web Inspector (ウェブインスペクタ)」 に、「Color Selector (カラーセレクター)」、「Color Doctor (カラードクター)」 を加えた、3つのソフトウェアからなる、アク

    富士通アクセシビリティ・アシスタンスが提供終了。感謝と共に代替手段も紹介してみる
    kyaido
    kyaido 2013/08/19
  • CSS Flexible Box (Flexbox) を使ってみよう - 最新仕様対応版 | WWW WATCH

    スクリーンサイズや可変するウィンドウサイズなどに柔軟に対応するレイアウトが可能な CSS Flexible Box について、最新の W3C 仕様に基づいた解説をサンプルソースを使いながらやってみます。 CSS3 のモジュールとして策定されている CSS Flexible Box (CSS3 Flexbox) は、CSS によるレイアウトを実現するための仕組み。 レイアウトのための CSS プロパティは他にもありますが、CSS Flexible Box は特にスクリーンサイズや可変するウィンドウサイズなどに柔軟に対応した、その名の通りフレキシブルなレイアウトが可能です。 現在最新の仕様書は下記。2012年 9月 18日付けで勧告候補になっています。 CSS Flexible Box Layout Module - W3C Candidate Recommendation, 18 Septe

    CSS Flexible Box (Flexbox) を使ってみよう - 最新仕様対応版 | WWW WATCH
    kyaido
    kyaido 2013/07/22
  • 改行削除するくらいなら gzip したらいいじゃない

    CSSJavaScript ファイルなどを gzip 圧縮して転送量の削減や Web サイト表示速度の向上を実現する方法を解説。既存 Web サイトのソースには一切手を加えない方法でまとめています。おまけでキャッシュ関連の記述もあり。 いや、1バイトの無駄もゆるせねぇんだよとか、難読化したいとかなら別にやればいいんですけど、CSSJavaScript ファイルの改行やスペースを削除しただけでファイル容量圧縮、読み込み速ーい的なこという人がいるので今さらですが書いてみます。すでに色々なところで書かれてるのでかぶるのは承知の上で。 改行や無駄なスペースなどを削除すること自体が悪いと言ってるわけではありませんのでその辺は誤解ないようにお願いします。ただ、gzip 使って圧縮するのに比べたら、改行削除して削れるファイルサイズなんて微々たるものです。もちろん、両方やれば最大限ファイルサイ

    改行削除するくらいなら gzip したらいいじゃない
  • HTML5 でやりがちな間違い

    HTML5 Doctor で 「Avoiding common HTML5 mistakes」 という記事が上がっていましたので稚拙ではありますが翻訳など。HTML5 でマークアップする際にやりがちな間違いをいくつか挙げて、さらに正しいマークアップ例も紹介くれていますので、参考にしてみてはいかがでしょうか。 HTML5 Doctor で 「Avoiding common HTML5 mistakes」 という記事が上がっていましたので稚拙ではありますが翻訳など。HTML5 でマークアップする際にやりがちな間違いをいくつか挙げて、さらに正しいマークアップ例も紹介くれていますので、参考にしてみてはいかがでしょうか。 Avoiding common HTML5 mistakes : HTML5 Doctor 翻訳といっても要約みたいな感じですので、書いてあることをそのまま日語にしたものではあり

    HTML5 でやりがちな間違い