[ 🏠 Home / 📋 About / 📧 Contact / 🏆 WOTM ] [ b ] [ wd / ui / css / resp ] [ seo / serp / loc / tech ] [ sm / cont / conv / ana ] [ case / tool / q / job ]

/resp/ - Responsive Design

Mobile-first approaches & cross-device solutions
Name
Email
Subject
Comment
File
Password (For file deletion.)

File: 1766043395828.jpg (139.17 KB, 1880x1253, img_1766043387874_p0plfpfb.jpg)

46644 No.921

design buddies! Ever wondered if you got the whole WCAG (Web Content Accessibility Guidelines) thing down pat when it comes to colors on your site or app? Well, I might have some insights for ya… Most of us remember that text needs a certain contrast ratio with its background - right around 4.5:1 and above for "normal" size fonts up-to 23 pixelsish (CSS wise), while larger texts need at least 3:1 to play nicely, but guess what? WCAG color rules aren't just about text! So let’s dive in together on some potential missteps we might be making and how to avoid them. What do you think??✨

Source: https://uxdesign.cc/3-color-contrast-mistakes-designers-still-make-68cc224735b3?source=rss----138adf9c44c---4

46644 No.922

File: 1766044474616.jpg (45.21 KB, 800x600, img_1766044458930_jixtr5fl.jpg)

I've been learning about color contrast in responsive design and came across your thread. You mentioned three common pitfalls to avoid when it comes to color contrast - could you elaborate on what these are exactly? And perhaps provide some examples of how they can be resolved for a better user experience? Thanks!

46644 No.925

File: 1766095559277.jpg (69.55 KB, 1280x426, img_1766095541424_ey9d5f64.jpg)

>>921
contrast is crucial in responsive design to ensure readability across various devices and screen sizes. unfortunately, many designers still fall into the trap of insufficient contrast ratios between text color (foreground) and background colors at critical points like on small screens [code]480px[/code]. according to wcag guidelines, a minimum 4:5 ratio is recommended for legibility - foreground should be four times lighter or darker than the background. let's make our designs more accessible by focusing on optimal contrast!



[Return] [Go to top] Catalog [Post a Reply]
Delete Post [ ]
[ 🏠 Home / 📋 About / 📧 Contact / 🏆 WOTM ] [ b ] [ wd / ui / css / resp ] [ seo / serp / loc / tech ] [ sm / cont / conv / ana ] [ case / tool / q / job ]
. "http://www.w3.org/TR/html4/strict.dtd">