Social Proof Section

Community feedback

• 

  バレンタイン 😈•64,170

  @VCaramesPosted 3 months ago

  Hey there @Saul-Gustavo! 👋 Here are some suggestions to help improve your code:

  • Do not do this;

              <div class="star"></div>
              <div class="star"></div>
              <div class="star"></div>
              <div class="star"></div>
              <div class="star"></div>
            </div>
  

  As it is bad for accessibility, since all the user of screenreader will hear is "New line" over and over.

  • This <section class="cards"> is just another div; no need for the section since the entire component is a section as implied by the challenge name.

  • For the testimonials, it is best to to wrap each individual testimonial component in a figure element, the individuals information should be wrapped in a figcaption element and lastly, the testimonial itself should be wrapped in a blockquote element.

  Code:

  <figure>
     <figcaption></figcaption>
     <blockquote></blockquote>
  </figure>
  

  More Info:📚

  MDN Figure Element

  • For the user img's their alt tag should state their entire name only.

  • With headings, you are not allowed to skip heading levels (h1 then h3), you have to follow the order. In this case, since the next heading level after h1 is h2 the user's name should be h2 instead of h3.

  • When styling your code, you want to always start mobile first since this is the primary method that users browse websites. With mobile first, you will style your code for small screen (320px) first and work your way up to larger screens using responsive elements and media-queries

  <Happy Coding/>! 👾

  Marked as helpful

  1

  ---

  

  Saul Gustavo A. S.•630

  @saul-gustavoPosted 3 months ago

  @VCarames Thank you so much!!!

  0