YouTip LogoYouTip

Quality Readability

# Web Quality - Readability * * * Proper use of fonts and colors can make your website more readable. * * * ## Pay Attention to Color Contrast For people with poor eyesight or on poor display devices, black text on white or white text on black is optimal. Grey text on a light background has poor contrast: Grey text on a white background (#EEEEEE) Grey text on a white background (#CCCCCC) Grey text on a white background (#AAAAAA) Grey text on a white background (#888888) Grey text on a white background (#666666) Grey text on a white background (#444444) Grey text on a white background (#222222) Grey text on a white background (#111111) Grey text on a dark background also has poor contrast: Grey text on a black background (#222222) Grey text on a black background (#444444) Grey text on a black background (#666666) Grey text on a black background (#888888) Grey text on a black background (#AAAAAA) Grey text on a black background (#CCCCCC) Grey text on a black background (#DDDDDD) Grey text on a black background (#EEEEEE) Certain combinations - like black and red, black and blue, yellow and green - can cause eye strain: Black text on a red background Black text on a blue background Yellow text on a green background These combinations are not bad: Black text on a grey background Black text on a light blue Black text on antique white White text on dark blue * * * ## Pay Attention to Letter Spacing For readers with poor eyesight, text with tight letter spacing can be quite difficult to read. Text with moderate letter spacing is easier to read. Text with minimal spacing is hard to read. * * * ## Be Mindful of Your Line Spacing **The following line spacing is easy to read** Text with good line spacing Easier to read **The following line spacing is difficult to read** Text with small line spacing Hard to read * * * ## Avoid Fancy Fonts This font is easy to read.... This font is hard to read.... * * * ## Use Italics Sparingly Normal font is easy to read. _Italicized font is not as easy to read._
← Quality AccessibilityQuality Styles β†’