Blog preview card using CSS

Community feedback

• 

  Jyoti-shinde-coder•60

  @Jyoti-shinde-coderPosted 19 days ago

  The solution effectively uses semantic HTML, but replacing excessive <div> or <span> with proper tags can improve clarity and SEO. Accessibility can be enhanced by ensuring keyboard navigation, adding ARIA attributes, alt text for images, and maintaining good color contrast. The layout is responsive, but testing on different devices and refining image and text scaling can improve it further. Using CSS Grid/Flexbox helps with alignment. The code should be modular, well-commented, and follow best practices like DRY. Keeping styles and logic organized improves readability. Lastly, refining spacing, fonts, and alignment ensures the design closely matches the original. Overall, it’s a solid solution with minor improvements needed in accessibility, responsiveness, and structure.

  Marked as helpful

  1

  ---

  

  P

  Stash443•120

  @Stash443Posted 15 days ago

  @Jyoti-shinde-coder All well said and taken into account. Thanks for the feedback.

  0
• 

  P

  mswirydowicz•40

  @mswirydowiczPosted 19 days ago

  Hey!

  Your image is too large. Look at project.

  You haven't got <main>.

  Why you touch img in div?

  0

  ---

  

  P

  Stash443•120

  @Stash443Posted 15 days ago

  @mswirydowicz Hi there, I touch img in div because I wanted to control the image but then I realized it was unnecessary after doing research, mind you it was after I submitted the solution. For future projects I'll take the main tag into consideration.

  1