安易にoutline: none;とか指示するんじゃないよ

久々に「リンクのアウトラインを消してくれ」っていう指示が来てモヤモヤしたので。

アウトラインとは

リンク要素をクリックした時とかに、要素の周りに出てくる点線のアレです。
最近のChromeだったらデフォルトでは青い枠とかになるのでしょうか。

このアウトラインが見えるのが気になるのか、稀に消してくれって指示が来たりします。
その場合は以下のCSSを定義するだけで削除できます。

a {
  outline: none;
}

だがちょっとまって欲しい、本当に消していいのでしょうか。
Tabキーというものを忘れていないでしょうか。

Webサイトを閲覧中、誰しもがマウスを使用しているわけじゃないんです。
Tabキーを使用してリンクをたどっていく人だっているんです。
そういう時にアウトラインが無いと、どのリンクがフォーカスされているのかがわからず、ものっそい使いづらい。

Tabキーを使用している人なんてごく少数だろうしいいんじゃない？とか思うかもしれないが、そういう人もいるんですよってことを頭の片隅において欲しいです。
どうせ小さい点線ですし、残しておいてもいいじゃないですか...。

どうしても消したい、とかいう場合はちゃんと a:focus {} の場合のスタイルを定義して欲しい...。
これを定義しておけばアウトラインが無くても、リンクがフォーカスされたことがわかるので...。