Skip to content
OverviewSolutions
10
Comments
2
Mariem Bchir
@Mabchir

All comments

  • Shashree Samuel•9,260
    @shashreesamuelSubmitted over 2 years ago

    Feel free to leave feedback on my solution and let me know specifically if I am overlooking a concept in relation to the input field and the button. Thanks in advance for your feedback.

    Ping Single Column Coming Soon Page

    2
    Mariem Bchir•140
    @MabchirPosted over 2 years ago

    Overall it looks pretty neat ! Good Job!

    Areas of improvement:

    • Maybe centering things in a way that you won't need to scroll on the 1440 screen to see the copyright sentence
    • You can use flexbox for the group (or notify me section), you easily adjust it for smaller screens my favorite flexbox guide I use in all projects
    • Social media icon border you can use the following attributes:
    1. border: 1px solid gray;
    2. border-radius: 25px;
    Marked as helpful
    0
  • Mariem Bchir•140
    @MabchirPosted over 2 years ago

    Great job on :

    • using rem instead of px
    • using intuitive class names
    • guessing the fonts and font sizes! (I am sure if you had the figma file it would look just like the original design)
    • using the root variables for style variables
    • resetting your styles before adding your own styling!

    Areas of improvement:

    • The background image can be add using the following:

    body { background-image: url('w3css.gif'); background-repeat: no-repeat; }

    • The container_subtitle was closed by a h2 tag instead of h1
    • avoid using <br/>, instead play with the margins or padding
    • avoid leaving alt empty, you can describe it instead
    • for the logo alt don't forget to add the name of the product/brand in addition to the description
    • responsiveness can be a bit better - maybe it will help if you started with the mobile design before the desktop? I was recently given that advice. I tried it and made things much simpler.
    • you can change the image source for the container image instead of changing the height. that will be better for the user's phone while downloading the page. (instead of downloading a huge image size, they download the small mobile-friendly one)
    Marked as helpful
    0