Skip to content
OverviewSolutions
39
Comments
2
MasterKrab
@MasterKrab

All comments

  • MasterKrab•940
    @MasterKrabPosted over 3 years ago

    Great job on this challenge!

    I have a couple of recommendations:

    • The input should have a valid accessibility name, such as a label with a for attribute or an aria-label. Also since it is a field for the email it should have type="email".
    <label for="email">Email</label>
<input type="email" id="email">

<-- Or --->

<input type="email" aria-label="email">
    • The section and article should have a title (h1-h6), or you can use an aria-label as well.
    <article>
 <h2>Title</h2>
 <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. </p>
</article>

<-- Or -->

<article aria-label="Title">
 <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. </p>
</article>
    0
  • Roc Tanweer•2,500
    @RocTanweerSubmitted over 3 years ago

    Hello folks 😀

    This challenge was awesome and taught me a lot of things on the way...!

    In this challenge I learned how you can apply fluid typography to width, height and font sizes to make things **fully responsive..! ** 😍 This web site is fully responsive without much use of media queries

    There are a lot of things that I learned while being with this project, at the same time I believe I have missed some things and details😅 . But that's why we have each other, wouldn't you say? 🤗

    Questions

    1. How can I make my Js simpler?
    2. Is there something that I missed while making HTML structure, like should have used this tag instead of that or you missed something?
    3. How can I make my sass code more scalable?

    Any other feedbacks are very much welcome 😊

    Let's learn together, grow together and Become the best Web developer..! 😎

    Happy Coding..! 😴

    HTML5, SCSS, Vanilla Js, Fluid Typography

    2
    MasterKrab•940
    @MasterKrabPosted over 3 years ago

    Hello Roc Tanweer, great job on this challenge!

    I think I can help you with a couple of suggestions.

    • You can add an aria-label to links with descriptive text for screen reader users.
    <a href="#" aria-label="Description">
  <i class="icon" aria-hidden="true"></i>
</a>

    • I think the "More info" button should be a link because it will probably send you to another page with more information.

    • The download-box should be an article or section and not just a div.

    • The hover effects should only be on desktop because on mobile is problematic and does not make sense to place it.

    I hope you find it useful, let me know what you think.

    Happy coding!

    1