Submitted 18 days ago

blog-preview-card-main

Quang Thoai Vu• 50

@vuthoai02

Preview site(opens in new window)View code(opens in new window)

This is a solution for...

Blog preview card

HTML
CSS

1newbie

View challenge

Design comparison

SolutionDesign

Solution retrospective

What are you most proud of, and what would you do differently next time?

I feel that I've achieved another small goal in improving my interface-building skills. In the near future, I will continue to refine other solutions.

What challenges did you encounter, and how did you overcome them?

I find this interface quite similar to the one I built before. I've learned from and applied some of the advice I received for building that previous interface. However, I named the components of this card based on the elements I used from libraries, and I'm not sure if the names I chose are appropriate. The proportions between the image and the text were also estimated rather than measured precisely. I hope to receive feedback and suggestions from everyone to help me improve further.

What specific areas of your project would you like help with?

I hope to receive feedback and suggestions from everyone to help me improve further.

Community feedback

Teodor Jenkler• 3,720

@TedJenkler

Posted 18 days ago

Hi @vuthoai02,

Nice project! I noticed you're using a lot of semantic elements, and your knowledge of HTML really shows. Consider removing the unnecessary <div> elements within the card and simply making the card itself a flex column. This will result in a cleaner, more streamlined site.

Additionally, instead of using a <p> tag, you could use the <time> tag to further improve SEO and accessibility.

Keep up the great work!

Best, Teodor

Marked as helpful

Quang Thoai Vu• 50

@vuthoai02

Posted 17 days ago

@TedJenkler Thank you for reviewing my project, Teodor. Every review from you is very helpful to me. Based on your feedback, I will strive to simplify my structure in a reasonable way, as this is also an important part of keeping the code clean. You’ve made this clear for me. I don't often use the 'time' tag, so I nearly forgot about it; perhaps I should brush up on the theory. Thanks again, and I wish you a productive day.

Justin• 300

@iamprincetj

Posted 18 days ago

Hi, congratulations on finishing this challenge, I would like to give you review on your solution. Well according to what the design shows, I think your whole body needs to have that background color. Also try using footer instead of the default div they gave us for the 'footer' content. Lastly for the 'HTML & CSS Foundation' use an h1 and make it, so on hover it should change to that color and set the "cursor: pointer;" style. Good Luck!

Marked as helpful

Quang Thoai Vu• 50

@vuthoai02

Posted 18 days ago

@iamprincetj As you mentioned, my h1 tag should change color and have a pointer when hovered. I'm quite lazy when it comes to using the provided footer, which isn’t ideal. Your feedback has been very helpful; thank you so much!

Justin• 300

@iamprincetj

Posted 17 days ago

@vuthoai02 You're welcome

Please log in to post a comment

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