Responsive landing page with a CSS FleXbox

Community feedback

• 

  Melvin Aguilar 🧑🏻‍💻•61,140

  @MelvinAguilarPosted almost 2 years ago

  Hello there 👋. Good job on completing the challenge !

  I have some suggestions about your code that might interest you.

  • A logo is often a crucial part of a website's branding and identity, and it may contain important information for the user. you should use the company name as the alt attribute value. The word "logo" is not necessary.

  • Social media icons, which are often used to link to a company's social media profiles, should typically be anchor elements because anchor elements allows users to easily click on the icon and be taken directly to the company's social media profile page. This makes it easy for users to connect with the company on social media

    Additionally, 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="#" aria-label="Facebook"><svg ...></svg></a>

  I hope you find it useful! 😄 Above all, the solution you submitted is great!

  Happy coding!

  Marked as helpful

  0

  ---

  

  Krzysztof Rozbicki•370

  @KrzysztofRozbickiPosted almost 2 years ago

  @MelvinAguilar Thanks for the tipps - i forgot to put the svg into the <a> tags. I have one question to you - how can I put the .svg files so I can change their color in css instead of simply put the svg code in the html. I know the <svg> <use> method but it never works for me for all browser. I also dont know if you can change the fill color using <img src> on svg icons. I would really like any useful svg tips - I couldnt find solution to my issues on stack overflow :(

  0