Skip to content
Submitted 6 months ago

Blog Preview Card

asdiAdi•130
@asdiAdi
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Blog preview card
  • HTML
  • CSS
1newbie

Design comparison

SolutionDesign

Solution retrospective

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

Used sass extensively. This includes mixins, variables and use of @use and @includes.

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

Overwhelmed by the sheer amount of tools that I can use with sass. Decided that I'll learn slowly starting with mixins.

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

Maybe how can I write my code more semantic.

Community feedback

  • Rupali•780
    @rupali317Posted 6 months ago

    Hello @asdiAdi

    Good job on completing the challenge!

    Your code is semantic. Good usage of tags like <h1>, <p>, <img>.

    The only thing that I would do differently is remove the <h3> tag that encloses the <span>. Just <span>Learning</span> is enough with the respective stylings.

    The reason is due to accessibility. Normally it is logical for <h1> tag to come before the other <h2>, <h3>, <h4>, ... tags. When you read a blog, the first title is always <h1>, then subtitles are <h2>. Moreover, you should not skip headings meaning after <h1> you cannot have <h4>. After <h1>, it is <h2>, then <h3> and so on

    Thought of sharing some accessiblity rules pertaining to headings. Hope this insight helps.

    Marked as helpful
    1
    asdiAdi•130
    @asdiAdiPosted 6 months ago

    @rupali317

    Thanks for the feedback!

    1

Please log in to post a comment

Log in with GitHub

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