TriNguyen479 / kraken-good-accessibility

Fix some HTML semantic accessibility problems for VoiceOver & some CSS design-specific problems.
0 stars 0 forks source link

Kraken - completed #1

Open TriNguyen479 opened 2 years ago

TriNguyen479 commented 2 years ago

@wendywarren

wendywarren commented 2 years ago

Hi @TriNguyen479,

I just took a look at your assignment and overall you did very well! I just have a couple of comments.

Within this page, the div container holding all of the paragraph text and image is actually the div you would assign the role="main". The article contains a header, main nav and footer which is likely on every other page as well. If someone using assistive technology wants to jump to the primary piece of content they would want the chapter content. Does that make sense?

The other thing I wanted to touch on was that in the screenshot, it shows a black focus rectangle around the main nav. This wasn't a requirement for Markbot to pass so no worries. I just thought I'd point it out since quite a few students missed it.

nav a:focus {
  outline: .15rem solid #000;
  outline-offset: .1rem;
}

Good job! I'll go ahead and give you the full mark on the progress site.

Let me know if you have any questions.

Thanks, Wendy