@anthonyplicata
Posted
Looks great! And you nailed the centering of the card which I definitely struggled with when I first got here.
If you chose to use the h2 tag for difference in size compared to h1 I would suggest sticking with the h1 tag since there are no other headings. Use CSS to style the text the way you want it. It's more so technically correct but also allows for screen readers to properly read the markup. As for using <header> and <main> I'd say this challenge doesn't have a real header other than maybe the qr code image? But you could put the text contents inside of a main tag to make it more accessible!
The "Challenge by..." text is footer content. So you could take .attribution and change it from a div to footer and take it out of that section container. You could go even further with accessibility and place the text inside a <small> tag inside the <footer>. It will shrink the font size a little but it will also tell the assistive tech that it's small footer content.
Marked as helpful
@daniel-ribas
Posted
@anthonyplicata wow, thanks for the advises! :D