Meet Landing Page with ReactJs and TailwindCSS

Community feedback

• 

  

  Emmilie Estabillo•5,580

  @emestabilloPosted over 2 years ago

  Hey James, nice job! Have you tried object-fit: contain to control the stretch of the images?

  A few other things I noticed:

  1. The document is missing its top level heading. The large header text should be an h1
  2. Interactive elements should be a tags or buttons instead of divs
  3. I personally would increase the breakpoint for desktop. The 'What is it' button and the 4 images in the next section look like they're breaking layout at 1024px.
  4. The footer text should be left-aligned on desktop.

  Hope this helps!

  0

  ---

  

  James•130

  @jte0711Posted over 2 years ago

  Hi @emestabillo ! I haven't tried that yet, honestly didn't even know about that style prop before.

  Thanks for all the feedback, totally missed them if you didn't tell me. For the header text, does it really need to be h1? Wouldn't it be fine as long as the styling make it looks the same as the design?

  0

  

  

  Emmilie Estabillo•5,580

  @emestabilloPosted over 2 years ago

  @jte0711 I highly recommend looking into semantic html for accessibility, especially if you want to set yourself apart from others in the field. You want to make your sites usable by everyone, including people with disabilities. There's tons of resources - here's one and this might also persuade you to reconsider.

  0