Skip to content
OverviewSolutions
2
Comments
2
Satyaki Pal
@Versatile28

All comments

  • Satyaki Pal•20
    @Versatile28Posted about 1 month ago
    1. Google Fonts Not Imported: The font-family: 'Figtree' is defined but the Google Fonts import is missing. You need to add this in the <head> section:
    <link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link href="https://fonts.googleapis.com/css2?family=Figtree:wght@300;500;700;900&display=swap" rel="stylesheet">

    1. Image Border Radius Not Round Enough: The image's border-radius property needs adjustment to make it fully round.

    2. Alt Text Missing for Avatar Image: The image for the avatar has no alt attribute, which is important for accessibility. Add a descriptive alt tag:

    <img src="assets/images/image-avatar.webp" alt="Profile picture of Greg Hooper">
    1. Missing <main> Element: For better accessibility, wrap the card in a <main> tag:
    <main class="container"> <!-- Card content --> </main>
    0
  • Satyaki Pal•20
    @Versatile28Posted about 1 month ago

    Semantic HTML Use of Semantic Elements: The code uses <div> elements for the main structure, but it could be improved by incorporating more semantic HTML elements. For instance: Use a <main> tag to wrap the main content. Consider using <section> or <article> for the content that describes the QR code.

    0