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
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Fylo dark theme landing page

MD Salahuddin• 150

@mdsalahuddin2001

Desktop design screenshot for the Fylo dark theme landing page coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
2junior
View challenge

Design comparison


SolutionDesign

Solution retrospective


I am eagerly waiting for your valuable feedbacks and suggestins

Community feedback

@IuliiaKonovalova

Posted

That's an amazing solution! Really! What I would add is to add some settings to the background image in <header> by adding background size: cover, and changing background-position to bottom center. In this case it will not go to the left size of the screen on the big desktop screens. And keep eye on the h1, h2, h3, h4 tags... You have to have only one <h1>, and the following should increase one by one. In you code you used <h2> and <h4> without <h3>. One more thing: add the following to the <a> links: rel="noopener" target="_blank" and aria-label="some text explaining what will happen if you click this link">

1

MD Salahuddin• 150

@mdsalahuddin2001

Posted

@IuliiaKonovalova Thank for your valuable suggestions

0
Kamasah-Dickson• 5,610

@Kamasah-Dickson

Posted

So to help with the accessibility issue remember to use only one H1 tag in your solutions it should be at the top.

Also wrap everything in a semantic tag maybe a <main>

1

MD Salahuddin• 150

@mdsalahuddin2001

Posted

@Kamasah-Dickson Thanks for your helpful feedback

0
Kamasah-Dickson• 5,610

@Kamasah-Dickson

Posted

I think that's a very great solution there...nice and clean. can you share how you were able to add the dark background svg?

Keep up with the good work:)

1

MD Salahuddin• 150

@mdsalahuddin2001

Posted

@Kamasah-Dickson You can get the source code from here - https://github.com/mdsalahuddin2001/frontendmentor-challanges/tree/main/fylo-dark-theme

0

Please log in to post a comment

Log in with GitHub
Discord logo

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