Responsive email form using RegExp and Flexbox

Community feedback

• 

  👾 Ekaterine Mitagvaria 👾•7,600

  @catherineisonlinePosted almost 2 years ago

  Looks great! To avoid accessibility problems with the social media icons where you don't want to use text inside <a> tags, you can create a <span> tag inside the <a> tag with description text but visually hide it. Another option is also aria-hidden="true" but as I know it's also not advised.

  Marked as helpful

  0
• 

  バレンタイン 😈•64,170

  @VCaramesPosted almost 2 years ago

  Hey there! 👋 Here are some suggestions to help improve your code:

  • The logo, heading and paragraph should **be wrapped inside*8 a header that is outside the main element.

  • The “illustration” in this component serve no other purpose than to be decorative; it adds no value. Its alt tag should be left blank and have an aria-hidden=“true” to hide it from assistive technology.

  More Info:📚

  https://www.w3.org/WAI/tutorials/images/

  • The social media icons should have a aria-label to improve accessibility.

  MDN aria-label

  • Your validation needs some improvement, since the following email is considered valid; email@email@[email protected]

  If you have any questions or need further clarification, feel free to reach out to me.

  Happy Coding!🎄🎁

  0