Personal web design

Community feedback

• 

  Daniel 🛸•44,250

  @danielmrz-devPosted 6 months ago

  Hello @jestaputra!

  Your solution looks great!

  📌 It's recommended to use semantic HTML elements like <ul> and <li> for creating lists. This ensures that your code is more accessible, maintainable, and semantically meaningful.

  Here's and example on how you can refactor your code:

  After Refactoring

  <ul class="list-container">
      <li><a href="#">Github</a></li>
      <li><a href="#">Frontend Mentor</a></li>
      <li><a href="#">LinkedIn</a></li>
      ...
  </ul>
  

  By using <ul> and <li>, you convey the structure of your content more clearly, making it easier for screen readers and search engines to understand. Additionally, it aligns with best practices for HTML semantics.

  I hope you find this helpful!

  Keep up the excellent work!

  Marked as helpful

  0

  ---

  

  KdJesta•360

  @jestaputraPosted 6 months ago

  thank you very much for your solution @danielmrz-dev, maybe the next time i will fix my projects

  0
• 

  Bernardo Poggioni•5,280

  @R3ygoskiPosted 6 months ago

  Hello @jestaputra, I would like to congratulate you on completing this challenge.

  A tip regarding what you mentioned about making the image round, instead of using overflow:hidden; which depends solely on the parent element, you could do it like this:

  img {
      border-radius: 50%;
  }
  

  This way it's simpler and helps with maintenance, because when you see that the image is round, you already know that it's the border-radius applied to it.

  Now, a tip about your HTML, the structure is good, but it lacks semantics, and having semantics is very important, not only for SEO but also for Accessibility. I'll show you some sections that could be made semantic:

  • <div class="container"> this div could be replaced with a <main>, because the main content of your page is inside this div.
  • <div class="profile"> and this div could be replaced with an <article>, because all the profile content is self-explanatory.

  And again, congratulations, your first project turned out very well, keep practicing and improving. If you have any doubts, please ask below and I'll try to help in the best way possible.

  Marked as helpful

  0

  ---

  

  KdJesta•360

  @jestaputraPosted 6 months ago

  thank you very much for your solution@R3ygoski, i have a new style in css to reply my projects the next time

  1