Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Blog preview card using basic CSS custom properties

Rachel Pizaneβ€’ 60

@rachelpizane

Desktop design screenshot for the Blog preview card coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


Hey guys! This was my solution to the challenge, I hope it turns out well!

However, how can I name my class without getting lost?

Any suggestions on how I can improve are welcome!

Community feedback

@MelvinAguilar

Posted

Hello there πŸ‘‹. Good job on completing the challenge !

I have some suggestions about your code that might interest you.

  • Naming elements is too complicated; there are many ways to do it. Based on your class names, I recommend using a methodology called BEM to improve the classes,

  • Use semantic elements such as <main> and <footer> to improve accessibility and organization of your page.

  • The <span> tag is useful for various inline styling purposes, but it's not recommended to use it solely for containing text. Consider using semantic tags like <p> or <time>

  • The alt attribute should not contain the words "image", "photo", or "picture", because the image tag already conveys that information.

I hope you find it useful! πŸ˜„ Above all, the solution you submitted is great!

Happy coding and Happy New Year! πŸŽ‰πŸŽŠπŸŽ

Marked as helpful

1

Rachel Pizaneβ€’ 60

@rachelpizane

Posted

Thank you @MelvinAguilar ! Your tips certainly helped me!

Happy New Year to you too. ✨

0

Please log in to post a comment

Log in with GitHub
Discord logo

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