Equalizer landing page

Community feedback

• 

  Can Surer•80

  @cansurer-atPosted almost 3 years ago

  I think it is pretty good!

  1
• 

  P

  Emmilie Estabillo•5,540

  @emestabilloPosted almost 3 years ago

  Hey @DevilDoctor27 , looks real good! I wouldn't worry about being pixel-perfect. Getting as close as you can to the design is more achievable, which is what you did here. Great control on the backgrounds and images.

  A few thoughts:

  1. Header:

     • I don't see the advantage of using position: absolute on .header__inner. This div could be deleted and its padding-top can be added to header__logo
     • Since there's only one item in it (logo), you could get away without using flex and all its properties, it would still be flushed to the left.
     • I would make the logo an anchor tag to the homepage

  2. Same with flex properties on <div class="content">. This div could also be deleted. After doing so, place the .container under main instead of nesting it under .intro.

  3. For .card , again, no need to use grid. Apply margin: 0 auto; to .card__inner to center the contents.

  Hope this helps :-)

  1

  ---

  

  Volodymyr Balashov•510

  @volod-onePosted almost 3 years ago

  @emestabillo Thank you for your feedback. Sorry but my ideology doesn't let me consider numbers 1 and 2 as valuable ideas and let me explain why.

  First of all as you can see in most of my projects I use BEM methodology. BEM is good enough for me and it is easy to maintain. In large projects it really helps to reuse some sections without editing styles. And nesting container between component and component__inner one of those things which often happens if we are styling sections. So yes, technically I could remove the container but it is just easier to manage if I want to make my content width smaller or bigger and so on. Next, please check carefully my header: position absolute is not on __inner, it is on parent. It is part of ideology. If you want your header to appear on top of your page while you are scrolling and don't make it affect the styles of your content (like positioning) it is a good thing to do it in this way. Btw, if you will add more elements to the header you don't need to restile them too much because __inner is flex. Also, try to delete the main tag from my content, you will see some magic. My footer is never going to move on top of the page. Well, I realize that I could move my .content styles to the .page then remove .content, it won't affect my layout at all.

  I would say all those things above are not necessary on this small project but I am trying to practice my modular seeing of every single element of the page so if I want I can use these elements on other pages and projects.

  And about card. It was the last element of my page when I was making it so I kinda little bit tired and didn't consider margin: 0 auto at all. Thank you for pointing it out.

  Please let me know where I am wrong and what I should review again about my ideology.

  0
• 

  P

  Emmilie Estabillo•5,540

  @emestabilloPosted almost 3 years ago

  The beauty of webdev is there is more than one way to do things, so it's not about being wrong or right :-) Those are merely suggestions you may or may not implement. Keeping code maintainable is very important, and senior devs have told me to try and keep things simple. The more divs you use, the more you have to maintain. It really depends on the design and the scope of the given project.

  0