Responsive Coming Soon Page using HTML, CSS and JS

Community feedback

• 

  Ozmar Mendoza•240

  @ozzy1136Posted about 2 years ago

  You have laid things out pretty well, nice job!

  I would recommend you look into the <picture/> element to handle the image. You can use this element with child <source/> elements that use media queries to serve the image based on the viewport size. Check out the MDN Web Docs for a reference.

  For the e-mail input, you are using the <label/> element incorrectly. This element is used to describe the input it references and usually doesn't contain images; in your case, it could be <label>Submit</label>, since the submit button doesn't have any visible text. Additionally, the browser already displays an error if the input isn't formatted correctly as an e-mail address. If you want to implement your own validation, check out the MDN Web Docs for a detailed guide.

  Lastly, read through the Accessibility and HTML reports for your solution here on Frontend Mentor, I've found them very helpful for making sure I have the basics correct.

  Marked as helpful

  0

  ---

  

  Marco Tsang•50

  @hkmarcootPosted almost 2 years ago

  @ozzy1136 Hi Ozmar I have updated with the picture tag, thanks for the MDN Web Docs link. I also fixed button without text problem using the first method in this article . A more correct email checking is added as well. Thanks for helping me out.

  1