Blog Preview Card Using HTML & CSS

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

I’m happy with how my blog preview card turned out. The hover effects and attention to detail in aligning the design with the style guide really elevate the user experience. It felt rewarding to see the concepts I’ve been learning come together into a cohesive and polished solution.

I’d like to focus more on responsiveness and accessibility features, ensuring the design adapts seamlessly across all screen sizes and meets WCAG guidelines. Additionally, exploring CSS animations or experimenting with alternate design layouts could add an extra layer of creativity to the solution.

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

One of the main challenges I encountered was focusing on the design, particularly because I had never worked with hover effects and box shadows before. These were new concepts for me, and initially, I struggled to understand how they impacted the overall look and feel of the card.

To overcome this, I studied examples and experimented with different values to observe their effects. By tweaking the box-shadow and hover properties, I was able to create transitions that made the design more interactive and appealing. The process taught me the importance of small details in enhancing user experience.