Skip to content
Submitted over 2 years ago

RESPONSIVE LANDING PAGE

accessibility
Gabriel Ojeaga•40
@Gabriel4PF
A solution to the Meet landing page challenge
Preview (opens in new tab)Code (opens in new tab)

Solution retrospective

Hi Guys this is my first project in a while. I plan to do a lot more this month, to be consistent. I had a lot of fun doing this challenge, there were a lot of situations where I had to think outside of the box to find solutions. Please you can review it and leave any comments, or feedback. It would be much appreciated. I noticed my background image for the footer is a bit zoomed in if anyone has any feedback on how I can improve that? Thank you

Code

Please log in to post a comment

Log in

Community feedback

  • Vanza Setia•27,715
    @vanzasetia

    Hi, Gabriel! 👋

    Congratulations on completing this challenge! 🎉

    The background image on the footer looks good in my view. I think it's okay if it is zoomed in on large screen sizes. It is just a decorative image. So, I recommend not worrying too much about it. 🙂

    There are other important things that need to be taken care of.

    • There is a horizontal scroll bar on the site. I recommend removing it by setting overflow: hidden to the .hero element.
    • For the numbers between each section, I recommend creating those with pseudo-elements instead. It is possible to do it. You can see my solution for your reference.
    • The download buttons should be anchor tags with download attribute.
    • Lastly, I recommend fixing all the issues that have been generated.

    I hope this helps! Happy coding!

    Marked as helpful
  • Doston Nabotov•950
    @dostonnabotov

    Hi, there! That looks great! However, I found some problems, too

    • with regards to your question, try setting a larger height. But, it looks good to me.
    • overflow issue on smaller screens with images. Try adding overflow-x: hidden to your body
    • don't use backslash (\) for the src attribute in your images. Use forward-slash (/) to specify the directory
    • not use of alt attribute for the images. It will fail in accessibility
    • markup is well-structured and easy to read and understand. Well done!
    • in terms of CSS, please use a prettier extension or pay close attention to how you are writing. There are some misalignments, spacing, and other issues, which are hard to read and defy the law of CSS.:)

    I hope it helps. Good luck!

    Marked as helpful
  • Gabriel Ojeaga•40
    @Gabriel4PF

    IF anyone understands my current error coming up on my report. I would appreciate if you commented. I am not sure why I am getting this error

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord