@Finney06
Posted
Hello there 👋. Good job on completing the challenge !
Here are some suggestions regarding your code that may be of interest to you.
HTML 🔤:
To clear the Accessibility report:
Use an h1 tag for the main text in the design given and always avoid skipping heading levels; Starting with <h1> and working your way down the heading levels (<h2>, <h3>, etc.) helps ensure that your document has a clear and consistent hierarchy.
I hope you find it helpful!😏 Above all, the solution you submitted is 👌. 🎉Happy coding!
Marked as helpful
@Brian-Pob
Posted
@Finney06 Thank you for the suggestion! While I agree that heading levels should not be skipped, I decided to use an <h2> tag because this is an element that would likely be used as a component in a larger web page.
For example, a real page might have "Shop Our Products" as their h1 and the cards would display the titles of their products.
I appreciate the feedback though! ✌️
@Finney06
Posted
@Brian-Pob yeah, you're absolutely right but just take note that in any webpageit is best practice in HTML to start with an h1 tag for several reasons:
-
Helps with SEO: Search engines use headings to understand the structure and hierarchy of a webpage's content. The H1 tag is typically used to indicate the main topic or title of the page, which can improve the page's search engine optimization (SEO) and help it rank higher in search results.
-
Improves accessibility: Screen readers and other assistive technologies also rely on headings to navigate a webpage. Starting a page with an H1 tag can help users with disabilities more easily understand the content and structure of the page.
-
Organizes content: Properly using heading tags (such as H1, H2, H3, etc.) can make the content of a webpage easier to scan and understand. This can improve the user experience and make it more likely that users will stay on the page and engage with the content.
