目次を飛ばして本文へ パン屑リストへ
目次
定義
概要
方法
解説
結果
終わりに
Q & A

日本語訳:High Pass Filter

Creative Commons Licenseこの文書は、Creative Commons Licenseに則って、Tantek,Çelik様High Pass Filterを翻訳、公開しているものです。
この翻訳には、翻訳による間違いがあり得ます。正確さを要求されるのでしたら、原文をご覧ください。

どうぞ、ウェブ・スタンダードをサポートしているブラウザ、特にCSS1を完全にサポートしていると主張しているブラウザにアップグレードなさってください。

警告! これはハイパスフィルタ・システムのテストです。もしこの段落が青い背景で手前にアップグレード・メッセージがなければ、お手元のブラウザはパスしています。もしアップグレード・メッセージが手前に表示されているか、この段落が巨大な(他の段落よりかなり大きな)文字列で表示されているか、段落の背景が赤いか、段落が黄色の波線又は実線のボーダーで囲まれているかしていれば、お手元のブラウザはパスしていません。これはただのテストです。

定義

high pass filter
下方のカットオフ周波数から始まり、(理論的には)無限の周波数へ広がる伝導周波数帯を伴うフィルタ。

概要

この場合、High Pass Filterは、「最小限のしっかりしたCSS1サポートの実装から始まって(理論的には)将来のあらゆるレベルのCSSへ広がる伝達周波数帯を伴うフィルタ」です。

このページは実際上、適切にCSS1をパースする、エスケープした文字も解釈出来るブラウザのみが見ることが出来る方法で外部スタイルシート"highpass.css"に"リンク"しています。

方法

"フィルタ"のスタイルシートにリンクするだけで完了します。そのスタイルシートには、古いめのブラウザの持つパースのバグを用いて、そういったブラウザが、その中に含まれているインポートされるはずのスタイルシートを、認識するのに失敗するようなトリックが使ってあります。

<link rel="stylesheet" href="highpassfilter.css" />

そして、"highpassfilter.css"には以下の声明が含まれています:

@import "null?\"\{";
@import "highpass.css";

解説

最初の'@import'はダミーです - この規則は、単純に自在スパナ'\"\{'を含んでいます。古い目のブラウザに次の規則を認識させないようにする為です。これはボックス・モデル・ハックに用いられているメカニズムと同様です。古い目のブラウザに、選択的にスタイル命令を送る為に使っているメカニズムです。この自在スパナを使うと、古い目のブラウザは、'null?\'というスタイルシートをインポートするのだと思い込みます。もちろん、そんなスタイルシートはありません。

そして、貧弱なミスリードされたブラウザは、その続きを意味を成さないスタイル宣言の始まりと見なします(空白類はデモの手法の為に再フォーマットされています):

{  ";@import"  highpass  .  css  ";

セレクタが無く、(プロパティではなく)文字列で始まり、'highpass'というばかげたプロパティ、いい加減なピリオド'.'、'css'というもう一つのばかげたプロパティ、そして文字列';'が終了二重引用符を欠いた不完全な状態であるだけでなく、宣言自体も適切に閉じる為の右の中括弧 '}' にも欠けた状態で終わっています。

もちろん、適切にCSS1をサポートするブラウザには、単純に以下の2つのインポートされたスタイルシートが見えます:

null?"{
highpass.css

最初のスタイルシート'null?"{'は、CGIのクエリ'"{'の付いた'null'ファイルとして扱われ、効果的には空の'null'ファイルとして無視されます。

二番目のスタイルシート'highpass.css'は、その文書に意図したスタイル規則を含む、実際のスタイルシートです。

結果

このスタイルシート・インポート・フィルタ・プロセスの結果として、実在するスタイルシートの規則は以下に挙げるブラウザのみから見えるはずです:

終わりに

High Pass Filterを使ったオーサリングでは、実際のHTML文書と実際のCSSスタイルシートの両方は綺麗なままで、他のハックも自由に使用出来ます。その事を言うならまた、使用している唯一のハックは、"フィルタ"スタイルシートにきちんと治まっています。

この"ハック・フリーに近い"ことで、著者が自由に綺麗で妥当な外部CSS1スタイルシートを書くことができ、互換的にわずかなブラウザにスタイルを適用されないように解釈させることが出来ます。あなたは、いつ非適合ブラウザがスタイルを適用されていないマークアップを食わせることで、快適になるかを決定するだけです。

Q & A

Q: どうすればW3C [CSS]検証サービスを通して検証して、ハイパスフィルタをパス出来るのですか?
A: 上述の'null'ファイルに注目してください。妥当にハイパスフィルタを使用する為には、ハイパスフィルタ・スタイルシートと同じディレクトリに'null'ファイルも置いておかないといけません。
Q: もし'null'ファイルが空であれば、つまり、何もコメントを含んでおらず、例えば空白類のみであれば IE5/Mac は30秒前後ハングしてしまうのですが。
A: これは質問ではありませんね、が、情報に沿って進めましょうか。'null'ファイルがコメント/* ここにあるものは何も見えない */ を含み、皆、ヌル・ファイルと似通ったコメントを含んでいるようにする事を提案しておきます。

Valid XHTML 1.0 Strict. Valid CSS.


page top
最終更新日:2018年07月18日
Copyright © 2002-2018 ばあど All Rights Reserved.