
Design comparison
Community feedback
- @KapteynUniversePosted 19 days ago
Merhaba Yasir, seni yolun başında yakaladığıma sevindim demek isterdim :D ama 1.5 senedir freelance çalışıyormuşsun.
Landmarks, (or this page) are essencial for accesibility. Every page needs one main. Changing your full page div or wrapping it with a main would be good.
The WCAG criteria states that line-height should be at least 1.5. 1.2 is too small for those who are dyslexic, these lines are packed too closely together, making it harder to read.
No need to use
width: 100%;
for a block element. A block-level element always takes up the full width available (stretches out to the left and right as far as it can).Avoid using fixed values like
width: 350px;
, for better responsiveness use max-width with rem;max-width: 21.875rem;
Also most of the times you don't need to set height.Never use px for the font sizes. So people with visual impairment can adjust the font size on their browser. Use rem for especially font sizes and media queries. You can also use clamp function for better responsiveness/fluid typography.
Do not skip heading levels.. Also you shouldn't use more than one h1 in one page.
Those active states in design images means that elements are interactive. So they are either hyperlinks or buttons(might be inputs or other elements that i forgot too). For this challenge, i think all of them are hyperlinks.
Also i saw
li, summary { list-style: none;}
in your css reset. You didn't use list here but for future i recommend you to check accessibility section of this page0P@yasiralakusPosted 18 days ago@KapteynUniverse Thanks for your comment, but I found it a bit harsh. Yes, I have been working as a freelancer for 1.5 years, but I also work outside of coding to support my family. I will take the things you mentioned into consideration. Thanks again.
0@KapteynUniversePosted 18 days ago@yasiralakus Sorry, it wasn't my intention to be harsh.
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