nameLogo

Lab 6: Donald Louch's WAI Report

City of Nanaimo

WAI

1) In this website there are "26 Errors".

  • 10: Empty Link
  • 16: Broken ARIA Reference

To fix these issues, The city of Nanaimo, has to simple go through there links and to make sure that everything is listed with the correct attribute (linking back to the IDs), text, and make sure that links are truly provided.

2) In this website there are "53 Alerts".

  • 1:Suspicious Alternative Text
  • 3: Fieldset Missing Legend
  • 3: Unlabeled Form Element With Title
  • 1: Possible Heading
  • 20: Suspicious Link Text
  • 7: Redundant Link
  • 18: Redundant Title Text

To fix these issues, Nanaimo needs to make sure there is clearer alt tags, legends, label input fields, make sure that headings are properly used, avoid links like "Read More", "Click Here", and other text. Don't have a title and a "Read More" linking to the same thing. Remove some titles that are redundant.

3) The structure of the website tells me that Nanaimo has

  • 1: h1
  • 14: h2
  • 16: h3
  • 1: h4

There are 13 h2s that should be a lower header level as they are not all level 2 important. I would also say that the h1 should be moved to the top of the page instead of just before the footer.

Cynthia Says

  1. With the use of the "background-image" property in HTML it will not show up on Screen Readers and browsers in which has CSS turned off. To fix this issue, just use an "img" tag when using images. Make sure to remember to include alts and titles along with the tags.
  2. Make sure that the text that goes with links have a clear meaning of where they are going. Avoid using text such as "Click Here" and "Read More". Instead, use something like "Click Here for the Full Post" or "Read the Full Post". Furthermore, make sure to include alt and title attributes to help the views know where they're going as well as people with Screen Readers.
  3. Make sure that all videos have text transcripts to them and that they are properly linked and the information is the same. As well as to have close captioning with the videos. Further make sure that there is a clear audio track to go along in which helps people with a visual disability to be able to get a feel of the visuals on screen.
  4. Make sure that all the HTML has a proper organization for the DOM so that Screen Readers can make sense of the content.
  5. Make sure not to use confusing images to convey actions.
  6. Make sure that colour is not the primary way to convey information
  7. Don't have flashy content.
  8. Make sure that users are aware if there is any problems with the form entries that they have entered. As well that the forms are properly labeled.
  9. Make sure to validate your page using https://validator.w3.org.

BC Government

WAI

1) In this website there are "0 Errors". Good job BC Government!

2) In this website there are "50 Alerts".

  • 2: Redundant Alternative Text
  • 1: A Nearby Image Has the Same Alternative Text
  • 3: Long Alternative Text
  • 1: Missing First Level Heading
  • 1: Skipped Heading Level
  • 5: Redundant Link
  • 1: Noscript Element
  • 3: Accesskey
  • 33: Redundant Title Text

To fix these issues, the Government needs to first make sure that they include an h1 element, then they need to make sure that they have different alt and title tags from one an another, as well as making sure that every alt attribute, when naming alt attribute make sure they are short attributes and not long ones, make sure that there is a structure in which follows a proper flow h1 then h2 then h3 ... and not an h2 then h4, don't have a title and a "Read More" linking to the same thing, make sure that scripts are available to as many people as possible, remove the accesskey so that the site can be fully available to many people, and remove some titles that are redundant.

3) The structure of the website tells me that the BC Government has

  • 0 : h1
  • 26: h2
  • 18: h3
  • 1: h4

There is no h1 within the website that tells SEO that there is nothing important on the website. Furthermore, there is a jump from an h2 to an h4 which calls a "Skipped Heading Level" alert. Simply they should just change the h4 to an h3.

Cynthia Says

  1. With the use of the "background-image" property in HTML it will not show up on Screen Readers and browsers in which has CSS turned off. To fix this issue, just use an "img" tag when using images. Make sure to remember to include short alts and titles along with the tags.
  2. Make sure that users are aware if there is any problems with the form entries that they have entered. As well that the forms are properly labeled.
  3. Make sure that all videos have text transcripts to them and that they are properly linked and the information is the same. As well as to have close captioning with the videos. Further make sure that there is a clear audio track to go along in which helps people with a visual disability to be able to get a feel of the visuals on screen.
  4. Make sure that all the HTML has a proper organization for the DOM so that Screen Readers can make sense of the content.
  5. Don't have flashy content.
  6. Make sure that colour is not the primary way to convey information
  7. Make sure not to have to many different coding languages, such as XML, HTML, CSS, JavaScricpt, Java, etc.
  8. Make sure that the text that goes with links have a clear meaning of where they are going. Avoid using text such as "Click Here" and "Read More". Instead, use something like "Click Here for the Full Post" or "Read the Full Post". Furthermore, make sure to include alt and title attributes to help the views know where they're going as well as people with Screen Readers.
  9. Make sure to validate your page using https://validator.w3.org.