WebAIM - Web Accessibility In Mind

E-mail List Archives

Thread: color contrast on 60pt logo letters

for

Number of posts in this thread: 12 (In chronological order)

From: Angela French
Date: Thu, Mar 28 2013 4:15PM
Subject: color contrast on 60pt logo letters
No previous message | Next message →

I've created a logo in Photoshop that uses 60pt bold block san-serif font that is orange on a white background. The color contrast checker at http://snook.ca/technical/colour_contrast/colour.html says that this fails but shows the failure for 18pt body copy. Does anyone know of a checker I might use that would take into account such large letters? The color is a gradient that runs from dark to light : efa544 to ffcd18.

Thank you for any advice.


Angela French
Internet Specialist
State Board for Community and Technical Colleges
360-704-4316
= EMAIL ADDRESS REMOVED =
http://www.checkoutacollege.com/

From: Jared Smith
Date: Thu, Mar 28 2013 4:33PM
Subject: Re: color contrast on 60pt logo letters
← Previous message | Next message →

On Thu, Mar 28, 2013 at 4:15 PM, Angela French < = EMAIL ADDRESS REMOVED = > wrote:
> Does anyone know of a checker I might use that would take into account such large letters?

I think the best one is between your ears. A quick glance and a bit of
common sense should readily indicate if the logo has sufficient
contrast or not.

If you're concerned with WCAG conformance, they treat all large text
the same, and in this case the colors would not meet the minimal
threshold for AAA. So you can either adjust the colors to meet the
threshold, or if it looks like it it has sufficient contrast, just
leave it and move on to more important matters.

Orange (particularly your shades of burnt orange) is very difficult to
fit into the WCAG requirements. I often joke that the guy that wrote
the WCAG formula was clearly not a University of Texas fan.

Jared

From: David Ashleydale
Date: Thu, Mar 28 2013 4:47PM
Subject: Re: color contrast on 60pt logo letters
← Previous message | Next message →

Hi Angela,

It's an interesting thought: since the current color contrast standard in
WCAG has different targets based on a certain font size threshold, could a
higher threshold be created with less stringent contrast requirements? The
guideline says 18 points and higher, but it does seem like the requirement
would be a little eased for 60 point text. I know there was some
experimentation and math that went into deciding on the 18 points
threshold, and the decision that it should be 4.5:1 below that font size
and 3:1 above it. I guess the same process could be done for other font
sizes. I don't recall seeing that anyone's done it, though.

David


On Thu, Mar 28, 2013 at 3:15 PM, Angela French < = EMAIL ADDRESS REMOVED = > wrote:

> I've created a logo in Photoshop that uses 60pt bold block san-serif font
> that is orange on a white background. The color contrast checker at
> http://snook.ca/technical/colour_contrast/colour.html says that this
> fails but shows the failure for 18pt body copy. Does anyone know of a
> checker I might use that would take into account such large letters? The
> color is a gradient that runs from dark to light : efa544 to ffcd18.
>
> Thank you for any advice.
>
>
> Angela French
> Internet Specialist
> State Board for Community and Technical Colleges
> 360-704-4316
> = EMAIL ADDRESS REMOVED =
> http://www.checkoutacollege.com/
>
> > > >

From: Bryan Garaventa
Date: Thu, Mar 28 2013 4:49PM
Subject: Re: color contrast on 60pt logo letters
← Previous message | Next message →

I often use the one at
https://www.ssbbartgroup.com/reference/index.php/Color_Contrast_Checker
if it's helpful.

----- Original Message -----
From: "Jared Smith" < = EMAIL ADDRESS REMOVED = >
To: "WebAIM Discussion List" < = EMAIL ADDRESS REMOVED = >
Sent: Thursday, March 28, 2013 3:33 PM
Subject: Re: [WebAIM] color contrast on 60pt logo letters


> On Thu, Mar 28, 2013 at 4:15 PM, Angela French < = EMAIL ADDRESS REMOVED = > wrote:
>> Does anyone know of a checker I might use that would take into account
>> such large letters?
>
> I think the best one is between your ears. A quick glance and a bit of
> common sense should readily indicate if the logo has sufficient
> contrast or not.
>
> If you're concerned with WCAG conformance, they treat all large text
> the same, and in this case the colors would not meet the minimal
> threshold for AAA. So you can either adjust the colors to meet the
> threshold, or if it looks like it it has sufficient contrast, just
> leave it and move on to more important matters.
>
> Orange (particularly your shades of burnt orange) is very difficult to
> fit into the WCAG requirements. I often joke that the guy that wrote
> the WCAG formula was clearly not a University of Texas fan.
>
> Jared
> > >

From: Kohn, Robbie
Date: Fri, Mar 29 2013 6:56AM
Subject: Re: color contrast on 60pt logo letters
← Previous message | Next message →

There is a nice Firefox extension available for Juicy Studio that checks for text size/color and up to WCAG 2.0 AAA

https://addons.mozilla.org/en-US/firefox/user/gez-lemon/?src=api

Download the extension to your desktop and then drag/drop onto Firefox and restart Firefox.



Robbie Ann Kohn
CGI
Senior Consultant/Accessibility & Usability
E: = EMAIL ADDRESS REMOVED =

From: James Nurthen
Date: Fri, Mar 29 2013 9:04AM
Subject: Re: color contrast on 60pt logo letters
← Previous message | Next message →

On Thu, Mar 28, 2013 at 3:33 PM, Jared Smith < = EMAIL ADDRESS REMOVED = > wrote:

> On Thu, Mar 28, 2013 at 4:15 PM, Angela French < = EMAIL ADDRESS REMOVED = > wrote:
> > Does anyone know of a checker I might use that would take into account
> such large letters?
>
> I think the best one is between your ears. A quick glance and a bit of
> common sense should readily indicate if the logo has sufficient
> contrast or not.
>
> If you're concerned with WCAG conformance, they treat all large text
> the same, and in this case the colors would not meet the minimal
> threshold for AAA. So you can either adjust the colors to meet the
> threshold, or if it looks like it it has sufficient contrast, just
> leave it and move on to more important matters.
>

Strictly speaking if you are concerned only with WCAG conformance then
logos meet WCAG whatever the contrast level as they have an exemption
within both 1.4.3 and 1.4.6

Regards,
James

From: Angela French
Date: Fri, Mar 29 2013 9:27AM
Subject: Re: color contrast on 60pt logo letters
← Previous message | Next message →

Are you referring to the WAVE toolbar or the Accessibility Toolbar?

>

From: Angela French
Date: Fri, Mar 29 2013 9:30AM
Subject: Re: color contrast on 60pt logo letters
← Previous message | Next message →

>

From: Cliff Tyllick
Date: Fri, Mar 29 2013 9:50AM
Subject: Re: color contrast on 60pt logo letters
← Previous message | Next message →

Angela, I agree with both Jared and James: First, use your best judgment; ultimately, realize that logos are exempt.

As for usability, folks who need larger text typically also need lower contrast—a white background becomes a harsh glare when viewed closely—so it's likely that if you can see it comfortably but are bit worried about low contrast it is just fine for that group.

With no hard and fast answers, perhaps you could find a few colleagues, customers, or even neighbors whose vision isn't as good as yours and see if it works for them. If it works for people who typically increase the contrast before they try to expand the size of the displayed content, then you have a real-world answer to your question.

And that's a better answer than any mathematical formula can give you.

Cliff Tyllick
AT&T Corporate Accessibility Technology Office

From: Kohn, Robbie
Date: Fri, Mar 29 2013 9:52AM
Subject: Re: color contrast on 60pt logo letters
← Previous message | Next message →

No, this is a different toolbar.



Robbie Ann Kohn
CGI
Senior Consultant/Accessibility & Usability
E: = EMAIL ADDRESS REMOVED =

From: Jonathan Metz
Date: Tue, Apr 02 2013 2:41PM
Subject: Re: color contrast on 60pt logo letters
← Previous message | Next message →

I third Jared and James (and now Cliff), though I agree with Bryan that the SSB Bart Group contrast checker is pretty awesome.

To expand on Cliff's point - if you want to see what it looks like to other people, but can't find any - you might consider installing color oracle (http://www.colororacle.org). It'll at least give you an idea of what it might look like to someone who is color blind.

Jonathan Metz

From: Cliff Tyllick < = EMAIL ADDRESS REMOVED = <mailto: = EMAIL ADDRESS REMOVED = >>
Reply-To: Cliff Tyllick < = EMAIL ADDRESS REMOVED = <mailto: = EMAIL ADDRESS REMOVED = >>, WebAIM Discussion List < = EMAIL ADDRESS REMOVED = <mailto: = EMAIL ADDRESS REMOVED = >>
Date: Friday, March 29, 2013 11:50 AM
To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = <mailto: = EMAIL ADDRESS REMOVED = >>
Subject: Re: [WebAIM] color contrast on 60pt logo letters

Angela, I agree with both Jared and James: First, use your best judgment; ultimately, realize that logos are exempt.

As for usability, folks who need larger text typically also need lower contrast—a white background becomes a harsh glare when viewed closely—so it's likely that if you can see it comfortably but are bit worried about low contrast it is just fine for that group.

With no hard and fast answers, perhaps you could find a few colleagues, customers, or even neighbors whose vision isn't as good as yours and see if it works for them. If it works for people who typically increase the contrast before they try to expand the size of the displayed content, then you have a real-world answer to your question.

And that's a better answer than any mathematical formula can give you.

Cliff Tyllick
AT&T Corporate Accessibility Technology Office



From: Angela French < = EMAIL ADDRESS REMOVED = <mailto: = EMAIL ADDRESS REMOVED = >>
To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = <mailto: = EMAIL ADDRESS REMOVED = >>
Sent: Friday, March 29, 2013 10:30 AM
Subject: Re: [WebAIM] color contrast on 60pt logo letters


From: Angela French
Date: Tue, Apr 02 2013 2:44PM
Subject: Re: color contrast on 60pt logo letters
← Previous message | No next message

Thanks, I'll check it out.

>