outline: noneをやめよう、focus-ringを使おう - yuhei blog次のようなスタイルが指定されたサイトを見かけることがある。 * { outline: none; } ボタンなどの要素をクリックしたときに、格好の悪いアウトラインが表示されてしまうのを打ち消したい、という意図だと思われる。 だが、上記のような指定をしてはいけない。サイトをキーボード操作することができなくなってしまうからだ。 クリックされたボタンはフォーカスされる。フォーカスされているということを視覚的にユーザーに伝えるためにアウトラインが表示される。キーボード操作するためには、現在のフォーカス位置が明示されている必要がある。上記のような方法によってフォーカス位置の手がかりを奪ってしまうと、キーボードユーザーにはそのサイトが利用できなくなってしまう。 とはいえ、マウスのみでサイトを利用するユーザーにとっては過剰な装飾に見えるかもしれない。マウスユーザーにとってはフォーカス位置が明示されている
デザイナーは残酷な職業
