AleWaweru / My-Portfolio

This is a project about my portfolio, which describes me as a developer, my skill set, and my achievements. It is built using HTML, CSS, and Javascript technologies
3 stars 0 forks source link

Accessibility report pull request #11

Closed AleWaweru closed 1 year ago

AleWaweru commented 1 year ago

Below is the accessibilty report :-

Page Title : No Issues found

  1. Checked that there is a title that adequately and briefly describes the content of the page.
  2. Checked that the title adequately distinguishes the page from other web pages.

Image Tags : Issues found at 3 points

  1. Checked and found that the image tag did not have alternate texts on line numbers 20, 246 and 253. So added "alt-image-text" where it was missing.

Text Headings : No issues found

  1. The page has a heading.
  2. All text that looks like a heading is marked up as a heading.
  3. The heading hierarchy is meaningful. The page starts with an "h1" and does not skip levels.

    Color Contrast : No issues found

  4. Checked the page with "Juicy Studio Accessibility Toolbar" and was found to be up to the mark.

Resize : No issues found

  1. Text in images does not get larger when users increase text size
  2. Text doesn't disappear or get cut off.
  3. All buttons, form fields, and other controls are visible and usable.
mailsg commented 1 year ago

Interaction : No issues found

  1. Clicked the address bar, then put the mouse aside and did not use it.
  2. Pressed the 'Tab' key to move through the elements on the page. Also, pressed 'Shift-Tab' to go backwards.
  3. Checked for "Tab to all", "Tab order", "Visual focus", "Image links". All were working fine.

Moving Content : No issues found

  1. Since the project has buttons with hovering properties. It is checked that no content flashes or blinks more than three times in one second

Multimedia : No issues found

  1. No multimedia content present on the page.

The basic structure of the page : No issues found

  1. Turned off the images and show the text text alternatives - the information makes sense when read in the order it is shown.
  2. Turn off style sheets(CSS), which specifies how the page is displayed with layout, colours etc - the alternative text provides adequate information for the missing images.
mailsg commented 1 year ago

Find below the links to the lines where the changes were made : -

  1. https://github.com/AleWaweru/My-Portfolio/blob/a8ca311584d49e7e0119d8879a58aac6c1b11160/index.html#L10
  2. https://github.com/AleWaweru/My-Portfolio/blob/a8ca311584d49e7e0119d8879a58aac6c1b11160/index.html#L20
  3. https://github.com/AleWaweru/My-Portfolio/blob/a8ca311584d49e7e0119d8879a58aac6c1b11160/index.html#L257
  4. https://github.com/AleWaweru/My-Portfolio/blob/a8ca311584d49e7e0119d8879a58aac6c1b11160/index.html#L265