mozilla

プライバシーと :visited セレクタ

歴史的に、CSS の :visited セレクタは、getComputedStyle() や他の方法を使って、ユーザの履歴を調べてどのサイトが訪問されたのかを明らかにし、サイトからユーザの履歴を問い合わせることに使われてきました。これは手早く済ませることができ、ユーザがウェブのどこに滞在したのかを調べるだけでなく、ユーザの個性に関わる、たくさんの情報を推測することにも使えます。

この問題を緩和するために、Gecko 2 では訪問済みリンクについて取得できる情報量を制限するように変更されました。

ちょっとした善意の嘘

最初の変化は、特定の環境下で Gecko がウェブアプリケーションに嘘をつくようになることです。特に、getComputedStyle() とそれに似た element.querySelector() のような関数は常に、ユーザがページ内のどのリンクも未訪問であることを示す値を返します。

また、:visited + span のような兄弟要素を使うと、<span> はリンクが未訪問であるかのようにスタイルづけされます。

それから、稀なケースですが、リンク要素が入れ子になっており、マッチした要素が訪問情報をテスト中のリンクと異なる場合、その要素も未訪問リンクであるかのように扱われます。

訪問済みリンクの視覚的なスタイルづけを行うことはまだできますが、使えるスタイルは制限されています。訪問済みリンクに用いることができるのは次のプロパティだけです:

さらに、訪問済みリンクにセットできるプロパティであっても、未訪問リンクと訪問済みリンク間で不透明度を変えることはできません。これは、別の状況なら、rgba()hsla() のカラー値、もしくは transparent キーワードを使ってできた操作でした。

【訳注: rgba(), hsla() については、不透明度 (A) の指定が適用されないだけでRGBについては反映されます(:link で不透明度が指定されていれば、それが適用されます)。】

制限内でスタイルづけをする方法を、次の例で示します:

:link {
   outline: 1px dotted blue;
   background-color: white;
   /* The default value of background-color is 'transparent'.
      You need to specify a different value, otherwise changes on :visited don't apply */
}

:visited {
   outline-color: orange;     /* オレンジのアウトライン */
   color: yellow;             /* イエローのテキスト */
   background-color: green;   /* グリーンの背景 */
}

ウェブ開発者への影響度

全体として、ウェブ開発者にそれほど大きな影響はないでしょう。しかしながら、サイトの変更が必要になるような特殊なケースが少しだけあります:

  • 背景画像を使ってリンクをスタイルづけし、訪問済みかどうかを表示する方法はもう動作しないでしょう。訪問済みリンクのスタイルには色以外は使えないからです。
  • CSS トランジション は、訪問済みリンクではサポートされないでしょう。幸運なことに CSS トランジションは非常に新しく、この時点で利用サイトはほとんどありません。ですからこの時点ではおそらく、ほとんどの人に影響を与えないでしょう。

関連情報

ドキュメントのタグと貢献者

タグ: 
Contributors to this page: ethertank, sosleepy
最終更新者: ethertank,