@pikapikamart
Posted
Hey, great work on this one. Layout looks good in general.
Also glad that you find APG's solution a good reference, awesome.
Some other suggestions would be:
- The
img
on the card, the pattern, it should havealt=""
on it. If an image is just for decoration, usingalt=""
on them would be really good, so that screen reader won't pick them up. - The london word should not have used heading tag.
p
tag orspan
would work just fine. - On the list of information, those should have been using
ul
element, since they are list right. - Also, each list of information highlighted text should not have used heading tags at all along with the text below it. Heading tags are for text elements that gives an overview to the section and those are not.
- Also on the
body
tag. Avoid usingheight: 100vh
on an element. This makes the element's height limited only to the current viewport's height. Instead, replace it withmin-height: 100vh
, this takes full viewport's height and it will expanded if it needs to.
Also a good reference to this challenge is by Grace's solution You will accessible usage on elements on it.
Aside from those, great work.