@mattstuddert
Posted
Hey Vincenzo, great to see you post another solution. Where do you feel like you're screwing up? After taking a look at your code I've got some suggestions on potential improvements:
- First of all, I'd recommend trying to clear the accessibility issues. Read through the errors and Google each one to see if you can try and resolve them.
- You've put the "A Simple Bookmark Manager" as a
h2
whereas I would say this is the main heading on the page and should be ah1
. You've then got multipleh1
elements elsewhere. I'd always recommend having a singleh1
element and then use multipleh2
-h6
elements to create the content hierarchy. - Your
click
listeners for the tabs are onli
elements. This makes this content inaccessible to screen reader users, asli
elements aren't focusable by default. Whenever you have interactive areas on a page, be sure to use an interactive element to trigger the functionality. Abutton
would have been perfect here. - You're currently using
<section class="footer">
as the footer, but you could just use<footer>
, which would be semantically correct. - The
ul
in the footer currently has the following structure:
<ul>
<a href="#features"><li>Features</li></a>
<a href="#Pricing"><li>Pricing</li></a>
<a href="#Contacts"><li>Contact</li></a>
</ul>
This is invalid HTML as only li
elements can be direct children of ul
and ol
elements. So the anchor tags should be inside the list items.
Keep at it. You'll keep improving with each project! 👍