email/templates/examples/teams.html

ID:: email/templates/examples/teams.html
Automated score:: 56.3
URL:: https://stackoverflow.design/email/templates/examples/teams.html

14 violations: Light: 3Dark: 3HC Light: 4HC Dark: 4

aria-hidden-focus

Light Serious Go to issue aria-hidden-focus-light

Ensure aria-hidden elements are not focusable nor contain focusable elements. ARIA hidden element must not be focusable or contain focusable elements. Help URL

HTML

<table aria-hidden="true" border="0" cellpadding="0" cellspacing="0" role="presentation" style="max-width:680px; width:100%">

Target

.email-container > table[aria-hidden="true"]

Summary

Fix all of the following:

Focusable content should have tabindex="-1" or be removed from the DOM

aria-hidden-focus

Dark Serious Go to issue aria-hidden-focus-dark

Ensure aria-hidden elements are not focusable nor contain focusable elements. ARIA hidden element must not be focusable or contain focusable elements. Help URL

HTML

<table aria-hidden="true" border="0" cellpadding="0" cellspacing="0" role="presentation" style="max-width:680px; width:100%">

Target

.email-container > table[aria-hidden="true"]

Summary

Fix all of the following:

Focusable content should have tabindex="-1" or be removed from the DOM

aria-hidden-focus

HC Light Serious Go to issue aria-hidden-focus-light-highcontrast

Ensure aria-hidden elements are not focusable nor contain focusable elements. ARIA hidden element must not be focusable or contain focusable elements. Help URL

HTML

<table aria-hidden="true" border="0" cellpadding="0" cellspacing="0" role="presentation" style="max-width:680px; width:100%">

Target

.email-container > table[aria-hidden="true"]

Summary

Fix all of the following:

Focusable content should have tabindex="-1" or be removed from the DOM

aria-hidden-focus

HC Dark Serious Go to issue aria-hidden-focus-dark-highcontrast

Ensure aria-hidden elements are not focusable nor contain focusable elements. ARIA hidden element must not be focusable or contain focusable elements. Help URL

HTML

<table aria-hidden="true" border="0" cellpadding="0" cellspacing="0" role="presentation" style="max-width:680px; width:100%">

Target

.email-container > table[aria-hidden="true"]

Summary

Fix all of the following:

Focusable content should have tabindex="-1" or be removed from the DOM

color-contrast-enhanced

HC Light Serious Go to issue color-contrast-enhanced-light-highcontrast

Ensure the contrast between foreground and background colors meets WCAG 2 AAA enhanced contrast ratio thresholds. Elements must meet enhanced color contrast ratio thresholds. Help URL

HTML

<a href="https://stackoverflow.blog/2018/05/03/stack-overflow-for-teams-is-now-available" style="color: #0077CC; text-decoration: none;">read our blog post</a>

Target

td:nth-child(2) > a

Summary

Fix any of the following:

Element has insufficient color contrast of 4.65 (foreground color: #0077cc, background color: #ffffff, font size: 11.3pt (15px), font weight: normal). Expected contrast ratio of 7:1

color-contrast-enhanced

HC Dark Serious Go to issue color-contrast-enhanced-dark-highcontrast

Ensure the contrast between foreground and background colors meets WCAG 2 AAA enhanced contrast ratio thresholds. Elements must meet enhanced color contrast ratio thresholds. Help URL

HTML

<a href="https://stackoverflow.blog/2018/05/03/stack-overflow-for-teams-is-now-available" style="color: #0077CC; text-decoration: none;">read our blog post</a>

Target

td:nth-child(2) > a

Summary

Fix any of the following:

Element has insufficient color contrast of 4.65 (foreground color: #0077cc, background color: #ffffff, font size: 11.3pt (15px), font weight: normal). Expected contrast ratio of 7:1

document-title

Light Serious Go to issue document-title-light

Ensure each HTML document contains a non-empty <title> element. Documents must have <title> element to aid in navigation. Help URL

HTML

<html lang="en" xmlns="http://www.w3.org/1999/xhtml" xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:v="urn:schemas-microsoft-com:vml">

Target

html

Summary

Fix any of the following:

Document does not have a non-empty <title> element

document-title

Dark Serious Go to issue document-title-dark

Ensure each HTML document contains a non-empty <title> element. Documents must have <title> element to aid in navigation. Help URL

HTML

<html lang="en" xmlns="http://www.w3.org/1999/xhtml" xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:v="urn:schemas-microsoft-com:vml">

Target

html

Summary

Fix any of the following:

Document does not have a non-empty <title> element

document-title

HC Light Serious Go to issue document-title-light-highcontrast

Ensure each HTML document contains a non-empty <title> element. Documents must have <title> element to aid in navigation. Help URL

HTML

<html lang="en" xmlns="http://www.w3.org/1999/xhtml" xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:v="urn:schemas-microsoft-com:vml">

Target

html

Summary

Fix any of the following:

Document does not have a non-empty <title> element

document-title

HC Dark Serious Go to issue document-title-dark-highcontrast

Ensure each HTML document contains a non-empty <title> element. Documents must have <title> element to aid in navigation. Help URL

HTML

<html lang="en" xmlns="http://www.w3.org/1999/xhtml" xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:v="urn:schemas-microsoft-com:vml">

Target

html

Summary

Fix any of the following:

Document does not have a non-empty <title> element

link-in-text-block

Light Serious Go to issue link-in-text-block-light

Ensure links are distinguished from surrounding text in a way that does not rely on color. Links must be distinguishable without relying on color. Help URL

HTML

<a href="https://stackoverflow.blog/2018/05/03/stack-overflow-for-teams-is-now-available" style="color: #0077CC; text-decoration: none;">read our blog post</a>

Target

td:nth-child(2) > a

Summary

Fix any of the following:

The link has insufficient color contrast of 1.51:1 with the surrounding text. (Minimum contrast is 3:1, link text: #0077cc, surrounding text: #54595f)
The link has no styling (such as underline) to distinguish it from the surrounding text

link-in-text-block

Dark Serious Go to issue link-in-text-block-dark

Ensure links are distinguished from surrounding text in a way that does not rely on color. Links must be distinguishable without relying on color. Help URL

HTML

<a href="https://stackoverflow.blog/2018/05/03/stack-overflow-for-teams-is-now-available" style="color: #0077CC; text-decoration: none;">read our blog post</a>

Target

td:nth-child(2) > a

Summary

Fix any of the following:

The link has insufficient color contrast of 1.51:1 with the surrounding text. (Minimum contrast is 3:1, link text: #0077cc, surrounding text: #54595f)
The link has no styling (such as underline) to distinguish it from the surrounding text

link-in-text-block

HC Light Serious Go to issue link-in-text-block-light-highcontrast

Ensure links are distinguished from surrounding text in a way that does not rely on color. Links must be distinguishable without relying on color. Help URL

HTML

<a href="https://stackoverflow.blog/2018/05/03/stack-overflow-for-teams-is-now-available" style="color: #0077CC; text-decoration: none;">read our blog post</a>

Target

td:nth-child(2) > a

Summary

Fix any of the following:

The link has insufficient color contrast of 1.51:1 with the surrounding text. (Minimum contrast is 3:1, link text: #0077cc, surrounding text: #54595f)
The link has no styling (such as underline) to distinguish it from the surrounding text

link-in-text-block

HC Dark Serious Go to issue link-in-text-block-dark-highcontrast

Ensure links are distinguished from surrounding text in a way that does not rely on color. Links must be distinguishable without relying on color. Help URL

HTML

<a href="https://stackoverflow.blog/2018/05/03/stack-overflow-for-teams-is-now-available" style="color: #0077CC; text-decoration: none;">read our blog post</a>

Target

td:nth-child(2) > a

Summary

Fix any of the following:

The link has insufficient color contrast of 1.51:1 with the surrounding text. (Minimum contrast is 3:1, link text: #0077cc, surrounding text: #54595f)
The link has no styling (such as underline) to distinguish it from the surrounding text