@MelvinAguilar
Posted
Hello there π. Good job on completing the challenge !
I have some feedback for you if you want to improve your code.
- You should use the
aria-label
attribute to describe the links if they don't have visible text, this will help screen reader users to understand the purpose of the link.
e.g. <a href="#footer" class="facebook fa-brands fa-square-facebook" aria-label="Facebook"></a>
- For the company logo you should only use the company name as the
alt
attribute value. The word "logo" is not necessary, The screen reader users will hear "Graphic, Company name" and they will understand that the image is a logo.
-
Use a hidden label for the form. The sr-only label element is used to provide a label for an input element that is only visible to screen readers. This allows the input element to be properly labeled and described for users who are using assistive technologies such as screen readers. This helps ensure that all users, regardless of their abilities, can understand and use the form.
The class "sr-only" hides content visually and here are the styles to copy.
<form> <label for="email" class="sr-only">Name:</label> <input type="email" id="email" name="email"> </form>
I hope you find it useful! π Above all, the solution you submitted is great!
Happy coding!
Marked as helpful