Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Profile Card Component

NienDev 10

@NienDev

Desktop design screenshot for the Profile card component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


All comments are welcome

Community feedback

kxnzx 870

@kxnzx

Posted

Congratulations with your first challenge, you did a great job! Your solution looks similar to the design.

You have one accessibility issue. Your page must contain at least one H1 element.

Here is my suggestion:

  • Wrap “Victor Crest 26” in an <h1></h1> tag instead of the <div></div> tag that you have right now.

It is good to use div’s for the purpose of styling and arranging components on the page. Div’s are like empty containers, but they do not have any semantic meaning.

An H1 is very important on a page for search engines, screen readers, SEO and people with visual visual impairment to know what your page is about. You always at least need ONE h1 in your page. Then (when needed) you follow it up with subheadings such as an h2, h3, h4 etc. It’s the hierarchy that matters. Just remember that the most important title on the page is an h1.

You can find more information here: https://dequeuniversity.com/rules/axe/4.3/page-has-heading-one?application=axeAPI

Greetings K

Marked as helpful

0

NienDev 10

@NienDev

Posted

@kxnzx thank you for your comment

0
kxnzx 870

@kxnzx

Posted

@NienDev Yrw! :)

0

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord