Pure HTML and CSS with VSCODE IDE.

Community feedback

• 

  Rob Vermeer•170

  @RobVermeerPosted over 2 years ago

  Solution looks good!

  One best practise I would recommend, is to always add the width and height of the image to the img element. These should be the full size of the image (intrinsic size). Without these values the browser doesn't know what amount of space to reserve when downloading the image.

  You can see this in action in for example Chrome, by opening the element inspector, go to network and disable cache and throttle with "Slow 3G". Then go to performance tab and reload, when page is full loaded, stop the measurement and hover over the screenshots to see the text moving from top to bottom when image loads in (you see a peak in the graph where is happens) =)

  You can read more about this here https://web.dev/cls/ and https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img

  Marked as helpful

  1

  ---

  

  Ginaldo Capistrano•70

  @gcapistranoPosted over 2 years ago

  @RobVermeer Great feedback, thank you! I'll add it to my personal study notes and put it in practice in the next study session. Best wishes!

  1
• 

  Manuel Gil•340

  @ManuGil22Posted over 2 years ago

  Hey @gcapistrano your solution is pretty good! Just some details u might wanna change:

  • Add a <main> tag around the main code
  • Try to match colors of the desing. I think the h1 should be like a dark blue or smth like that.

  Really well done!

  Keep pushing and happy coding!

  Marked as helpful

  1

  ---

  

  Ginaldo Capistrano•70

  @gcapistranoPosted over 2 years ago

  @ManuGil22 Thank you for your feedback! It's very helpful. I think I'll try others challenges before make changes. But I'll do it in a near future surely. Best wishes!

  0