Responsive Social Links Profile using Flex Box

Community feedback

• 

  Adriano•38,270

  @AdrianoEscarabotePosted 22 days ago

  Hello Govardhan V Prakashmurthy, how are you? I was really pleased with your project, but I’d like to offer some advice that might help:

  To enhance the semantics of your code, consider using a <ul> (unordered list) for the collection of links, as it represents a list of related items. Here's an example:

  <ul>
      <li><a href="#">GitHub</a></li>
      <li><a href="#">Frontend Mentor</a></li>
      <li><a href="#">LinkedIn</a></li>
      <li><a href="#">Twitter</a></li>
      <li><a href="#">Instagram</a></li>
  </ul>
  

  Using a <ul> provides clear structure and context, signaling to both browsers and assistive technologies that these links are part of a cohesive group, improving both accessibility and readability.

  The rest is spot on.

  Hope it’s helpful to you. 👍

  0
• 

  P

  Toba•190

  @tobaojoPosted 23 days ago

  Looks great all around so good work!

  If I'm being pedantic, the button elements are used for social links. To navigate to external sites, it's better to use <a> tags styled as buttons, rather than <button>. This will make each button behave as a link and allow for setting href attributes

  The alt attribute on the image is currently empty, which is generally discouraged when considering accessibility. Provide a brief description, like "Jessica Randall's profile photo".

  Consider using padding on .flex-wrapper to ensure content isn’t squeezed against the edges of very small screens.

  0