<\/a>Subject<\/h2>\r\nInclude a descriptive, unique subject line to guide assistive technology and help recipients understand purpose.\r\n<\/a>Accessible Fonts and Style<\/h2>\r\n\r\n \t- Use automatic colour combinations (black text on white background, white text on black background).\r\n
\r\n \t- Ensure any other colours used have a contrast of at least 4.5:1 against the background.<\/li>\r\n<\/ul>\r\n<\/li>\r\n \t
- Do not rely on colour alone to convey information.<\/li>\r\n \t
- Use readable fonts that are sans-serif or basic serif and at least 12 point size.<\/li>\r\n \t
- Avoid excessive use of italics, bold, or all caps.<\/li>\r\n \t
- Reserve underline for hyperlink text.<\/li>\r\n<\/ul>\r\nReview font accessibility best practices.<\/a>\r\n
<\/a>Links<\/h2>\r\nUse meaningful hyperlink text in place of bare URLs.\r\n\r\n\r\n\r\nFor Outlook on the web:\r\n\r\n \t- Type descriptive, unique text for the link destination.<\/li>\r\n \t
- Select the text.<\/li>\r\n \t
- Select the Insert Link<\/strong>\u00a0button on the formatting toolbar or press CTRL + K<\/strong>\/CMD + K<\/strong>\u00a0on macOS.<\/li>\r\n \t
- Selected text is in the\u00a0Display as<\/strong> field.<\/li>\r\n \t
- Paste the URL in the address dialog.<\/li>\r\n<\/ol>\r\n<\/div>\r\n\r\n\r\nFor Outlook on desktop:\r\n
\r\n \t- Type descriptive, unique text for the link destination.<\/li>\r\n \t
- Select the text.<\/li>\r\n \t
- Right click and select Link<\/strong>\u00a0or press CTRL + K\/CMD + K<\/strong>\u00a0on macOS.<\/strong><\/li>\r\n \t
- The text you selected is displayed in the Text to display<\/strong> field.<\/li>\r\n \t
- Paste the URL in the address dialog.<\/li>\r\n<\/ol>\r\n<\/div>\r\n<\/div>\r\nAvoid pasting raw URLs in your emails as these are difficult for users of assistive technology to consume and do not provide meaningful information about the link destination.<\/div>\r\nConsult accessible links chapter<\/a> for more information.\r\n
<\/a>Alternative Text<\/h2>\r\nAdd alt text to images so that recipients who cannot view the image can determine its purpose and context.\r\n\r\n\r\n\r\nFor Outlook on the web:\r\n\r\n \t- Right click on an image and select Add Alternate Text<\/strong>.<\/li>\r\n \t
- Type your description and click OK<\/strong>.<\/li>\r\n<\/ol>\r\n<\/div>\r\n\r\n\r\nFor Outlook on desktop:>\r\n
\r\n \t- Right click on an image and select Edit Alt Text<\/strong>.<\/li>\r\n \t
- Type your description in the dialog.<\/li>\r\n<\/ol>\r\n<\/div>\r\n<\/div>\r\nReview the alt text quick start guide<\/a> and subsequent chapters for more details about alt text.<\/div>\r\n
<\/a>Plain Language<\/h2>\r\nUse clear, concise language.\r\n\r\n \t- Avoid assuming recipients' knowledge.<\/li>\r\n \t
- Explain abbreviations, initialisms, and acronyms.<\/li>\r\n \t
- Make clear requests.<\/li>\r\n \t
- Provide summaries of long emails.<\/li>\r\n<\/ul>\r\nLearn more about plain language.<\/a>\r\n
<\/a>Structure<\/h2>\r\nWhile HTML emails support headings<\/a> (and should be included in long emails that have distinct sections), when adding headings consider if email is the most appropriate document format for such dense material.\r\n\r\nUse built-in tools for lists, tables, alignment, and indents.\r\n<\/a>Accessibility Checker<\/h2>\r\n![\"\"](\"https:\/\/pressbooks.bccampus.ca\/accessibilityhandbook\/wp-content\/uploads\/sites\/1155\/2021\/10\/Outlook-CheckAccessibility.png\")
Outlook on the web includes an accessibility checker. Select the three dot icon on the Send\/Discard toolbar and choose Check accessibility.<\/strong>\r\n\r\nThe Check accessibility tool will note colour contrast issues, missing table headers, and images without alt text.\r\n\r\nLearn more about Outlook accessibility settings<\/a> here.\r\n<\/div>\r\n\r\nFurther Resources<\/p>\r\n\r\n<\/header>\r\n
\r\n\r\nConsider the Microsoft guide to Outlook accessibility.<\/a> The website should responsively display information based on your device, but you can also switch tabs (Windows, Web, MacOS, iOS, Android) to see specifics for your device(s).\r\n\r\nWhen creating email lists, newsletters, or email campaigns, use the checker on accessible-email.org<\/a> to ensure content is accessible.\r\n\r\n<\/div>\r\n<\/div>","rendered":"![\"\"](\"https:\/\/pressbooks.bccampus.ca\/accessibilityhandbook\/wp-content\/uploads\/sites\/1155\/2021\/10\/Microsoft_Office_Outlook_2018\u2013present.svg_-300x279.png\")
Crafting accessible emails helps ensure communication is readable by all recipients. The instructions below are specific to Outlook, but the principles apply to all email clients.<\/p>\n
On this page<\/strong><\/p>\n\n- Subject<\/a><\/li>\n
- Fonts and Style<\/a><\/li>\n
- Links<\/a><\/li>\n
- Alternative Text<\/a><\/li>\n
- Plain Language<\/a><\/li>\n
- Structure<\/a><\/li>\n
- Accessibility Checker<\/a><\/li>\n<\/ol>\n
<\/a>Subject<\/h2>\nInclude a descriptive, unique subject line to guide assistive technology and help recipients understand purpose.<\/p>\n
<\/a>Accessible Fonts and Style<\/h2>\n\n- Use automatic colour combinations (black text on white background, white text on black background).\n
\n- Ensure any other colours used have a contrast of at least 4.5:1 against the background.<\/li>\n<\/ul>\n<\/li>\n
- Do not rely on colour alone to convey information.<\/li>\n
- Use readable fonts that are sans-serif or basic serif and at least 12 point size.<\/li>\n
- Avoid excessive use of italics, bold, or all caps.<\/li>\n
- Reserve underline for hyperlink text.<\/li>\n<\/ul>\n
Review font accessibility best practices.<\/a><\/p>\n<\/a>Links<\/h2>\nUse meaningful hyperlink text in place of bare URLs.<\/p>\n
\n\nFor Outlook on the web:<\/p>\n
\n- Type descriptive, unique text for the link destination.<\/li>\n
- Select the text.<\/li>\n
- Select the Insert Link<\/strong>\u00a0button on the formatting toolbar or press CTRL + K<\/strong>\/CMD + K<\/strong>\u00a0on macOS.<\/li>\n
- Selected text is in the\u00a0Display as<\/strong> field.<\/li>\n
- Paste the URL in the address dialog.<\/li>\n<\/ol>\n<\/div>\n\n
For Outlook on desktop:<\/p>\n
\n- Type descriptive, unique text for the link destination.<\/li>\n
- Select the text.<\/li>\n
- Right click and select Link<\/strong>\u00a0or press CTRL + K\/CMD + K<\/strong>\u00a0on macOS.<\/strong><\/li>\n
- The text you selected is displayed in the Text to display<\/strong> field.<\/li>\n
- Paste the URL in the address dialog.<\/li>\n<\/ol>\n<\/div>\n<\/div>\nAvoid pasting raw URLs in your emails as these are difficult for users of assistive technology to consume and do not provide meaningful information about the link destination.<\/div>\n
Consult accessible links chapter<\/a> for more information.<\/p>\n<\/a>Alternative Text<\/h2>\nAdd alt text to images so that recipients who cannot view the image can determine its purpose and context.<\/p>\n
\n\nFor Outlook on the web:<\/p>\n
\n- Right click on an image and select Add Alternate Text<\/strong>.<\/li>\n
- Type your description and click OK<\/strong>.<\/li>\n<\/ol>\n<\/div>\n\n
For Outlook on desktop:><\/p>\n
\n- Right click on an image and select Edit Alt Text<\/strong>.<\/li>\n
- Type your description in the dialog.<\/li>\n<\/ol>\n<\/div>\n<\/div>\nReview the alt text quick start guide<\/a> and subsequent chapters for more details about alt text.<\/div>\n
<\/a>Plain Language<\/h2>\nUse clear, concise language.<\/p>\n
\n- Avoid assuming recipients’ knowledge.<\/li>\n
- Explain abbreviations, initialisms, and acronyms.<\/li>\n
- Make clear requests.<\/li>\n
- Provide summaries of long emails.<\/li>\n<\/ul>\n
Learn more about plain language.<\/a><\/p>\n<\/a>Structure<\/h2>\nWhile HTML emails support headings<\/a> (and should be included in long emails that have distinct sections), when adding headings consider if email is the most appropriate document format for such dense material.<\/p>\nUse built-in tools for lists, tables, alignment, and indents.<\/p>\n
<\/a>Accessibility Checker<\/h2>\nOutlook on the web includes an accessibility checker. Select the three dot icon on the Send\/Discard toolbar and choose Check accessibility.<\/strong><\/p>\nThe Check accessibility tool will note colour contrast issues, missing table headers, and images without alt text.<\/p>\n
Learn more about Outlook accessibility settings<\/a> here.<\/p>\n<\/div>\n\n\nFurther Resources<\/p>\n<\/header>\n
- \r\n \t
- Use automatic colour combinations (black text on white background, white text on black background).\r\n
- \r\n \t
- Ensure any other colours used have a contrast of at least 4.5:1 against the background.<\/li>\r\n<\/ul>\r\n<\/li>\r\n \t
- Do not rely on colour alone to convey information.<\/li>\r\n \t
- Use readable fonts that are sans-serif or basic serif and at least 12 point size.<\/li>\r\n \t
- Avoid excessive use of italics, bold, or all caps.<\/li>\r\n \t
- Reserve underline for hyperlink text.<\/li>\r\n<\/ul>\r\nReview font accessibility best practices.<\/a>\r\n
<\/a>Links<\/h2>\r\nUse meaningful hyperlink text in place of bare URLs.\r\n
\r\n\r\n\r\nFor Outlook on the web:\r\n- \r\n \t
- Type descriptive, unique text for the link destination.<\/li>\r\n \t
- Select the text.<\/li>\r\n \t
- Select the Insert Link<\/strong>\u00a0button on the formatting toolbar or press CTRL + K<\/strong>\/CMD + K<\/strong>\u00a0on macOS.<\/li>\r\n \t
- Selected text is in the\u00a0Display as<\/strong> field.<\/li>\r\n \t
- Paste the URL in the address dialog.<\/li>\r\n<\/ol>\r\n<\/div>\r\n
\r\n\r\nFor Outlook on desktop:\r\n- \r\n \t
- Type descriptive, unique text for the link destination.<\/li>\r\n \t
- Select the text.<\/li>\r\n \t
- Right click and select Link<\/strong>\u00a0or press CTRL + K\/CMD + K<\/strong>\u00a0on macOS.<\/strong><\/li>\r\n \t
- The text you selected is displayed in the Text to display<\/strong> field.<\/li>\r\n \t
- Paste the URL in the address dialog.<\/li>\r\n<\/ol>\r\n<\/div>\r\n<\/div>\r\n
Avoid pasting raw URLs in your emails as these are difficult for users of assistive technology to consume and do not provide meaningful information about the link destination.<\/div>\r\nConsult accessible links chapter<\/a> for more information.\r\n<\/a>Alternative Text<\/h2>\r\nAdd alt text to images so that recipients who cannot view the image can determine its purpose and context.\r\n
\r\n\r\n\r\nFor Outlook on the web:\r\n- \r\n \t
- Right click on an image and select Add Alternate Text<\/strong>.<\/li>\r\n \t
- Type your description and click OK<\/strong>.<\/li>\r\n<\/ol>\r\n<\/div>\r\n
\r\n\r\nFor Outlook on desktop:>\r\n- \r\n \t
- Right click on an image and select Edit Alt Text<\/strong>.<\/li>\r\n \t
- Type your description in the dialog.<\/li>\r\n<\/ol>\r\n<\/div>\r\n<\/div>\r\n
Review the alt text quick start guide<\/a> and subsequent chapters for more details about alt text.<\/div>\r\n<\/a>Plain Language<\/h2>\r\nUse clear, concise language.\r\n
- \r\n \t
- Avoid assuming recipients' knowledge.<\/li>\r\n \t
- Explain abbreviations, initialisms, and acronyms.<\/li>\r\n \t
- Make clear requests.<\/li>\r\n \t
- Provide summaries of long emails.<\/li>\r\n<\/ul>\r\nLearn more about plain language.<\/a>\r\n
<\/a>Structure<\/h2>\r\nWhile HTML emails support headings<\/a> (and should be included in long emails that have distinct sections), when adding headings consider if email is the most appropriate document format for such dense material.\r\n\r\nUse built-in tools for lists, tables, alignment, and indents.\r\n
<\/a>Accessibility Checker<\/h2>\r\n
Outlook on the web includes an accessibility checker. Select the three dot icon on the Send\/Discard toolbar and choose Check accessibility.<\/strong>\r\n\r\nThe Check accessibility tool will note colour contrast issues, missing table headers, and images without alt text.\r\n\r\nLearn more about Outlook accessibility settings<\/a> here.\r\n<\/div>\r\n\r\n Further Resources<\/p>\r\n\r\n<\/header>\r\n
\r\n\r\nConsider the Microsoft guide to Outlook accessibility.<\/a> The website should responsively display information based on your device, but you can also switch tabs (Windows, Web, MacOS, iOS, Android) to see specifics for your device(s).\r\n\r\nWhen creating email lists, newsletters, or email campaigns, use the checker on accessible-email.org<\/a> to ensure content is accessible.\r\n\r\n<\/div>\r\n<\/div>","rendered":"Crafting accessible emails helps ensure communication is readable by all recipients. The instructions below are specific to Outlook, but the principles apply to all email clients.<\/p>\nOn this page<\/strong><\/p>\n
- \n
- Subject<\/a><\/li>\n
- Fonts and Style<\/a><\/li>\n
- Links<\/a><\/li>\n
- Alternative Text<\/a><\/li>\n
- Plain Language<\/a><\/li>\n
- Structure<\/a><\/li>\n
- Accessibility Checker<\/a><\/li>\n<\/ol>\n
<\/a>Subject<\/h2>\n
Include a descriptive, unique subject line to guide assistive technology and help recipients understand purpose.<\/p>\n
<\/a>Accessible Fonts and Style<\/h2>\n
- \n
- Use automatic colour combinations (black text on white background, white text on black background).\n
- \n
- Ensure any other colours used have a contrast of at least 4.5:1 against the background.<\/li>\n<\/ul>\n<\/li>\n
- Do not rely on colour alone to convey information.<\/li>\n
- Use readable fonts that are sans-serif or basic serif and at least 12 point size.<\/li>\n
- Avoid excessive use of italics, bold, or all caps.<\/li>\n
- Reserve underline for hyperlink text.<\/li>\n<\/ul>\n
Review font accessibility best practices.<\/a><\/p>\n
<\/a>Links<\/h2>\n
Use meaningful hyperlink text in place of bare URLs.<\/p>\n
\n\nFor Outlook on the web:<\/p>\n
- \n
- Type descriptive, unique text for the link destination.<\/li>\n
- Select the text.<\/li>\n
- Select the Insert Link<\/strong>\u00a0button on the formatting toolbar or press CTRL + K<\/strong>\/CMD + K<\/strong>\u00a0on macOS.<\/li>\n
- Selected text is in the\u00a0Display as<\/strong> field.<\/li>\n
- Paste the URL in the address dialog.<\/li>\n<\/ol>\n<\/div>\n
\nFor Outlook on desktop:<\/p>\n
- \n
- Type descriptive, unique text for the link destination.<\/li>\n
- Select the text.<\/li>\n
- Right click and select Link<\/strong>\u00a0or press CTRL + K\/CMD + K<\/strong>\u00a0on macOS.<\/strong><\/li>\n
- The text you selected is displayed in the Text to display<\/strong> field.<\/li>\n
- Paste the URL in the address dialog.<\/li>\n<\/ol>\n<\/div>\n<\/div>\n
Avoid pasting raw URLs in your emails as these are difficult for users of assistive technology to consume and do not provide meaningful information about the link destination.<\/div>\nConsult accessible links chapter<\/a> for more information.<\/p>\n
<\/a>Alternative Text<\/h2>\n
Add alt text to images so that recipients who cannot view the image can determine its purpose and context.<\/p>\n
\n\nFor Outlook on the web:<\/p>\n
- \n
- Right click on an image and select Add Alternate Text<\/strong>.<\/li>\n
- Type your description and click OK<\/strong>.<\/li>\n<\/ol>\n<\/div>\n
\nFor Outlook on desktop:><\/p>\n
- \n
- Right click on an image and select Edit Alt Text<\/strong>.<\/li>\n
- Type your description in the dialog.<\/li>\n<\/ol>\n<\/div>\n<\/div>\n
Review the alt text quick start guide<\/a> and subsequent chapters for more details about alt text.<\/div>\n<\/a>Plain Language<\/h2>\n
Use clear, concise language.<\/p>\n
- \n
- Avoid assuming recipients’ knowledge.<\/li>\n
- Explain abbreviations, initialisms, and acronyms.<\/li>\n
- Make clear requests.<\/li>\n
- Provide summaries of long emails.<\/li>\n<\/ul>\n
Learn more about plain language.<\/a><\/p>\n
<\/a>Structure<\/h2>\n
While HTML emails support headings<\/a> (and should be included in long emails that have distinct sections), when adding headings consider if email is the most appropriate document format for such dense material.<\/p>\n
Use built-in tools for lists, tables, alignment, and indents.<\/p>\n
<\/a>Accessibility Checker<\/h2>\n
Outlook on the web includes an accessibility checker. Select the three dot icon on the Send\/Discard toolbar and choose Check accessibility.<\/strong><\/p>\nThe Check accessibility tool will note colour contrast issues, missing table headers, and images without alt text.<\/p>\n
Learn more about Outlook accessibility settings<\/a> here.<\/p>\n
<\/div>\n\n\n Further Resources<\/p>\n<\/header>\n
- Type your description in the dialog.<\/li>\n<\/ol>\n<\/div>\n<\/div>\n
- Type your description and click OK<\/strong>.<\/li>\n<\/ol>\n<\/div>\n
- The text you selected is displayed in the Text to display<\/strong> field.<\/li>\n
- Selected text is in the\u00a0Display as<\/strong> field.<\/li>\n
- Fonts and Style<\/a><\/li>\n
- Subject<\/a><\/li>\n
- Type your description in the dialog.<\/li>\r\n<\/ol>\r\n<\/div>\r\n<\/div>\r\n
- Type your description and click OK<\/strong>.<\/li>\r\n<\/ol>\r\n<\/div>\r\n
- The text you selected is displayed in the Text to display<\/strong> field.<\/li>\r\n \t
- Selected text is in the\u00a0Display as<\/strong> field.<\/li>\r\n \t