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

Responsive Hudle Landing Page - Attempt 2

YusufWebDevβ€’ 170

@YusufWebDev


Design comparison


SolutionDesign

Solution retrospective


this is my second attempt for this challenge.

this time ive decided to use css grids for the first time . WOW WOW. so much simpler to create the layout. i really enjoyed this challenge this time around. it has motivated me alot.

as always.. your critique is welcomed.

Community feedback

drallasβ€’ 375

@Drallas

Posted

Hello Yusuf

While switching from Desktop to Mobile the mockup image and text are falling outside the visible range on the right. Try to slowly decrease their size and then switch over at a better moment. Perhaps my (imperfect) solution helps. https://drallas.github.io/Huddle-Landing-Page/

Mobile the design is off-centre to the right, 'perhaps' you have somewhere set a bigger width that the mobile viewport!? (Hint .page-grid). Mobile is also not showing the bg-mogile.svg.

You can also use the Pesticide extension to make borders quickly visible, then those issues show up easier.

I prefer the social icons from the design, your pop a bit too much for my taste. Perhaps looks at other solution what icons to use.

Also consider when you are using px or rem..

Good luck making it better!

1

YusufWebDevβ€’ 170

@YusufWebDev

Posted

@Drallas

Thank You, i will note this in my next challenge.

0
drallasβ€’ 375

@Drallas

Posted

@YusufWebDev

Hello Yusuf

Refactoring and improving on our solutions is an important part, while improving on our skills.

Frontend Mentor is also the place where i will redirect future clients / employers to sample my work and working ethos, so i'd like to shine trough my eagerness to learn and improve.

Yesterday evening I spend a considerable amount of time fixing and refactoring my four card solution based on a long list of points from mentor Grace.

No need to hurry to next challenge if there is still enough to learn from previous or current one. I think you still have enough room to improve the Huddle page.

Well that at least is my approach! :)

Greetings,...

0
YusufWebDevβ€’ 170

@YusufWebDev

Posted

@Drallas

Thank you , i appreciate that i need to learn to refactor. You are commenting on my second attempt for this challenge, please have a look at my first attempt and let me know if you see any improvement between the two attempts.

i will refactor the second attempt with your comments and suggestions. i am trying to fast pace myself so i can start a new career XD. I am spending many hours trying to figure out the best solution the first time around.

i look forward to your comments and critique between the 2 attempts at this challenge. XD

0
drallasβ€’ 375

@Drallas

Posted

@YusufWebDev

Good to spend many hours learning web-development, I think the best time spend learning is trough building and researching stuff on the go, so you came to the right place.

I admit that i didn't see you're first attempt yet; but the 2nd is definitely an improvement.

You are almost there but you Huddle page needs a bit more refinement time..

some tips:

  • hero-img size is fixed and that could be changed with min / max width properties.
  • use some margin-top to push the hero and cta a bit down.
  • Don't forget to set to mobile background.

I'd be happy to look and your third and final version! :)

0
YusufWebDevβ€’ 170

@YusufWebDev

Posted

@Drallas

thank you! i will post it as soon as i complete it. i will implement those changes and re-upload XD.

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