Contrast and accessibility in social images: beyond pretty design

Accessibility on social media sounds like a corporate website checklist, but in practice it is this: can someone with reduced vision, on a cheap phone, with brightness at minimum or in direct sunlight, read what you put on the photo? If not, a significant part of your audience never receives the message you thought you published.

Contrast: the foundation of everything else

Contrast is the luminance difference between text and background. WCAG recommends a minimum ratio of 4.5:1 for normal text. The practical rule: light text on a light photo does not read; dark text on a dark zone neither. When in doubt, add a semi-transparent layer behind the copy or change text colour.

Text size on mobile, not in Figma

A 24 px headline on a 1080 px-wide canvas can be illegible on a 320 px logical-width phone when the image scales. What matters is how it looks on the real device. For stories and reels, use fewer words and bolder typefaces.

Colour as the only signal: avoid it

"Click the green link" fails for people with colour blindness and for anyone viewing in greyscale to save battery. Combine colour with shape, position, or typographic weight.

Alt text: what the image does not say alone

Instagram, LinkedIn, and X allow alt text on posts. It does not replace good contrast inside the image, but it helps screen readers. If the critical message lives only inside the JPEG, part of your audience will never get it.

Check in real conditions (takes a minute)

Before scheduling: drop phone brightness to 30%, view the piece as a feed thumbnail, and ask someone to look without glasses if they wear them. Three quick filters that catch 80% of problems invisible in the studio.