Hi guys, this is my first project so I really apreciate any comments and suggestions you can give me. I'm very happy I finished it!
Abhijit Sarode
@AbhijitSarodeAll comments
- @NicolasEirizSubmitted almost 3 years ago@AbhijitSarodePosted almost 3 years ago
Hi Nicolas,
Your code looks pretty good for your very first submission.
<header> and <footer> tags are usually used for header and footer of the page not the component as it may create confusion if someone is using accessibility settingsYou can use responsive measuring units like rem, em, vh, vm, ch etc instead of px but be aware of the additive nature of some of the responsive units
I'll suggest you look into BEM for future submissions. Plenty of people here use good BEM, you can read their code to get better idea about it
Hope this helps
Marked as helpful0 - @FarzeenKistSubmitted almost 3 years ago
Hello everyone, I would like some feedback on the HTML markup and whether if there is a better way I could have approached the spacing/breaking the sentences to how it looks on the design. Is there anything you would have done differently?
@AbhijitSarodePosted almost 3 years agoHi Farzeen,
Your code seems well written but since there is just one component I think <main> would suffice instead of <article>
You are already using global variables for colors so instead of just mentioning the values of colors you can mention them as hsl, RGB or hex colors, It becomes little easier to use especially when intellisense doesn't work as expected
When it comes to setting values for three different scenarios(or screen sizes) I think 'clamp()' gets the job done that way you don't have to mention it separately in media query
Btw you have <body> tag declared at two different places, I don't think it's a good practice to redeclare <body> tag so do look into it.
Instead of using precise percentage on width you can use 'calc()' and let CSS do the calculation work for you
Hope this helps
0 - @9dorghamSubmitted almost 3 years ago
Hi, I am happy to see you here. If you see any thing wrong in my code leave a comment below and thanks you help me to improve myself.
@AbhijitSarodePosted almost 3 years agoHi Abdullah,
Your code seems to be well written, but I would suggest 'grid-template-areas' to layout elements in your grid.
While using measurement units go for responsive units like rem, em, %, vh, vw, ch etc instead of px or pt but be aware of the additive nature of some responsive units.
It's a personal choice but when using colors you can opt for global root variables so that in future if you ever need to change color then it becomes very easy to do so.
Try to be specific when it comes to images 'alt' descriptions
Hope this helps
Marked as helpful0 - @anetaanetteSubmitted almost 3 years ago
Hi everyone! 👋 This time I tried my best to write the code according to BEM, I hope I managed 😅 If you could take a look and tell me what I can improve I would be really grateful 😊 Thanks! 🙏 Aneta
@AbhijitSarodePosted almost 3 years agoHey Aneta 👋
As Maqsud mentioned above its hard to utilise full power of BEM in small projects nonetheless code is well written. I'll suggest more use of the responsive measurement units (e.g rem, vh, vw, ch, %, em etc but also be aware of its additive properties). You can also use functions like minmax(), max-width(), min-width(), clamp(). One more thing, you can use resets in your projects as it makes life easier in the end. You can read more about resets here https://piccalil.li/blog/a-modern-css-reset
Hope this helps Abhijit
Marked as helpful0