The browser you are using is out of date and may not support all of the features of this website. Please update your browser to a modern browser that supports HTML5.

Webpage is the most accessible document type in Brightspace by D2L. While PDFs and Word/Google docs have their place in the online classroom, consider whether your document would be more suited as a web (HTML) page. For example, a journal article would probably be best left as a PDF. An assignment template would probably be best left as a Word/Google doc. However, an assignment description or topic notes would be well suited as a web (HTML) page.

Accessibility Checker makes it easier than ever to improve the accessibility of your HTML content pages. Here are simple tips to build more accessible content topics with the help of Accessibility Checker.

Run the Brightspace Accessibility Checker

The Accessibility Checker is available within the HTML Editor when you create or edit HTML content pages. It is located right beside the Spellcheck button.  You can select “Check Accessibility” anytime while editing your content:

 ACh

Check the following HTML elements and ensure they are accessible.

Use Headings Correctly

Headings allow learners with visual impairment to understand the logical structure of the page and navigate to or skip over sections. But if the page headings are only made of bold text or large font size, the screen reader cannot make sense of the hierarchy or help the users quickly go to the section they wanted.

Every page should have an H1 heading (usually the page title), then H2 Heading as the major section headings, down to H3, H4 etc. The headings also need to be used in the correct order.

How to use headings correctly

Select the text then set it to the proper heading use the Format drop-down menu. Please Do NOT skip a level:

head

If the heading levels are not in order, the Accessibility Checker will report Heading order must be sequential:

wrong h

Additionally to these tips, you can use Accessible HTML template to create new pages to achieve a consistent look and feel while maintaining the accessibility. At D2L, we recognize the needs for non-developer friendly templates. Please contact eLearning Support Services to learn more about HTML templates to be available to you.

Resources:

Lists must be formatted using the list tool

Lists convey a hierarchical content structure to screen reader users. Unordered list <ul> should be used when list items can be arranged randomly, while ordered list <ol> should be used when a sequential order is important.

How to use lists

Select/highlight the items, then choose the Unordered List icon if the order doesn’t matter:

Uno list

Or select Ordered List from the drop-down menu if it is sequential:

Od list

The Accessibility Checker will suggest to use list markup for lists if the lists were not true list:

not list

Markup Tables Appropriately

A table contains columns or rows that show the meaning of the data in the grid. Sighted user can quickly make visual association between the data and the row/column headers. However the users who cannot see the table cannot make the visual associations, they rely on the screen reader to navigate through the cells one at a time, and hear the column/row headers if the table is marked up properly. For detailed explanation, please refer to the article WebAIM – Creating Accessible Tables.

How to mark up tables

Select the cells to be marked up as a table header, select Table Cell Properties then chose Cell Type as Column Header or Row Header:

t1

Here are some common errors can be caught by the Accessibility checker:

  • Tables must have captions. How to fix: set a brief descriptive text to indicate the content of the table. This will add <caption> to within the <table> element.
  • Tables must have at least one header. How to fix: Set table header to “Header Row” or “Header Column”.
  • Table headers must be associated with cells. How to fix: Set header scope to “Row” or “Column” for simple table header, which will add scope attribute to associate header cells and data cells.

Adding Image Alternative Text

The most common accessibility issue is missing image alternative text (alt text). Alt text is read by a screen reader in place of the image, which allows the learners with visual impairment to access the information. As a requirement of HTML standard, every image must have an alt attribute.

How to enter alt text

While inserting an image within the HTML Editor, you are prompted to enter the alt text which will be automatically embedded into the HTML code (e.g. <img src="/filename.jpg"; alt="keyboard and pen" />).
The Accessibility Checker will display an error message “Images must have alternative text” if the alt text is missing, see Image 2:

im er

It will provide you the opportunity to repair the issue by adding alt text inside the Accessibility Checker report panel:

im corr

Use Color Contrast Checker

Low color contrast is another common accessibility issue. Web Content Accessibility Guidelines (WCAG) 2.0 Level AA requires a contrast ratio of 4.5:1 for normal text and 3:1 for large text.

How to check color contrast

Most of you already know there is a built-in color checker within the D2L HTML Editor. As you select a font color for your text, the color Contrast Ratio is calculated and indicates whether it conforms to the WCAG 2.0.
Based on the same principle, the Accessibility Checker can catch the following issues:

  • Large text must have a contrast ratio of at least 3:1
  • Visual presentation must have a contrast ratio of at least 4.5:1

color

GSW Website Search

×

Email Access

To login into email, please select if you are a student or Faculty/Staff

Student Email    Faculty/Staff Email   Manage Spam Quarantine (Employees)

×

Apply to GSW

Thank you for your interest in Georgia Southwestern. What would you like to apply for?

Undergraduate Admissions    Graduate Admissions    Check Admission Status

×

D2L Access

To login into D2L, please select GeorgiaView or GoView option

GeorgiaView    GoView

×

Site Login

You can use this portal to login to the GSW website.  This will allow you to make instant edits to your pages. If you do not have an account and are a GSW Faculty/Staff member please click here.

Please be sure to logout when you are done!

×