タグ

ブックマーク / uxmilk.jp (2)

  • 文字や背景にピュアブラックを使ってはいけない理由

    UX Movementの創立者、ライター。ユーザーに優しいUXデザインのスキルを読者の方が上達できるよう、UX Movementのブログを始める。 デザインにピュアブラックを使うと可読性が低くなると知っていましたか? 統計によると、「アメリカの成人の58%」がコンピュータ作業で眼精疲労を経験したことがあるそうです。デザイナーは使用する黒の色に注意を払うことで、目が疲れる可能性をある程度減らすことができます。 ピュアブラックの文字や背景 ピュアブラックの文字や背景と白の組み合わせは、ユーザーが文章を長時間読むとき目に不快感を与えることがあり、眼精疲労を招いてしまいます。 白は100%の明度であり、黒は0%の明度です。このように明度のコントラストが強いと光量に不均衡が生じ、ユーザーが明るさに順応しようとするために目が酷使されることになるのです。 この現象を実証するために、暗い部屋で明るい電灯を

    文字や背景にピュアブラックを使ってはいけない理由
    tailtame
    tailtame 2019/09/21
    背景に #efefef 落ち着く…。黒背景は逆に疲れてきついんだよなぁ(´~`) windowsのchromeのもいいけど、photoshopのUI中間カラーがいい~(`ω´)
  • HTMLとCSSのコピペですぐに実装できる見出しデザイン14選

    WEB制作で必ずと言っていいほど登場するものの1つに「見出し」があります。 そこで今回は、CSSだけで作られている見出しの中でも、実用性が高いものやCSSの最新要素を使ったものを厳選してご紹介します。コピペで簡単に実装できるので、是非使ってみてください。 飾り付きの見出し 擬似要素before、afterを使って飾りをつける見出しです。beforeとafterのcontentプロパティを変更すれば、☆や♡にすることもできます。 同じくbefore、afterを使うパターンです。transformプロパティで斜めにした長方形と長方形を重ねることで三角形を作っています。 beforeとafterを使ったシンプルな見出しです。ボーダーを指定した擬似要素の位置をpositionプロパティで指定しています。 ボーダーがある見出し キャプション付きの見出しです。シンプルなので使いやすいですが、レスポン

    HTMLとCSSのコピペですぐに実装できる見出しデザイン14選
    tailtame
    tailtame 2016/09/18
    入れ子のゴミは嫌なんだけど避けて出来るかな。svgとかcalcとか
  • 1