Latest web development tutorials

ウェブ品質の可読性

フォントや色の適切な使用は読みサイトが容易になります。


色のコントラストに注意を払います

ビジョンのために良いではありません黒と白または黒と白がベストです、人や表示装置のために良いではありません。

明るい背景に灰色のテキストは、コントラストが悪いです。

白地にグレーのテキスト(#EEEEEE)
白地にグレーのテキスト(#CCCCCC)
白地にグレーのテキスト(#AAAAAA)
白地にグレーのテキスト(#888888)
白地にグレーのテキスト(#666666)
白地にグレーのテキスト(#444444)
白地にグレーのテキスト(#222222)
白地にグレーのテキスト(#111111)

暗い背景にグレーのテキストでは、コントラストも悪いです:

黒の背景にグレーのテキスト(#222222)
黒の背景にグレーのテキスト(#444444)
黒の背景にグレーのテキスト(#666666)
黒の背景にグレーのテキスト(#888888)
黒の背景にグレーのテキスト(#AAAAAA)
黒の背景にグレーのテキスト(#CCCCCC)
黒の背景にグレーのテキスト(#DDDDDD)
黒の背景にグレーのテキスト(#EEEEEE)

このような黒と赤、黒と青、黄色や緑など - - いくつかと視覚疲労が生成されます。

赤の背景に黒のテキスト
青色の背景に黒色のテキスト
緑色の背景に黄色のテキスト

試合は悪いことではありませんでした:

灰色の背景に黒のテキスト
ライトブルーに黒のテキスト
アンティーク白地に黒のテキスト
ダークブルーに白いテキスト


文字間隔に注意を払います

読者の弱視のために、少なからず困難との手紙の比較的近い間隔は読書します。

中程度の文字間隔のテキスト読みやすいです。

困難なテキスト間隔の小さな文字が読み。


あなたの間隔を見ます

読みやすい次の間隔

テキストの良い間隔で読みやすいです

次の間隔が読み取ることは困難です

読みにくい一流小さなテキスト


ファンシーフォントを避けます

このフォントは読みやすいです....

このフォントは読みにくいです....


イタリック体の使用を最小限に抑え

通常のフォント読みやすいです。

斜体フォントが読みそう簡単ではありません。