Base-Apparel-coming-soon-page

Community feedback

• 

  Pradeep Saini•990

  @pradeeps4iniPosted over 2 years ago

  Hello, Keagan. How are you?

  Congrats on completing the project. I hope you had fun learning new stuff.

  I have some suggestions, i'd like to give.

  • Use semantic markup. You can wrap the entire card in <main> element. Semantic markup helps to make code more readable and accessible.

  • Changing the flex direction won't make the card responsive. Because the header in the mobile layout and desktop layout is on different positions. If you will go and analyze the design files. You'll see that there are three sections in the design. Header, image, and the other content. You should design your layout considering these three sections and how you can change their positions to make design more responsive.

  • You are using fixed widths for your containers, which is hindering the responsiveness of the containers. Use max-widths instead.

  • Give a descriptive alt text to the brand woman image. For example: "brand model" or "brand ambassador". Alt text should give info about the image to users who are using screen reader.

  • When resizing the font-size of the text stays constant, which makes the image go out of focus. You can use clamp() function to change the font size respective to the viewport width dynamically.

  Marked as helpful

  1

  ---

  

  Keagan Dickinson•160

  @PhisherFTWPosted over 2 years ago

  @pradeeps4ini This was a fantastic response thank you so much! alot of great information here for me to digest and learn from, I will start implementing your suggestions asap!

  Thanks

  0