Results Summary using grid, flexbox, and semantic HTML

Community feedback

• 

  Melvin Aguilar 🧑🏻‍💻•61,140

  @MelvinAguilarPosted over 1 year ago

  Hello there 👋. Good job on completing the challenge !

  The solution looks much better now, I just have one small suggestion.

  • Is the word "Great" important enough to be a heading element? What is the content associated with that title? This is the heading structure of your code:

    • Results Summary (visually hidden)(h1).
      • Your Result (h2).
      • Great (h2).
      • Summary. (h2).
        • Reaction (h3)
        • Memory (h3)
        • Verbal (h3)
        • Visual (h3)

    Does this make sense? In my humble opinion, the element can be a paragraph. Also, the words "Reaction," "Memory," "Verbal," and "Visual" are not very good candidates to be heading elements. more info here.

  I hope you find it useful! 😄

  Happy coding!

  Marked as helpful

  1

  ---

  

  ohuttar•160

  @ohuttarPosted over 1 year ago

  @MelvinAguilar

  Thanks for your feedback and for the helpful link!

  Yeah I see your point. Really everything beneath the "Your Result" and "Summary" headings are the content of those headings, and don't need to be subdivided. I'm going to update my HTML file.

  0
• 

  Abdul Khaliq 🚀•72,560

  @0xabdulkhaliqPosted over 1 year ago

  Hello there 👋. Congratulations on successfully completing the challenge! 🎉

  • I have other recommendations regarding your code that I believe will be of great interest to you.

  HTML HEADINGS 🏷️:

  ---

  • Every site must want at least one h1 element identifying and describing the main content of the page.

  ---

  • An h1 heading provides an important navigation point for users of assistive technologies, allowing them to easily find the main content of the page.

  ---

  • So we want to add a level-one heading to improve accessibility by reading aloud the heading by screen readers, you can achieve this by adding a sr-only class to hide it from visual users (it will be useful for visually impaired users)

  ---

  I hope you find it helpful ! 😄 Above all, the solution you submitted is great

  Happy coding!

  Marked as helpful

  0

  ---

  

  ohuttar•160

  @ohuttarPosted over 1 year ago

  @0xAbdulKhalid

  Thanks for the tip! I updated the HTML to include an h1

  0