Responsive landing page using Flexbox

on this website you can put the color you want in hex which will generate the filter automatically. congratulations on the solution

https://angel-rs.github.io/css-color-filter-generator/

Hi Victor Paumier,

Congratulation on completing this challenge. Excellent work! I have some suggestions regarding your solution if you don’t mind:

• Well done with adding thearia-expandedand aria-controlson the toggle.

• As the button has no discernible name, put an aria-label on your trigger to describe its purpose. For example, you can have: aria-label='Mobile Navigation Trigger' or 'Open Menu.’

• You should use aria-controls attribute on the toggle element, it should reference the id value of the <ul> element.

• look up a bit more about how and when to write alt text on images. Learn the differences with decorative/meaningless images vs important content. For decorative images, you set an empty alt to it with an aria-hidden=”true” to remove that element from the accessibility tree. This can improve the experience for assistive technology users by hiding purely decorative images.

• Use the<nav > landmark to wrap the footer navigation with aria-label=”secondary “ or aria-label=”footer”. A brief description of the purpose of the navigation, omitting the term "navigation", as the screen reader will read both the role and the contents of the label. Thenav element in the header could use an aria-label="primary" or aria-label=”main” attribute on it. The reason for this is that, You should add the aria-label for a nav element if you are using the nav more than once on the pag..you can read more in MDN

• You may use semantic an unordered list <ul>to wrap the social links class="footer__social-medias", you put your links within an unordered list structure so that a screen reader will read out how many things are in the list to give visually impaired users the most information possible about the contents of the navigation.

• The links wrapping the social images must have aria-label or sr-only text indicate where the link will take the user. Then add aria-hidden=”true” to the images that make them be ignored by screen readers to avoid redundancy and repetition.

Overall, Your solution is good. Hopefully this feedback helps.