<\/a>Title<\/h2>\r\n![\"\"](\"https:\/\/pressbooks.bccampus.ca\/accessibilityhandbook\/wp-content\/uploads\/sites\/1155\/2025\/01\/WordPressBlock-Title.png\")
Each page and post must have a descriptive, brief, and unique title. Select the\u00a0Add title<\/strong> placeholder to create a title.\r\n<\/div>\r\n<\/a>Font, Colour, and Formatting<\/h2>\r\n![\"\"](\"https:\/\/pressbooks.bccampus.ca\/accessibilityhandbook\/wp-content\/uploads\/sites\/1155\/2025\/01\/WordPressBlock-Colour.png\")
Use a sans-serif font like Arial or Verdana, with black text on white backgrounds or white text on a black background. Use fonts size 16 pixels or larger.\r\n\r\nFor accessibility do not use Langara orange (#f15a22) with white. For decency do not use Langara orange with black.\r\n\r\nIf using font colours other than default, check text and background for sufficient contrast. The WordPress editor will note insufficient contrast, but if unsure check colours using the WebAIM colour contrast checker.<\/a>\r\n\r\nUse built-in tools for lists and adjusting indent.\r\n<\/div>\r\n<\/a>Headings and Structure<\/h2>\r\n![\"Screenshot](\"https:\/\/pressbooks.bccampus.ca\/accessibilityhandbook\/wp-content\/uploads\/sites\/1155\/2025\/01\/WordPressBlock-HeadingsSequence-1.png\")
Use headings to organize content. Headings should be brief (only a few words) and descriptive of the content contained below. Use heading levels in a sequential, nested structure. For example, begin with an H2 for your main point or theme. Use nested H3s for subtopics. Return to H2 for your second point with nested H3 subtopics, etc.\r\n<\/div>\r\n![\"\"](\"https:\/\/pressbooks.bccampus.ca\/accessibilityhandbook\/wp-content\/uploads\/sites\/1155\/2025\/01\/WordPressBlock-Headings-e1738128171376.png\")
To create a heading type\u00a0\/heading<\/code>.\r\n<\/div>\r\n![\"\"](\"https:\/\/pressbooks.bccampus.ca\/accessibilityhandbook\/wp-content\/uploads\/sites\/1155\/2025\/01\/WordPressBlock-HeadingPick-2.png\")
To set heading level open the H2 menu in the editor toolbar and choose the appropriate heading level.\r\n<\/div>\r\n![\"\"](\"https:\/\/pressbooks.bccampus.ca\/accessibilityhandbook\/wp-content\/uploads\/sites\/1155\/2025\/01\/WordPressBlock-HeadingsError.png\")
To review heading structure, open the Document Overview<\/strong> and move to the Outline<\/strong> tab.\r\n\r\nWordPress will note\u00a0(Incorrect heading level).<\/strong><\/em>\r\n<\/div>\r\nDo not use tables for alignment purposes, use the Columns block.\r\n<\/a>Alternative Text<\/h2>\r\n![\"\"](\"https:\/\/pressbooks.bccampus.ca\/accessibilityhandbook\/wp-content\/uploads\/sites\/1155\/2025\/01\/WordPressBlock-Alt.png\")
Graphics that contain information must have a text equivalent. Often that is provided in the Alt Text field. Alt text is code that is read aloud to screen reader software and describes the information in a graphic to blind and low vision users. Write a brief description of the graphic in the Alt Text\u00a0<\/strong>field in the Media Gallery Attachment Details panel. Learn how to write alt text<\/a>.\r\n\r\nIf an image does not include information, leave the Alt Text<\/strong> field blank.\r\n\r\nBest practice for many images, especially instructions, is to include a text equivalent to compliment and support visual information. If a graphic contains information but is accompanied by adjacent equivalent text or a descriptive figure caption, leave the Alt Text<\/strong> field blank.\r\n<\/div>\r\n![\"\"](\"https:\/\/pressbooks.bccampus.ca\/accessibilityhandbook\/wp-content\/uploads\/sites\/1155\/2025\/01\/WordPressBlock-Caption.png\")
Add a [pb_glossary id=\"9995\"]figure caption[\/pb_glossary] in the Media Gallery Attachment Details panel Caption <\/strong>field. Captions can be longer than alt text, but should be concise. Links and attributions should be in a caption, but never in alt text.\r\n<\/div>\r\nIf an image is a link, write the link destination in the Alt Text<\/strong> field.\r\n<\/a>Links<\/h2>\r\nDo not include bare URLs as they are cumbersome for assistive technology and meaningless to all. Do use \"read more\" or similar language for links as it is not meaningful.\r\n\r\nTo create accessible links:\r\n\r\n \t- Write a brief description of the link destination.<\/li>\r\n \t
- Select the text and choose the\u00a0Link<\/strong> button in the editor toolbar.\r\n
![\"\"](\"https:\/\/pressbooks.bccampus.ca\/accessibilityhandbook\/wp-content\/uploads\/sites\/1155\/2025\/01\/WordPressBlock-Link.png\")
\r\nOr, press Control<\/strong> (Command<\/strong> on macOS) k<\/strong><\/li>\r\n \t- Paste the URL and press\u00a0Enter.\r\n<\/strong>
![\"\"](\"https:\/\/pressbooks.bccampus.ca\/accessibilityhandbook\/wp-content\/uploads\/sites\/1155\/2025\/01\/WordPressBlock-Link2.png\")
<\/li>\r\n<\/ol>\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\nConsider Microsoft Word's Document Stats<\/a> for readability stats or AIOSEO Readability scores<\/a>. However, as the author you know the material best and you are smarter than a computer. Learn more about plain language.<\/a>","rendered":"
![\"\"](\"https:\/\/pressbooks.bccampus.ca\/accessibilityhandbook\/wp-content\/uploads\/sites\/1155\/2022\/07\/WordPress_blue_logo.svg_.png\")
Follow these best practices to create accessible pages and posts in the WordPress block editor.
\nOn this page<\/strong><\/p>\n\n- Title<\/a><\/li>\n
- Font, Colour, and Formatting<\/a><\/li>\n
- Headings and Structure<\/a><\/li>\n
- Alternative Text<\/a><\/li>\n
- Links<\/a><\/li>\n
- Plain Language<\/a><\/li>\n<\/ol>\n
<\/a>Title<\/h2>\nEach page and post must have a descriptive, brief, and unique title. Select the\u00a0Add title<\/strong> placeholder to create a title.<\/p>\n<\/div>\n<\/a>Font, Colour, and Formatting<\/h2>\nUse a sans-serif font like Arial or Verdana, with black text on white backgrounds or white text on a black background. Use fonts size 16 pixels or larger.<\/p>\n
For accessibility do not use Langara orange (#f15a22) with white. For decency do not use Langara orange with black.<\/p>\n
If using font colours other than default, check text and background for sufficient contrast. The WordPress editor will note insufficient contrast, but if unsure check colours using the WebAIM colour contrast checker.<\/a><\/p>\nUse built-in tools for lists and adjusting indent.<\/p>\n
<\/div>\n<\/a>Headings and Structure<\/h2>\nUse headings to organize content. Headings should be brief (only a few words) and descriptive of the content contained below. Use heading levels in a sequential, nested structure. For example, begin with an H2 for your main point or theme. Use nested H3s for subtopics. Return to H2 for your second point with nested H3 subtopics, etc.<\/p>\n
<\/div>\nTo create a heading type\u00a0\/heading<\/code>.<\/p>\n<\/div>\nTo set heading level open the H2 menu in the editor toolbar and choose the appropriate heading level.<\/p>\n
<\/div>\nTo review heading structure, open the Document Overview<\/strong> and move to the Outline<\/strong> tab.<\/p>\nWordPress will note\u00a0(Incorrect heading level).<\/strong><\/em><\/p>\n<\/div>\nDo not use tables for alignment purposes, use the Columns block.<\/p>\n
<\/a>Alternative Text<\/h2>\nGraphics that contain information must have a text equivalent. Often that is provided in the Alt Text field. Alt text is code that is read aloud to screen reader software and describes the information in a graphic to blind and low vision users. Write a brief description of the graphic in the Alt Text\u00a0<\/strong>field in the Media Gallery Attachment Details panel. Learn how to write alt text<\/a>.<\/p>\nIf an image does not include information, leave the Alt Text<\/strong> field blank.<\/p>\nBest practice for many images, especially instructions, is to include a text equivalent to compliment and support visual information. If a graphic contains information but is accompanied by adjacent equivalent text or a descriptive figure caption, leave the Alt Text<\/strong> field blank.<\/p>\n<\/div>\nAdd a figure caption<\/a> in the Media Gallery Attachment Details panel Caption <\/strong>field. Captions can be longer than alt text, but should be concise. Links and attributions should be in a caption, but never in alt text.<\/p>\n<\/div>\nIf an image is a link, write the link destination in the Alt Text<\/strong> field.<\/p>\n<\/a>Links<\/h2>\nDo not include bare URLs as they are cumbersome for assistive technology and meaningless to all. Do use “read more” or similar language for links as it is not meaningful.<\/p>\n
To create accessible links:<\/p>\n
\n- Write a brief description of the link destination.<\/li>\n
- Select the text and choose the\u00a0Link<\/strong> button in the editor toolbar.
\n
\nOr, press Control<\/strong> (Command<\/strong> on macOS) k<\/strong><\/li>\n- Paste the URL and press\u00a0Enter.
\n<\/strong><\/li>\n<\/ol>\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
Consider Microsoft Word’s Document Stats<\/a> for readability stats or AIOSEO Readability scores<\/a>. However, as the author you know the material best and you are smarter than a computer. Learn more about plain language.<\/a><\/p>\ndefinition<\/span>An image caption is text that provides supplemental context, explanation, or commentary about an image. Image captions generally appear below the image. Image captions may include comprehensive details as well as supplemental information related to the image, such as citations, photo attribution, cultural context, historical or scientific information about the subject, complex data from charts, etc. Unlike alternative text, figure captions have no length limit. Figure captions are accessible and available to all users, whereas alt text is only available to assistive technology.<\/p>\n<\/div>
<\/a>Font, Colour, and Formatting<\/h2>\r\nUse a sans-serif font like Arial or Verdana, with black text on white backgrounds or white text on a black background. Use fonts size 16 pixels or larger.\r\n\r\nFor accessibility do not use Langara orange (#f15a22) with white. For decency do not use Langara orange with black.\r\n\r\nIf using font colours other than default, check text and background for sufficient contrast. The WordPress editor will note insufficient contrast, but if unsure check colours using the WebAIM colour contrast checker.<\/a>\r\n\r\nUse built-in tools for lists and adjusting indent.\r\n<\/div>\r\n<\/a>Headings and Structure<\/h2>\r\nUse headings to organize content. Headings should be brief (only a few words) and descriptive of the content contained below. Use heading levels in a sequential, nested structure. For example, begin with an H2 for your main point or theme. Use nested H3s for subtopics. Return to H2 for your second point with nested H3 subtopics, etc.\r\n<\/div>\r\nTo create a heading type\u00a0\/heading<\/code>.\r\n<\/div>\r\nTo set heading level open the H2 menu in the editor toolbar and choose the appropriate heading level.\r\n<\/div>\r\nTo review heading structure, open the Document Overview<\/strong> and move to the Outline<\/strong> tab.\r\n\r\nWordPress will note\u00a0(Incorrect heading level).<\/strong><\/em>\r\n<\/div>\r\nDo not use tables for alignment purposes, use the Columns block.\r\n<\/a>Alternative Text<\/h2>\r\nGraphics that contain information must have a text equivalent. Often that is provided in the Alt Text field. Alt text is code that is read aloud to screen reader software and describes the information in a graphic to blind and low vision users. Write a brief description of the graphic in the Alt Text\u00a0<\/strong>field in the Media Gallery Attachment Details panel. Learn how to write alt text<\/a>.\r\n\r\nIf an image does not include information, leave the Alt Text<\/strong> field blank.\r\n\r\nBest practice for many images, especially instructions, is to include a text equivalent to compliment and support visual information. If a graphic contains information but is accompanied by adjacent equivalent text or a descriptive figure caption, leave the Alt Text<\/strong> field blank.\r\n<\/div>\r\nAdd a [pb_glossary id=\"9995\"]figure caption[\/pb_glossary] in the Media Gallery Attachment Details panel Caption <\/strong>field. Captions can be longer than alt text, but should be concise. Links and attributions should be in a caption, but never in alt text.\r\n<\/div>\r\nIf an image is a link, write the link destination in the Alt Text<\/strong> field.\r\n<\/a>Links<\/h2>\r\nDo not include bare URLs as they are cumbersome for assistive technology and meaningless to all. Do use \"read more\" or similar language for links as it is not meaningful.\r\n\r\nTo create accessible links:\r\n\r\n \t- Write a brief description of the link destination.<\/li>\r\n \t
- Select the text and choose the\u00a0Link<\/strong> button in the editor toolbar.\r\n\r\nOr, press Control<\/strong> (Command<\/strong> on macOS) k<\/strong><\/li>\r\n \t
- Paste the URL and press\u00a0Enter.\r\n<\/strong><\/li>\r\n<\/ol>\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\nConsider Microsoft Word's Document Stats<\/a> for readability stats or AIOSEO Readability scores<\/a>. However, as the author you know the material best and you are smarter than a computer. Learn more about plain language.<\/a>","rendered":"
Follow these best practices to create accessible pages and posts in the WordPress block editor.
\nOn this page<\/strong><\/p>\n\n- Title<\/a><\/li>\n
- Font, Colour, and Formatting<\/a><\/li>\n
- Headings and Structure<\/a><\/li>\n
- Alternative Text<\/a><\/li>\n
- Links<\/a><\/li>\n
- Plain Language<\/a><\/li>\n<\/ol>\n
<\/a>Title<\/h2>\nEach page and post must have a descriptive, brief, and unique title. Select the\u00a0Add title<\/strong> placeholder to create a title.<\/p>\n<\/div>\n<\/a>Font, Colour, and Formatting<\/h2>\nUse a sans-serif font like Arial or Verdana, with black text on white backgrounds or white text on a black background. Use fonts size 16 pixels or larger.<\/p>\n
For accessibility do not use Langara orange (#f15a22) with white. For decency do not use Langara orange with black.<\/p>\n
If using font colours other than default, check text and background for sufficient contrast. The WordPress editor will note insufficient contrast, but if unsure check colours using the WebAIM colour contrast checker.<\/a><\/p>\nUse built-in tools for lists and adjusting indent.<\/p>\n
<\/div>\n<\/a>Headings and Structure<\/h2>\nUse headings to organize content. Headings should be brief (only a few words) and descriptive of the content contained below. Use heading levels in a sequential, nested structure. For example, begin with an H2 for your main point or theme. Use nested H3s for subtopics. Return to H2 for your second point with nested H3 subtopics, etc.<\/p>\n
<\/div>\nTo create a heading type\u00a0\/heading<\/code>.<\/p>\n<\/div>\nTo set heading level open the H2 menu in the editor toolbar and choose the appropriate heading level.<\/p>\n
<\/div>\nTo review heading structure, open the Document Overview<\/strong> and move to the Outline<\/strong> tab.<\/p>\nWordPress will note\u00a0(Incorrect heading level).<\/strong><\/em><\/p>\n<\/div>\nDo not use tables for alignment purposes, use the Columns block.<\/p>\n
<\/a>Alternative Text<\/h2>\nGraphics that contain information must have a text equivalent. Often that is provided in the Alt Text field. Alt text is code that is read aloud to screen reader software and describes the information in a graphic to blind and low vision users. Write a brief description of the graphic in the Alt Text\u00a0<\/strong>field in the Media Gallery Attachment Details panel. Learn how to write alt text<\/a>.<\/p>\nIf an image does not include information, leave the Alt Text<\/strong> field blank.<\/p>\nBest practice for many images, especially instructions, is to include a text equivalent to compliment and support visual information. If a graphic contains information but is accompanied by adjacent equivalent text or a descriptive figure caption, leave the Alt Text<\/strong> field blank.<\/p>\n<\/div>\nAdd a figure caption<\/a> in the Media Gallery Attachment Details panel Caption <\/strong>field. Captions can be longer than alt text, but should be concise. Links and attributions should be in a caption, but never in alt text.<\/p>\n<\/div>\nIf an image is a link, write the link destination in the Alt Text<\/strong> field.<\/p>\n<\/a>Links<\/h2>\nDo not include bare URLs as they are cumbersome for assistive technology and meaningless to all. Do use “read more” or similar language for links as it is not meaningful.<\/p>\n
To create accessible links:<\/p>\n
\n- Write a brief description of the link destination.<\/li>\n
- Select the text and choose the\u00a0Link<\/strong> button in the editor toolbar.
\n
\nOr, press Control<\/strong> (Command<\/strong> on macOS) k<\/strong><\/li>\n- Paste the URL and press\u00a0Enter.
\n<\/strong><\/li>\n<\/ol>\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
Consider Microsoft Word’s Document Stats<\/a> for readability stats or AIOSEO Readability scores<\/a>. However, as the author you know the material best and you are smarter than a computer. Learn more about plain language.<\/a><\/p>\ndefinition<\/span>An image caption is text that provides supplemental context, explanation, or commentary about an image. Image captions generally appear below the image. Image captions may include comprehensive details as well as supplemental information related to the image, such as citations, photo attribution, cultural context, historical or scientific information about the subject, complex data from charts, etc. Unlike alternative text, figure captions have no length limit. Figure captions are accessible and available to all users, whereas alt text is only available to assistive technology.<\/p>\n<\/div>
<\/a>Headings and Structure<\/h2>\r\nUse headings to organize content. Headings should be brief (only a few words) and descriptive of the content contained below. Use heading levels in a sequential, nested structure. For example, begin with an H2 for your main point or theme. Use nested H3s for subtopics. Return to H2 for your second point with nested H3 subtopics, etc.\r\n<\/div>\r\nTo create a heading type\u00a0\/heading<\/code>.\r\n<\/div>\r\nTo set heading level open the H2 menu in the editor toolbar and choose the appropriate heading level.\r\n<\/div>\r\nTo review heading structure, open the Document Overview<\/strong> and move to the Outline<\/strong> tab.\r\n\r\nWordPress will note\u00a0(Incorrect heading level).<\/strong><\/em>\r\n<\/div>\r\nDo not use tables for alignment purposes, use the Columns block.\r\n<\/a>Alternative Text<\/h2>\r\nGraphics that contain information must have a text equivalent. Often that is provided in the Alt Text field. Alt text is code that is read aloud to screen reader software and describes the information in a graphic to blind and low vision users. Write a brief description of the graphic in the Alt Text\u00a0<\/strong>field in the Media Gallery Attachment Details panel. Learn how to write alt text<\/a>.\r\n\r\nIf an image does not include information, leave the Alt Text<\/strong> field blank.\r\n\r\nBest practice for many images, especially instructions, is to include a text equivalent to compliment and support visual information. If a graphic contains information but is accompanied by adjacent equivalent text or a descriptive figure caption, leave the Alt Text<\/strong> field blank.\r\n<\/div>\r\nAdd a [pb_glossary id=\"9995\"]figure caption[\/pb_glossary] in the Media Gallery Attachment Details panel Caption <\/strong>field. Captions can be longer than alt text, but should be concise. Links and attributions should be in a caption, but never in alt text.\r\n<\/div>\r\nIf an image is a link, write the link destination in the Alt Text<\/strong> field.\r\n<\/a>Links<\/h2>\r\nDo not include bare URLs as they are cumbersome for assistive technology and meaningless to all. Do use \"read more\" or similar language for links as it is not meaningful.\r\n\r\nTo create accessible links:\r\n\r\n \t- Write a brief description of the link destination.<\/li>\r\n \t
- Select the text and choose the\u00a0Link<\/strong> button in the editor toolbar.\r\n\r\nOr, press Control<\/strong> (Command<\/strong> on macOS) k<\/strong><\/li>\r\n \t
- Paste the URL and press\u00a0Enter.\r\n<\/strong><\/li>\r\n<\/ol>\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\nConsider Microsoft Word's Document Stats<\/a> for readability stats or AIOSEO Readability scores<\/a>. However, as the author you know the material best and you are smarter than a computer. Learn more about plain language.<\/a>","rendered":"
Follow these best practices to create accessible pages and posts in the WordPress block editor.
\nOn this page<\/strong><\/p>\n\n- Title<\/a><\/li>\n
- Font, Colour, and Formatting<\/a><\/li>\n
- Headings and Structure<\/a><\/li>\n
- Alternative Text<\/a><\/li>\n
- Links<\/a><\/li>\n
- Plain Language<\/a><\/li>\n<\/ol>\n
<\/a>Title<\/h2>\nEach page and post must have a descriptive, brief, and unique title. Select the\u00a0Add title<\/strong> placeholder to create a title.<\/p>\n<\/div>\n<\/a>Font, Colour, and Formatting<\/h2>\nUse a sans-serif font like Arial or Verdana, with black text on white backgrounds or white text on a black background. Use fonts size 16 pixels or larger.<\/p>\n
For accessibility do not use Langara orange (#f15a22) with white. For decency do not use Langara orange with black.<\/p>\n
If using font colours other than default, check text and background for sufficient contrast. The WordPress editor will note insufficient contrast, but if unsure check colours using the WebAIM colour contrast checker.<\/a><\/p>\nUse built-in tools for lists and adjusting indent.<\/p>\n
<\/div>\n<\/a>Headings and Structure<\/h2>\nUse headings to organize content. Headings should be brief (only a few words) and descriptive of the content contained below. Use heading levels in a sequential, nested structure. For example, begin with an H2 for your main point or theme. Use nested H3s for subtopics. Return to H2 for your second point with nested H3 subtopics, etc.<\/p>\n
<\/div>\nTo create a heading type\u00a0\/heading<\/code>.<\/p>\n<\/div>\nTo set heading level open the H2 menu in the editor toolbar and choose the appropriate heading level.<\/p>\n
<\/div>\nTo review heading structure, open the Document Overview<\/strong> and move to the Outline<\/strong> tab.<\/p>\nWordPress will note\u00a0(Incorrect heading level).<\/strong><\/em><\/p>\n<\/div>\nDo not use tables for alignment purposes, use the Columns block.<\/p>\n
<\/a>Alternative Text<\/h2>\nGraphics that contain information must have a text equivalent. Often that is provided in the Alt Text field. Alt text is code that is read aloud to screen reader software and describes the information in a graphic to blind and low vision users. Write a brief description of the graphic in the Alt Text\u00a0<\/strong>field in the Media Gallery Attachment Details panel. Learn how to write alt text<\/a>.<\/p>\nIf an image does not include information, leave the Alt Text<\/strong> field blank.<\/p>\nBest practice for many images, especially instructions, is to include a text equivalent to compliment and support visual information. If a graphic contains information but is accompanied by adjacent equivalent text or a descriptive figure caption, leave the Alt Text<\/strong> field blank.<\/p>\n<\/div>\nAdd a figure caption<\/a> in the Media Gallery Attachment Details panel Caption <\/strong>field. Captions can be longer than alt text, but should be concise. Links and attributions should be in a caption, but never in alt text.<\/p>\n<\/div>\nIf an image is a link, write the link destination in the Alt Text<\/strong> field.<\/p>\n<\/a>Links<\/h2>\nDo not include bare URLs as they are cumbersome for assistive technology and meaningless to all. Do use “read more” or similar language for links as it is not meaningful.<\/p>\n
To create accessible links:<\/p>\n
\n- Write a brief description of the link destination.<\/li>\n
- Select the text and choose the\u00a0Link<\/strong> button in the editor toolbar.
\n
\nOr, press Control<\/strong> (Command<\/strong> on macOS) k<\/strong><\/li>\n- Paste the URL and press\u00a0Enter.
\n<\/strong><\/li>\n<\/ol>\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
Consider Microsoft Word’s Document Stats<\/a> for readability stats or AIOSEO Readability scores<\/a>. However, as the author you know the material best and you are smarter than a computer. Learn more about plain language.<\/a><\/p>\ndefinition<\/span>An image caption is text that provides supplemental context, explanation, or commentary about an image. Image captions generally appear below the image. Image captions may include comprehensive details as well as supplemental information related to the image, such as citations, photo attribution, cultural context, historical or scientific information about the subject, complex data from charts, etc. Unlike alternative text, figure captions have no length limit. Figure captions are accessible and available to all users, whereas alt text is only available to assistive technology.<\/p>\n<\/div>
To create a heading type\u00a0\/heading<\/code>.\r\n<\/div>\r\nTo set heading level open the H2 menu in the editor toolbar and choose the appropriate heading level.\r\n<\/div>\r\nTo review heading structure, open the Document Overview<\/strong> and move to the Outline<\/strong> tab.\r\n\r\nWordPress will note\u00a0(Incorrect heading level).<\/strong><\/em>\r\n<\/div>\r\nDo not use tables for alignment purposes, use the Columns block.\r\n<\/a>Alternative Text<\/h2>\r\nGraphics that contain information must have a text equivalent. Often that is provided in the Alt Text field. Alt text is code that is read aloud to screen reader software and describes the information in a graphic to blind and low vision users. Write a brief description of the graphic in the Alt Text\u00a0<\/strong>field in the Media Gallery Attachment Details panel. Learn how to write alt text<\/a>.\r\n\r\nIf an image does not include information, leave the Alt Text<\/strong> field blank.\r\n\r\nBest practice for many images, especially instructions, is to include a text equivalent to compliment and support visual information. If a graphic contains information but is accompanied by adjacent equivalent text or a descriptive figure caption, leave the Alt Text<\/strong> field blank.\r\n<\/div>\r\nAdd a [pb_glossary id=\"9995\"]figure caption[\/pb_glossary] in the Media Gallery Attachment Details panel Caption <\/strong>field. Captions can be longer than alt text, but should be concise. Links and attributions should be in a caption, but never in alt text.\r\n<\/div>\r\nIf an image is a link, write the link destination in the Alt Text<\/strong> field.\r\n<\/a>Links<\/h2>\r\nDo not include bare URLs as they are cumbersome for assistive technology and meaningless to all. Do use \"read more\" or similar language for links as it is not meaningful.\r\n\r\nTo create accessible links:\r\n\r\n \t- Write a brief description of the link destination.<\/li>\r\n \t
- Select the text and choose the\u00a0Link<\/strong> button in the editor toolbar.\r\n\r\nOr, press Control<\/strong> (Command<\/strong> on macOS) k<\/strong><\/li>\r\n \t
- Paste the URL and press\u00a0Enter.\r\n<\/strong><\/li>\r\n<\/ol>\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\nConsider Microsoft Word's Document Stats<\/a> for readability stats or AIOSEO Readability scores<\/a>. However, as the author you know the material best and you are smarter than a computer. Learn more about plain language.<\/a>","rendered":"
Follow these best practices to create accessible pages and posts in the WordPress block editor.
\nOn this page<\/strong><\/p>\n\n- Title<\/a><\/li>\n
- Font, Colour, and Formatting<\/a><\/li>\n
- Headings and Structure<\/a><\/li>\n
- Alternative Text<\/a><\/li>\n
- Links<\/a><\/li>\n
- Plain Language<\/a><\/li>\n<\/ol>\n
<\/a>Title<\/h2>\nEach page and post must have a descriptive, brief, and unique title. Select the\u00a0Add title<\/strong> placeholder to create a title.<\/p>\n<\/div>\n<\/a>Font, Colour, and Formatting<\/h2>\nUse a sans-serif font like Arial or Verdana, with black text on white backgrounds or white text on a black background. Use fonts size 16 pixels or larger.<\/p>\n
For accessibility do not use Langara orange (#f15a22) with white. For decency do not use Langara orange with black.<\/p>\n
If using font colours other than default, check text and background for sufficient contrast. The WordPress editor will note insufficient contrast, but if unsure check colours using the WebAIM colour contrast checker.<\/a><\/p>\nUse built-in tools for lists and adjusting indent.<\/p>\n
<\/div>\n<\/a>Headings and Structure<\/h2>\nUse headings to organize content. Headings should be brief (only a few words) and descriptive of the content contained below. Use heading levels in a sequential, nested structure. For example, begin with an H2 for your main point or theme. Use nested H3s for subtopics. Return to H2 for your second point with nested H3 subtopics, etc.<\/p>\n
<\/div>\nTo create a heading type\u00a0\/heading<\/code>.<\/p>\n<\/div>\nTo set heading level open the H2 menu in the editor toolbar and choose the appropriate heading level.<\/p>\n
<\/div>\nTo review heading structure, open the Document Overview<\/strong> and move to the Outline<\/strong> tab.<\/p>\nWordPress will note\u00a0(Incorrect heading level).<\/strong><\/em><\/p>\n<\/div>\nDo not use tables for alignment purposes, use the Columns block.<\/p>\n
<\/a>Alternative Text<\/h2>\nGraphics that contain information must have a text equivalent. Often that is provided in the Alt Text field. Alt text is code that is read aloud to screen reader software and describes the information in a graphic to blind and low vision users. Write a brief description of the graphic in the Alt Text\u00a0<\/strong>field in the Media Gallery Attachment Details panel. Learn how to write alt text<\/a>.<\/p>\nIf an image does not include information, leave the Alt Text<\/strong> field blank.<\/p>\nBest practice for many images, especially instructions, is to include a text equivalent to compliment and support visual information. If a graphic contains information but is accompanied by adjacent equivalent text or a descriptive figure caption, leave the Alt Text<\/strong> field blank.<\/p>\n<\/div>\nAdd a figure caption<\/a> in the Media Gallery Attachment Details panel Caption <\/strong>field. Captions can be longer than alt text, but should be concise. Links and attributions should be in a caption, but never in alt text.<\/p>\n<\/div>\nIf an image is a link, write the link destination in the Alt Text<\/strong> field.<\/p>\n<\/a>Links<\/h2>\nDo not include bare URLs as they are cumbersome for assistive technology and meaningless to all. Do use “read more” or similar language for links as it is not meaningful.<\/p>\n
To create accessible links:<\/p>\n
\n- Write a brief description of the link destination.<\/li>\n
- Select the text and choose the\u00a0Link<\/strong> button in the editor toolbar.
\n
\nOr, press Control<\/strong> (Command<\/strong> on macOS) k<\/strong><\/li>\n- Paste the URL and press\u00a0Enter.
\n<\/strong><\/li>\n<\/ol>\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
Consider Microsoft Word’s Document Stats<\/a> for readability stats or AIOSEO Readability scores<\/a>. However, as the author you know the material best and you are smarter than a computer. Learn more about plain language.<\/a><\/p>\ndefinition<\/span>An image caption is text that provides supplemental context, explanation, or commentary about an image. Image captions generally appear below the image. Image captions may include comprehensive details as well as supplemental information related to the image, such as citations, photo attribution, cultural context, historical or scientific information about the subject, complex data from charts, etc. Unlike alternative text, figure captions have no length limit. Figure captions are accessible and available to all users, whereas alt text is only available to assistive technology.<\/p>\n<\/div>