タグ

ブックマーク / yuheiy.hatenablog.com (2)

  • フォーカスリングの役割とマウスユーザーに向けた対応について - yuhei blog

    ブラウザは、フォーカスされた要素を可視化するためにフォーカスリングを実装している。青や黒のフォーカスされた要素を囲う枠線のことだ。outlineプロパティで表現される。これは主に、ウェブページをキーボードで操作可能にするためにある。 例として、ウェブページ上のボタンをクリックするという場面を想定する。キーボードによる操作では、まず、Tabキーなどによってフォーカスの位置を移動させながら、フォーカスを目的の要素まで辿り着かせる必要がある。その上で、スペースキーやエンターキーによってクリックに相当するアクションを実行する、というような流れになる。このような操作を行うためには、どの要素がフォーカスされているかを、ユーザーが視覚的に認識できることが前提になる。フォーカスリングが実装されているおかげで、開発者は適切なマークアップを行うだけでフォーカスを可視化することができる。 しかしながら、マウス操

    フォーカスリングの役割とマウスユーザーに向けた対応について - yuhei blog
    glat_design
    glat_design 2017/11/21
    必要ない人には見せないべきかあ、なるほど確かに /
  • 日本語向けフォントスタックの現状 - yuhei blog

    語のウェブサイト向けのフォントスタックの現状と無難な設定についてまとめた。sans-serif、serif、system-uiのそれぞれの総称フォントファミリーに基づいて、主要な端末(WindowsMac、iOS、Android)のフォントの搭載状況を整理する。 sans-serif まず、Windowsはメイリオ一択だと考えたほうが良い。游ゴシックはWindows 8.1ではかなり細く、Windows 10でも一般的なフォントと比べると少し細いのが問題だ。ハック的に回避する方法はあるものの、積極的に採用したくはない。メイリオはWindowsユーザーにとって馴染みがあり、最も問題になりにくいフォントだと考えられるため、あえて別の選択をする必要性は低いと思う。 Yu Gothic UIという選択肢もあるが、文向きでは無さそうだ。 Macでは問題なく游ゴシックが利用できるので、ヒラギノ

    日本語向けフォントスタックの現状 - yuhei blog
    glat_design
    glat_design 2017/09/06
    デバイスフォントでやりくりする場合の指定、2017年版 /
  • 1