1. 「未訪問リンク」「訪問済みリンク」の区別がつかないサイト
ブラウザでリンクを開くと、「未訪問リンク」が「訪問済みリンク」となる。
「訪問済みのリンク」を判別できるように、ブラウザにはデフォルトでリンク色が設定されている。
ただし、サイトによってはブラウザのデフォルトの設定を上書きし、「未訪問リンク」と「訪問済みリンク」の区別がつかないことがる。これでは、後になってサイトをどこまで見たのか分からなくなる。
ユーザビリティやリピータの為に結構大切なa:visitedの色 | 無料SEO対策のススメ によると、
次の日また見に来てくれればどのページまで見たのかが分かると思いますが、時間を置いて再び訪問した場合には、未訪問と訪問済が一発で識別できた方が便利だと思います。（時間が空きすぎると全て未訪問扱いになります。）
Firefox では、オプション > コンテンツ > フォントと配色 > 配色設定 より、デフォルトの色を確認できる。
2. Stylish で「未訪問リンク」「訪問済みリンク」の色を設定する
Firefox, Google Chrome では、以下のアドオンを利用する。
設定の注意点は、:link、:visited、:hover、:active の記述順序とその覚え方 | jmblog.jp によると、
実はこの4つの擬似クラスの記述順序には注意が必要で、上記のように link、visited、hover、active の順番で記述しないと意図した結果にならなかったりします。
全てのサイトで有効な CSS
サイトごとに「未訪問リンク」「訪問済みリンク」色の設定が必要ないなら、以下のスタイルをインストールすれば良い。
Firefox
Firefox で Stylish を使う方法は、以下を参照
Googe Chrome
Google Chrome に Stylish をインストールした後、「未訪問リンク」「訪問済みリンク」を設定したいサイトを開く。
- Stylish のアイコンを右クリック > 「インストール済みのスタイを管理」
を選択する。
「新しいスタイルを作成」ボタンを押す。
スタイルを編集画面で、最初に適当に名前をつける。
コードに以下を記述する。
a:link { color:#0000EE; }
a:visited { color:#551A8B; }
次に、「個別指定」ボタンを押し、特定のサイトのみ有効にできる。
最後に、スタイルの保存ボタンを押す。
3. プライバシーの問題
プライバシーと :visited セレクタ - CSS | MDN
歴史的に、CSS の
:visitedセレクタは、getComputedStyle()や他の方法を使って、ユーザの履歴を調べてどのサイトが訪問されたのかを明らかにし、サイトからユーザの履歴を問い合わせることに使われてきました。
CSS の :visited に行われるプライバシー対策 | Mozilla Developer Street (modest)
長年にわたり、CSS の :visited セレクタ はユーザの履歴を取得する経路となっていました。このセレクタ自体は特に危険ではありませんが、JavaScript の
getComputedStyle()とともに使われることで、ユーザの履歴を詮索しどのサイトに訪れていたのかを知ることができるのです。そして、これらはとても素早く行われます。テストでは、1分間で 210,000 もの URL を確認できた という結果が出ています。この割合でいけば、ユーザの履歴にブルートフォースを行う(訳注: 総当たり検索でユーザの訪問済みサイトリストを取得する)ことや、最低限でも フィンガープリンティングによるユーザの識別 を行えてしまいます。ブラウザが履歴を長期間保存することもあり、ユーザの Web 上の行動をかなり把握されてしまうおそれがあります。
0コメント:
コメントを投稿