Responsive social links component

Community feedback

• 

  Alberto Raúl José•610

  @alberto-rjPosted 7 months ago

  Hi, @mikehwebdev! Congratulations on investing your time and leveling up with the challenge, Social links profile.

  I have some code suggestions about your HTML code in the file index.html that can help you improve your solution to this challenge.

  HTML

  Specify the description of the page

  Meta descriptions may be included in search results to concisely summarize page content. Learn more

  Avoid use images not appropriately-sized

  Line 15: Images that are appropriately-sized to save cellular data can improve the load time of the page. Learn more here.

  Convert the profile picture to next-gen formats, such as WebP or AVIF because those formats often provide better compression than PNG or JPEG. Learn more here. You can solve this problem here.

  Dont' use buttons where you should use links

  Line 19 to 23: It's better to use links instead of buttons here. While a link generally serves to redirect the user to a new page, a button performs an action that occurs on the page. Learn more here.

  👎 Don't

  <button class="btn git">GitHub</button>
  <button class="btn fem">Frontend Mentor</button>
  <button class="btn link">LinkedIn</button>
  <button class="btn twi">Twitter</button>
  <button class="btn inst">Instagram</button>
  

  👍 Do

  <ul>
    <li>
      <a class="class="btn git"" href="#">GitHub</a>
    </li>
    <li>
      <a class="btn fem" href="#">Frontend Mentor</a>
    </li>
    <li>
      <a class="btn link" href="#">LinkedIn</a>
    </li>
    <li>
      <a class="btn twi" href="#">Twitter</a>
    </li>
    <li>
      <a class="btn inst" href="#">Instagram</a>
    </li>
  </ul>
  

  Keep learning, coding and sharing! 🌟

  Happy coding! 🚀

  Marked as helpful

  0

  ---

  

  P

  Michael Hatton•270

  @mikehwebdevPosted 7 months ago

  Thanks @alberto-rj. I'll adjust my project a bit here and take your advice on board for future projects too 👍

  0