Responsive Mobile First Huddle Landing Page with CSS Flexbox and Grid

Hey, awesome work on this one. Layout in desktop looks fine, just some text needs to be bigger so that some white-spaces could be occupied. Mobile layout looks great.

Well, I don't really used plain css, I use scss so that I could have different module/files, this way, I won't be using a single file it will prevent it from being cluttered. Have a try using scss and search about 7-1 pattern.

Some other suggestions would be:

• You don't really need a nav on the header since there are no navigational links that are used, a div would be fine.
• I think the try for free and any other buttons that looks similar to that is better when it uses a tags, because it looks more likely to be a page link for you to try it.
• On the img in the hero-section, if you are using aria-hidden="true" on the image, then use an empty alt as well like alt="" on it, since you are hiding the image.
• Also, for the icons below the hero-sections, the icons that are used by the numbers should have alt="".
• The text 1.4k+ and the 2.7m+ isn't really suited to be a heading tag, since it doesn't add any extra information about the section where it is used. When a design has bold text, it doesn't always mean that they are heading tags.
• Sam for the other images, alt="" if it is just decorative.

FOOTER

• The alt value for the telephone and email icon should be empty alt="" and need aria-hidden="true". Decorative images should be hidden.
• The social media links could be nested inside ul element, since those are "list" of links.
• The form's input needs to have a label associated with it, use an sr-only to the label you are going to used, describe the purpose of the input.
• Lastly, just to practice more js, create a email validation.

Aside from those, great work again on this one.

Thank you so much for your feedback.