Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Social links profile - Solution

Randy Robsonβ€’ 50

@randyrobson

Desktop design screenshot for the Social links profile coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Community feedback

Simon Capillonβ€’ 100

@simon7195

Posted

Hi! πŸ˜„

Your solution is really nice, I really like the little animation that moves when the buttons are hovered.

May I make a few comments :

  • For the avatar, you used the background of your div to insert your image. I think using an img tag would have been more appropriate, especially in terms of accessibility, as in your case you can't display alternative text (alt="avatar of ...").
  • For geographic datas, a p tag would have been more appropriate than an h2.
  • The section tags defines important areas of a site. In the case of a linktree, a div or span would have been more appropriate.
  • Regarding fidelity to the proposed design, your dimensions differ a little from the model. It's a detail, but for some designers and customers it can be annoying.
  • Your CSS is very short, I think that's great, especially since on my side they're usually longer πŸ˜“. However, I think you should use classes because in a larger project, using tags as selectors is a dangerous gamble and makes it difficult to read your code (especially if it's uncommented as is your case).

I hope you find my comment useful. Keep it up! ✌️

0

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord