Profile Card Component solution.

Community feedback

• 

  Raymart Pamplona•16,100

  @pikapikamartPosted about 3 years ago

  Hey, great work on this one. Layout looks good in general.

  Also glad that you find APG's solution a good reference, awesome.

  Some other suggestions would be:

  • The img on the card, the pattern, it should have alt="" on it. If an image is just for decoration, using alt="" on them would be really good, so that screen reader won't pick them up.
  • The london word should not have used heading tag. p tag or span would work just fine.
  • On the list of information, those should have been using ul element, since they are list right.
  • Also, each list of information highlighted text should not have used heading tags at all along with the text below it. Heading tags are for text elements that gives an overview to the section and those are not.
  • Also on the body tag. Avoid using height: 100vh on an element. This makes the element's height limited only to the current viewport's height. Instead, replace it with min-height: 100vh, this takes full viewport's height and it will expanded if it needs to.

  Also a good reference to this challenge is by Grace's solution You will accessible usage on elements on it.

  Aside from those, great work.

  0