Skip to content

Commit

Permalink
Merge branch 'main' into patrickhlauke-techniques-lists
Browse files Browse the repository at this point in the history
  • Loading branch information
patrickhlauke committed Mar 23, 2024
2 parents c4ed66c + bf44269 commit 44277aa
Show file tree
Hide file tree
Showing 2 changed files with 4 additions and 6 deletions.
2 changes: 1 addition & 1 deletion understanding/21/non-text-contrast.html
Original file line number Diff line number Diff line change
Expand Up @@ -140,7 +140,7 @@ <h4 id="related-focus">Relationship with Focus Visible</h4>
<figure id="figure-focus-outer-green">
<img src="img/ntc-focus-outer-green.png" alt="Three blue buttons on a white background, the middle has a dark green outline outside of the botton's non-focused boundary." width="400" />
<figcaption>
The external green indicator (#008000) does contrast with the white background (#FFF) which the component is on, <strong>passing</strong> the criterion. It does not need to contrast with both the component background and the component, as visually the effect is that the button is noticeably larger, and it's not necessary for a user to be able to discern this extra border in isolation. Although this passes non-text contrast, it is not a good indicator unless it is very thick. <span class="wcag22">There is a AAA criterion in WCAG 2.2 that addresses this aspect, <a href="../22/focus-appearance.html">Focus Appearance</a></span>.
The external green indicator (#008000) does contrast with the white background (#FFF) which the component is on, <strong>passing</strong> the criterion. It does not need to contrast with both the component background and the component, as visually the effect is that the button is noticeably larger, and it's not necessary for a user to be able to discern this extra border in isolation. Although this passes non-text contrast, it is not a good indicator unless it is very thick. <span class="wcag22">There is a AAA criterion in WCAG 2.2 that addresses this aspect, <a href="focus-appearance.html">Focus Appearance</a></span>.
</figcaption>
</figure>

Expand Down
8 changes: 3 additions & 5 deletions working-examples/link-contrast/index.html
Original file line number Diff line number Diff line change
@@ -1,10 +1,8 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

<style type="text/css" media="screen">
<style>

body {
font-family: Arial, Helvetica, sans-serif;
Expand Down

0 comments on commit 44277aa

Please sign in to comment.