Cognitive load

  1. Grouping-:
    Groping of content is done correctly. Users can easily understand the content.
  2. Chunking-:
    Information is well organised and written in small sections. I want to change the only thing to remove some content from the hero section. I think the hero section should look minimalistic.
  3. Hierarchy-:
    The content of the website is appropriately organised. Users can easily navigate the website with a few mouse clicks.
  4. Anchors-:
    Every paragraph is written with an appropriate heading so that the user can quickly scan content.
  5. Consistency-:
    The website looks coherent and harmoniously across all its different elements. A reader has to do less thinking which saves their time.
  6. Grid-:
    The website provides a good user experience, and users can easily navigate the website and find what they need.

** Problem – Screen readers can read content outside the modal dialog.

solution – We can fix this issue by adding the aria-hidden=”true” attribute to the modal dialog container’s sibling elements within the <body> element. (You do not need to add aria-hidden=”true” to <script> and <style> or the page overlay <div> elements as screen readers do not read content in those tags.) This will prevent screen reader users from browsing outside the modal dialog. When the modal dialog is dismissed it is extremely important that the aria-hidden=”true” attribute is removed to expose the page content to screen reader users again.

Language Usage

Content of the website is organised with headers and subheaders and is easy to ready. Words are short without any abbreviations and jargon.

Color

I like the colour scheme of the website. All the colours used in the website are taken from the logo colour shades.

Typography

Font size is written in rem unit with proper spacing, line height, alignment. Formatting of content is also done correctly.

Scores out of 5

Perceivable (Score 3)

GET STARTED, APPLY, LEARN MORE Buttons has insufficient color contrast of 3.95 (foreground color: #ffffff, background color: #e54360, font size: 13.5pt (18px), font weight: normal). Expected contrast ratio is 4.5:1.

Hero section image, Canada world map image, footer logo and footer all three social media icon element does not have an alt attribute.

Operable (Score 4)

Users can quickly and accurately manipulate all interface and navigation components. Link, buttons and form fields are accessible through a keyboard and images are labelled with clear text descriptions.

Understandable (Score 5)

Users can easily understand the interface and content of the website. Long passages are written in small sections with meaningful headings, and details are provided for any action required of the user.

Robust (Score 5)

  • The website can be reliably interpreted by Chrome, Mozilla Firefox, safari, and internet explorer.
  • Content of the website is organised correctly for all screen sizes like mobile, tablet and desktop.
  • Semantic elements are used like articles, sections, forms.

I want to rate the page minor in terms of its accessibility challenges because there are some issues with the screen reader, alt attribute and color contrast.