Moristapaper

:visited

March 13, 2018

CSS には :visited 擬似クラスというものがある。 ユーザーが既に訪問済みのリンクにマッチするセレクタで、そのリンクが訪問済みであることを視覚的に知らせるために使われる。 ブラウザのデフォルトスタイルシートの中にも、未訪問のリンクは青色、訪問済みのものは紫色になっているものが多く、ウェブブラウジングをよくしている人には既にメンタルモデルが形成されていると思う。

自分は :visited がサイトのユーザビリティの向上に寄与しているのかについては懐疑的で、それゆえこのブログでも :visited のスタイルを指定していない。

Picostyle v1.0.0 | Moristapaper

上記はこのブログの前回のエントリーへのリンクだが、テキストからリンク先が Moristapaper の Picostyle v1.0.0 の記事であることが推測できる。 その記事を読んだことがあり、内容を覚えている人は訪問する必要がないかもしれない。 また、リンクのテキストからその記事の内容を想起できなかった人には、訪問すると有意義な情報が得られるかもしれない。

このとき、リンク先の内容を記憶していること、またはそれを思い出せるかどうかが重要あり、訪問済みかがわかることは「ユーザーにとって価値のある情報を得られるかどうか」のユーザビリティに直結しないと考えた。リンク先が訪問済みであることがわかっても、ユーザーが内容に覚えがなければその視覚表現に意味がない。

詰まるところ、以下のようなマークアップはしないように心がけようと思った。

<p>
  詳しくは<a href="http://example.com">こちら</a>!
</p>

morishitter

プログラミングもするデザイナー / StylefmtPicostyle の作者 / CSS チョットデキル