Blog Preview Card

Community feedback

• 

  T

  Grace•31,090

  @grace-snowPosted 9 months ago

  At this stage I recommend you focus on html more than all else. It's essential to establish good html practices now as its the foundation for everything else. This needs to change in the following ways:

  1. Use a div or article to wrap the component inside main
  2. Footer is a totally separate landmark and must not be inside main. That is just a another div, grouping content for layout purposes not meaning purposes.
  3. Remove the header and section from the component. You are misusing these elements. Read about landmarks and how to use them.
  4. The alt text should be blank on the image if decorative or provide a meaningful description if its meaningful content.
  5. Text should never be in divs or spans alone. The tag text in this should be a single paragraph, not two divs. The heading should be a heading with a link inside (how would anyone access this blog of there is no link?!) and the description is a paragraph. The card footer is a div with img and paragraph inside.
  6. If using the time element it should only wrap the date part of that paragraph and should include the date time attribute.

  Marked as helpful

  1

  ---

  

  xiNeRoar•50

  @xiNeRoarPosted 9 months ago

  @grace-snow Thanks! Your comment is really helpful, I am always wondering what should be the correct way to use different HTML tags and struggling a lot. Indeed I did read Landmark on w3c but I didn't get it. I am confused about when I should use them cause the introduction of them are more like talking about in a plain text context rather than modern website development

  0

  

  T

  Grace•31,090

  @grace-snowPosted 9 months ago

  @xiNeRoar see if this post helps you: https://fedmentor.dev/posts/html-plan-product-preview/

  The key thing with planning HTML is you DO think about the content as if it is a plain document. Imagine the content without the styling and it's very helpful to work out what elements to use.

  1
• 

  Olaniyi Ezekiel•7,580

  @Ezekiel225Posted 9 months ago

  Hello there 👋 @xiNeRoar.

  Good job on completing the challenge !

  Your project looks really good!

  Keep up the excellent work and continue to challenge yourself with new projects. Your progress is impressive, and each project is a step forward in your front-end development journey! 🚀🌟.

  Happy coding.

  Marked as helpful

  1