A Mobile first Responsive landing page using scss and flex-box & grid.

Community feedback

• 

  P

  Dave•5,295

  @dwhenson

  Posted almost 4 years ago

  Hey @talentlessDeveloper (nice name - I have no talent either, but I find persistent hard work and luck makes up for this!). Lovely job here 🙌

  Here's some comments focused on the HTML as that is what you are working on:

  • I'm not sure you need to wrap your logo in a figure element, or many of the other images. You can just add the img directly

  • For your alt text, please remember that this will be read out by screen readers so the text should describe the image. It shouldn't be a file name/class descriptor like you have.

  • I think that your button in the first intro section should be a link. It's worth having a google and reading up on the difference between a and button elements.

  • Inside your features section, I would suggest that you might consider putting these items in a ul rarther than a div. This will announce to people using assistive tech how many items then can expect.

  • Similarly for the testimonials, you could consider wrapping these in a ul as well for the same reasons.

  • In the form, I would consider adding the novalidate attribute to the form using JS, that way if JS fails for any reason, you can fall back to the browser validation.

  • I would put the list of links to other pages in the foooter inside a nav element. It's fine to have more than one on a page.

  Aside from the basics of alt attributes on your images, and not removing outline properties (or adding a styled alternative) I wouldn't worry at this stage about accessibility too much at this stage. If you focus on getting the right HTML element for the job, you are already 90% of the way there. Once you have that down you can go on to think about some of the finer points...

  Hope this helps - Lovely job over all 👍

  Cheers 👋

  Dave

  61

  Marked as helpful
• 

  Fidel Lim•2,775

  @fidellim

  Posted almost 4 years ago

  Hi!

  Great work finishing the project! Just a suggestion I would like to share, you can change the media query width of your footer from around 640px to 760px, the site is not responsive. This is because the social icons on the footer prevent the footer from shrinking.

  I hope it helps :)

  11

  Marked as helpful