Skip to content
Submitted 7 days ago

Responsive News Page using CSS Grid

P
Aakash Dasgupta•360
@a-d14
A solution to the News homepage challenge
Preview (opens in new tab)Code (opens in new tab)

Solution retrospective

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

I would like someone to check my website for accessibility and tell me if I missed something. I think the hamburger menu should be good (followed a video for that) but the rest of the website might need a little work.

Code

Please log in to post a comment

Log in

Community feedback

  • P
    Andrey•4,200
    @dar-ju

    Hi, Aakash Dasgupta!

    Very cool work! The semantics are all excellent, the responsiveness is super, the layout is perfect.

    I looked at accessibility. You can immediately remember that if the button has no text or it is not clear what it does, then the aria-label should be filled in without thinking, while it should be clear what the button does, for example, not just Close, but aria-label="Close mobile menu", for hamburger - Open mobile menu. Let's look further, the Read more button - the inscription is there, it is clear, it refers to the block, here we do not specify anything for accessibility.

    And the second point, accessibility from the keyboard, needs to be checked. There is no focus on the links of the story-content blocks.

    Also. The section tag should have an h1-h6 heading, if the section does not have a heading, then you should think about using a section or div.

    Good luck with future projects, you are doing great!

    Marked as helpful

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