Room homepage with sass

Community feedback

• 

  

  Grace•32,130

  @grace-snow

  Posted over 4 years ago

  Hi Mills,

  This looks OK on mobile but isn't quite matching the design in some places like image height and nav styles.

  I can spot a few issues with the html that could do with some attention too:

  • interactive elements need to use interactive html tags like links or buttons
  • you can only have one h1 per page. It's not right to have the logo as a h1, but it is hard to know what to do with this site as its not clear what the h1 should be due to the slider content. I'd be tempted to add a hidden h1 to the page, or make the title of the first slide a h1 and nothing else
  • as well as being an interactive element, the hamburger needs to clearly link to the menu with attributes like aria-controls and aria-expanded. And it should sit within the nav element.
  • you could use the rel=next on the next button (link) and similar for the previous button for better semantics too

  Your js looks pretty good to me. A best practice tip for future would be to get into the habit of always selecting elements with a consistent class syntax. Eg I like to use js- prefixed class names for anything I'm going to select in javascript, so it's really obvious what that class is doing. It's much harder if you're using a mixture of classes and ids and element selectors in your js, and once you're working in a team these can cause problems as other devs are more likely to change those things in the html. If they see a js- class there they won't change it.

  Hope thats helpful advice. Keep going ☺

  21