Frontend Mentor | Ola White's profile

All comments

Alex• 110

@aadler91

Submitted over 1 year ago

QR Code Component

Ola White• 160

@whitesoftx

Posted over 1 year ago

Good work and well laid. But you need a quick fix to clean up your accessibly issue.

It is a best practice to use both HTML 5 and ARIA landmarks to ensure all content is contained within a navigational region. In HTML5, you should use elements like main, header, nav, and footer.

For example:

  <body>
<main>
  <div class="card">
    <img src="images/image-qr-code.png" alt="QR code image, which links to frontendmentor">
    <h1>Improve your front-end skills by building projects</h1>
    <p>Scan the QR code to visit Frontend Mentor and take your coding skills to the next level</p>
  </div>
  </main>

<footer>
  <div class="attribution">
    Challenge by <a href="https://www.frontendmentor.io?ref=challenge" target="_blank">Frontend Mentor</a>. 
    Coded by <a href="https://github.com/aadler91">Alexander Adler</a>.
  </div>
</footer>
</body>

Let's keep learning... one step at a time.

Marked as helpful

ali hamid• 90

@alideel

Submitted over 2 years ago

order-summary-component-main

Ola White• 160

@whitesoftx

Posted over 2 years ago

Hey mate, good job. You've done well.

But you've got 4 accessibility issues to fix, follow through to read how to fix on the report page. Meanwhile you could start the fixing by adding h1 header as the first header tag, you can reduce the h1 font size with CSS to make it fit.

You $ ( US dollar) sign also placed after the 59.99 number, it should come before; this ways $59.99/year.

You could use the HTML code < $dollar; > to achieve the $ sign in case of regional keyboard or formatting.

Keep coding. keep learning! :)

Marked as helpful