Fylo landing page with two column layout using css flexbox and grid

Community feedback

• 

  Mennatallah Hesham•1,470

  @Mennatallah-HishamPosted over 1 year ago

  Hi George, You did great 👍

  here are some suggestions to improve your code:

  ** alt**

  • for the logo img , it is better to add the website name/ brand name

   <img src="./src/assets/images/logo.svg" alt="Fylo" class="logo" />
  

  • for decorative img / illustrations you can use alt="" and add aria-hidden="true", which will skip the image for screen reader users.

  ** Footer info **

   <p class="footer__info-list-item">
            <img src="./src/assets/images/icon-phone.svg" alt="phone icon">
            <span class="text">Phone:+1-543-1234567</span>
          </p>
          <p class="footer__info-list-item">
            <img src="./src/assets/images/icon-email.svg" alt="email icon">
            <span class="text">example@fylo.com</span>
          </p>
  

  • you can use Email link, it is a <a> which gives you the option to specify an email address to send an email.

  <a href = "mailto: example@fylo.com">example@fylo.com</a>
  

  • you can also link to a telephone number using <a> by using tel:

  <a href="tel:+4733378901">
  

  • don't forget to add aria-hidden="true" to icon images

  Hope you find this helpful, Happy Coding

  Marked as helpful

  0

  ---

  

  George Asiedu•780

  @george5-starPosted over 1 year ago

  @Mennatallah-Hisham Thanks for the feedback.

  1