Not Found
Not Found
Not Found
Not Found
Not Found
Failed to decode param 'order-summary-component-gCBkGCVS5%20-%20Issues%20%B7%20joaomaia-code'
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Huddle landing page with single introductory section

@redKath


Design Comparison

SolutionDesign

Report

2

Accessibility Issues

7

HTML Issues

View Report

Kathleen Jogno’s questions for the community

For the background image of the desktop screen size, I used a fixed attachment in the body, is that a good practice? I did it because when the site is zoomed out or zoomed in the background image moves and doesn't cover the entire screen. I also put a background-size: cover. Is that a good practice as well? I'm quite unsure of how to deal with backgrounds, so your feedback would be a huge help. Thank you so much.

Community Feedback

P
Vanza Setia• 16,765

@vanzasetia

Posted

Hi, Kathleen Jogno! 👋

Regarding the background image, I notice something interesting. When I first visited the site, the FPS (Frames Per Second) gets dropped a bit. But, after I disable the background-attachment: fixed, fixed;, the FPS gets stable again. Based on this experiment, I think fixed background can potentially impact the performance of the website. 😅

For the background-size, I set it to cover too for my solution and it works well. So, I don't see anything wrong with it. 😉

For the background color (#674BB1), you don't need to set any other background properties. It will fill the entire page (simply works well by default). So, I suggest removing the second values on the other background properties.

That's it! I hope this answer your questions!

0

Please focus on giving high-quality, helpful feedback and answering any questions redKath might have. Here are some key points to consider:

  • Does the solution include semantic HTML?
  • Is it accessible, and what improvements could be made?
  • Does the layout look good on a range of screen sizes?
  • Is the code well-structured, readable, and reusable?

You can read our community guidelines if you're unsure what to post.

Slack logo

Join our Slack community

Join over 100,000 people taking the challenges, talking about their code, helping each other, and chatting about all things front-end!