@FluffyKas
Posted
Hey,
Wow, it takes some confidence to call your own solution perfect ^^ Overall it looks good, but there's a few issues with it:
-
As mentioned above by @Crazimonk, you need to wrap your content in a
maintag. Your website should have certain landmarks, likeheader,main,footer, etc. Why? Because not everyone is able to use their eyesight to navigate through your website and for these users the lack of landmarks is going to cause problems. MDN is your friend, look up semantic HTML tags ^^ Divs are mainly used for grouping together content for styling, and thats about it. It conveys no additional meaning. -
Similarly, instead of calling a div footer, why not use a semantic HTML tag called
footer? -
You forgot to wrap your footer menu items in
atags. Same goes for the social media links, they're not links at the moment. If you wrap them inayou should also give them an aria-label to describe where these links lead. Adding some hover states too would be great. -
Is there a reason to use px for paddings and margins while you used rems everywhere else?
-
There's an unnecessary breakpoint at 320px which makes your design break on small screens. I guess it's not a big deal, I don't really know how many people have screens smaller than that but there's no reason to go out of your way to inconvenience them. :D
-
Some inline padding would look nice in tablet view for the "partners-group" and the footer sections. At the moment, they're touching the sides of the screen which isn't the prettiest.
-
There's a typo in the markup => div? (services__content__group).
Overall you did good, it's just semantic HTML that perhaps you could look into. There are some great resources out there which could help (MDN, a11y, Scott O'Hara and a lot more) Happy coding ^^
