Grid landing page

Hey there! 👋 Here are some recommendations for enhancing your code:

• This two are not needed ❌.

<div class="external-wrapper">
<div class="wrapper">

• The logo should be outside ⚠️ the nav.

• The logo’s alt tag description needs to be improved upon ⚠️; it should ALWAYS and only state the company’s name.

• The logo and nav should be wrapped inside ⚠️ a header element.

• The nav toggle button should be built ⚠️ using a button element and it should have an aria-label, aria-expanded and aria-control.

• The main article (The Bright Future of Web 3.0) should be wrapped ⚠️ inside an article element.

• The "The Bright Future of Web 3.0?" Is not an h1 heading ❌, it is another article heading. It should be an h2 heading ✅ and there should be a visibly hidden h1 in the site.

• The headings in your site are being used incorrectly❌ since the h1 heading can only be used once ⚠️ per page.

• The "new" section should be built using an unordered list element ⚠️ and have an aria-label.

• The bottom section should be built ⚠️ using an ordered list and have a visually hidden h2 heading.

• Numbers are never ❌ headings.

• The “image” / “illustrations in this component are purely decorative⚠️. Their alt tag should be left blank to hide them from assistive technology.

More Info:📚

https://www.w3.org/WAI/tutorials/images/

• The elements that are meant to be interactive are not⚠️. I suggest looking at the "active-states" design file to see which elements are meant to be interactive so that they can be built using the anchor element.

More Info:📚

MDN The Anchor element

• It is best practice ✅ to have separate files for you coding files (HTML, CSS, JS). It helps keep things organized and make it easier to maintain.

If you have any questions or need further clarification, feel free to reach out to me.

Happy Coding! 👾