Design comparison
Solution retrospective
Hi-yo, this is my solution for the Huddle landing page
I used Grid and Flexbox and I did my best to make it function as it is supposed to. I had issues with the background image for a bit as well as the hover states.
Any advice appreciated
Community feedback
- @HusseinSamyPosted about 1 year ago
Hello @ofthewildfire, ππ»
Awesome job on taking the first steps towards your dream!
I'm thrilled to see your engagement with this platform to enhance your design skills. However, I have some suggestions for you:
- Adding meta tags to enhance the SEO, such as:
<meta name="title" content="My Website"> <meta name="description" content="My Website Description"> <meta name="keywords" content="Some, Keywords, Here">
-
Correct me if I am wrong, but I think that you are using the modifiers (in BEM naming convention) at the wrong place β they should be used to changes the appearance of the block. Here is their docs
-
Leaving some space and writing comments in your HTML can save you sometime when navigating your code, something like this:
< ========== > < Left Section > < ========== > <section> <-- Left Image --> <img> <-- Attribution --> <div> </div> </section> < =========== > < Right Section > < =========== > <section> ... </section>
Hope you find it useful!π
Keep up the fantastic work, and happy coding! π
Marked as helpful0@ofthewildfirePosted about 1 year ago@HusseinSamy Thank you for the suggestions and corrections :) I wasn't using BEM at all πbut you've reminded me I do have to learn it, so I'll learn the BEM method and implement it ASAP.
I'll also add comments β¨β₯οΈ
1@HusseinSamyPosted about 1 year ago@ofthewildfire Actually, you're using it in your own way π, it's easy don't worry. Wish you all the luck β¨
1
Please log in to post a comment
Log in with GitHubJoin 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