Skip to content
Submitted almost 5 years ago

Huddle - HTML, CSS, SCSS, BEM, NPM scripts, SVG sprite, CSS grid

Matěj Kubíček•130
@matejkubicek
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Huddle landing page with a single introductory section
  • HTML
  • CSS
1newbie

Design comparison

SolutionDesign

Solution retrospective

Please leave me a feedback about my code and used workflow. Thx

After reading the report I have two questions:

  1. Element section must have a heading? Why?
  2. Element a must contain word (or elements span, p, img...)? Solution with element svg included in a element is big problem?

Thx for any commentary.

btw. I had a problem with | character in font link. This character separates two different font-face. | can be replaced with%7C and problem is solved.

Community feedback

  • Matěj Kubíček•130
    @matejkubicekPosted almost 5 years ago

    point 1. repaired - I added role="img" atribut to svg tag and to the svg tag new tag title with short description.

    Article about SVG ACCESSIBILITY on css-tricks.com

    1
    Matt Studdert•13,611
    @mattstuddertPosted almost 5 years ago

    Great work resolving these issues by yourself Matěj! Your solution looks really good too 👍

    0
    Matěj Kubíček•130
    @matejkubicekPosted almost 5 years ago

    @mattstuddert Thx a lot.

    0

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