News Homepage

Community feedback

• 

  Adriano•38,310

  @AdrianoEscarabotePosted almost 2 years ago

  Hi Agil, how are you? I really liked the result of your project, but I have some tips that I think you will enjoy:

  If we see how the layout is behaving at higher resolutions, with the help of google dev tools, we will see that it is stretching a lot, to solve this we can use a max-width with the value we want the content to stop growing and to center use a margin: 0 auto

  body {
      max-width: 1440px;
      margin: 0 auto;
  }
  

  Avoid using px, If your web content font sizes are set to absolute units, such as pixels, the user will not be able to re-size the text or control the font size based on their needs. if you want to keep using px for development and then format the whole code to rem, you can use this vscode extension: px to rem

  The rest is great!

  I hope it helps... 👍

  Marked as helpful

  1
• 

  Sinisa Vukmirovic•1,690

  @SinisaVukmirovicPosted almost 2 years ago

  Hello!

  To improve, use more (all) HTML5 semantic elements, and use them more correctly. Unlike most beginners your are using some semantic elements, which is great, but also misusing some of them.

  More on semantic HTML5 elements

  Also, use of headings (h1, h2, h3...) elements is not correct.

  More on headings in HTML5

  Your code, in general is OK, but for a beginner it is quite good. Learn and apply said things and it will be very good code.

  And, while learning, you should stick to making everything with vanilla CSS and JS. Move on to frameworks only when you learned the fundamentals.

  Hope this helps!

  1
• 

  Tjaša Žilavec•590

  @TjasaZilPosted almost 2 years ago

  Hi Agil,

  good work on the project. To enhance your code you can put the navbar section outside of the main component and wrap it into <header> tag. You can read more about the tag and why it is used here. I also see that all of your pictures do not have an alt attribute. Some of the alt attributes are empty. It is good practice to describe the picture in the alt attribute, just in case, the user can not see the image (slow connection, broken src or the user uses a screen reader).

  I do not think you need to use any frameworks with this project, as it is pretty simple. Basic HTML, CSS, and a bit of JS are enough. You can redo the challenge once you know some frameworks if you want.

  Otherwise, you are doing great :)

  Cheers! 🥂

  1