
Please log in to post a comment
Log in with GitHubCommunity feedback
- @gok786
Overall Feedback:
You've created a clean and visually structured blog preview card with a solid understanding of layout and basic styling. The use of Flexbox is appropriate and your font choices are on brand for a modern UI.
What’s Good:
Semantic structure is mostly clear and easy to follow.
Nice use of Google Fonts and Flexbox for layout.
Card styling (border, shadow, radius) looks visually engaging.
Good use of class naming and image handling for the avatar.
Suggestions for Improvement:
Accessibility & Semantics:
Use meaningful tags like <article>, <section>, and <time> instead of <h2> for date.
Consider adding alt attributes to all <img> tags for accessibility.
Image Styling:
img { width: 50; } is missing a unit (px). Should be width: 50px;.
Content Spacing:
Add some spacing (e.g. margin-top) between elements like h3 and the paragraph for better readability.
Responsive Widths:
Avoid hardcoded widths like width: 400px on h3; this can break responsiveness. Use relative units or let it adjust naturally.
CSS Cleanup:
Remove unused or commented code for better readability.
Fix the empty font-weight: in .udo.
External Link:
Your attribution link to Gmail might not be appropriate — consider using a personal portfolio or GitHub instead.
Join our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord