Stats preview card

Community feedback

• 

  Raymart Pamplona•16,100

  @pikapikamartPosted about 3 years ago

  Hey, good job on this one. Though the layout is really huge, you might want to tone it down a bit. The site is not responsive at the moment and the mobile layout is the opposite to what it should look like, the image needs to be at the top and not on the bottom :>

  Some other suggestions would be:

  • Avoid using height: 100v on a large container, especially the body tag, this makes the element's height be only limited to the current remaining viewport/screen's height. Instead, you can remove this or replace it with min-height: 100vh, this takes full height and will expand if it needs to.
  • Always have a main element on your site, this helps user to properly navigate the page. For this one, the card selector could have used main element instead of div.
  • The bottom selector could have used ul element, because as you can see, that section is just basically a "list" of information about the compony website. Each li tag would wrap the number as well as the text below the number.
  • The number 10k+ and other numbers are not suited to be a heading tag since it doesn't add any content overview about the section, using p tag on it would be great.
  • Also, on the card selector, replace the width: 1440px by max-width: 1440px, using the former makes the element have explicit fixed width, this creates horizontal scrollbar for other users who uses lower resolution on that property value.
  • Lastly, try making the site as responsive as you can, using mobile first workflow would really help you with that.

  Aside from those, great work again on this one.

  0