Feedback on Product Landing Project

I’m as done with this project today as I’m gonna be till tomorrow but there are things I know could be better. My colors are flat, my alignments are all wrong, my mobile formatting is atrocious, and the header bar needs a lot of work with the selectors.

I just have no clue how to fix these things and yes, I did do the courses, I’m just an awful student and only really learn when I’m in the thick of things (probably why I failed Algebra). If anyone could give me some pointers on a fix that would be great. https://codepen.io/Smellbringer/pen/XWjNGEx

Hey @Smellbringer!
This page looks good!

  • Make the Header width 100%.
  • Add text at the Bottom like “Made by Smellbringer”.

Hi,

Congratulations on passing all those tests.
The page looks good enough but I agree, the colors are flat.
I am awful with colors as well and I go to sites like these: https://coolors.co/ (click on explore in the top right of the page. I look at color schemes and try them out. (use variables in your css, there’s a challenge about that, it’s easy to replace them quickly and see what the effect is). There are also a few good color schemes here: https://www.w3schools.com/colors/colors_palettes.asp
The fonts are not bad, they feel good to me. I think the font-sizes could be bigger in the navbar.
Instead of images (launcher integration, emulator integration, fullscreen mode) I would use icons like you can find on Font awesome (just google that) . The site allows you to sign up for free and use their icons. They are responsive and easy to resize without loss of image quality. You can give them colors of your own choosing and well, I use them all the time.
The overall layout has a good feel to it. The alignment is not bad at all, I would add more space between the sections, it feels a little squeezed together and the links in the navbar don’t really lead you anywhere.
I notice there’s some space between your header and the page on the right side and your logo disappears when the width of your screen decreases. I think that display; flex and flex-basis, flex-shrink could help you deal with this.

Greets,
Karin

I feel like I’m using this site as my personal ask board due to how Sunday went but I finally got this done, and in a way I’m happy with. Thoughts would be appreciated though. https://codepen.io/Smellbringer/pen/XWjNGEx

Hi @Smellbringer, nice page although I’m not sure what it’s about. The only suggestion I have is to run your code through the W3C Code Validator. Ignore the first three messages, and address the others.

1 Like