Vanza Setia• 27,835
@vanzasetia
Posted
Hi, Dumpling! 👋
Here are some suggestions:
- No empty element: Remove the empty
<header>. A page without a header element is fine. The only landmark that a page must have is the<main>landmark. - No extra elements: Remove all the
<div>elements. Then, style all the elements directly to the elements. - Do not change the
<html>or the:rootfont size: It can cause huge accessibility implications for those users with different font sizes or zoom requirements. Grace Snow explains the issue clearly—Should I change the default HTML font-size to 62.5%?—and Joshua Comeau also does not recommend that approach—The Surprising Truth About Pixels and Accessibility: should I use pixels or rems?.
I hope this helps. Happy coding!
Marked as helpful
1
Dumpling• 10
@RVilums
Posted
@vanzasetia
Thank you, Vanza, for your valuable feedback!
I appreciate your suggestions and took the time to read the articles you recommended. I will incorporate a combination of px, em, and rem units in my code to achieve responsive typography and layout. Additionally, I will utilize the calc, min, and max functions in CSS.
Your feedback has been incredibly helpful, and I'm excited to apply these best practices in my future projects.
Happy coding!
0
Vanza Setia• 27,835
@vanzasetia
Posted
@RVilums
You are welcome!
I recommend trying Utopia. It can help you generate fluid typography with clamp() function.
1
