Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

All comments

  • joaoggp 30

    @joaoggp

    Submitted

    What are you most proud of, and what would you do differently next time?

    I'm learning now so some centering and display attributes are still challenging.

    What challenges did you encounter, and how did you overcome them?

    Display Attributes and centralization. Searching about this on google and trying again and again.

    @ttvclvckPWNERS

    Posted

    Semantic HTML: The use of semantic HTML in your solution is strong. You've appropriately used tags like <header>, <main>, and <footer>, which not only improve accessibility but also make the code more readable. However, ensure that all elements within these tags are also semantically appropriate (e.g., using <h1> for the main heading).

    Accessibility: Your solution is generally accessible, but there are a few areas where improvements could be made:

    • Ensure that images, including the QR code, have alt attributes that describe their content. This helps screen readers convey the purpose of the image to users with visual impairments.
    • Consider adding aria-labels or aria-described by for interactive elements to provide additional context for assistive technologies.
    • Verify color contrast ratios to make sure the text is legible for users with visual impairments.

    Responsive Layout: The layout looks good across a range of screen sizes. The content scales well, and the QR code remains easily accessible on smaller screens. One suggestion is to test the layout on very small screen widths to ensure no elements are too cramped or overlapping.

    Code Structure and Readability: Your code is well-structured and easy to read. You’ve done a great job of keeping it organized and using descriptive class names. To improve reusability:

    • Consider modularizing your CSS by using more classes and fewer IDs, as classes can be reused across different components.
    • Group related CSS properties together and remove any redundant styles to streamline the code.

    Design Consistency: Your solution closely follows the design, which is great. There are no significant deviations that would detract from the user experience. However, always check the finer details, like padding, margins, and font sizes, to ensure they match the design specifications exactly.

    Marked as helpful

    1