Design comparison
SolutionDesign
Solution retrospective
Hello. I'm William Klaiwonpen from Bangkok Thailand.
I want to become front-end Developer so If you have any suggestions on how I can improve this project, feel free to leave me a comment!
Feedback welcome 😊
Community feedback
- @grace-snowPosted 10 months ago
Hi here is some feedback
- All page content should be contained within landmarks. Every page at least needs a
main
. The attribution should be in afooter
- Only the person's name is a heading in this. There is no h2 or h3. Those are just paragraphs
- Personally I think the image is meaningful content and should have an alt description
- All of the links in this are links, not buttons in my opinion. I think they would navigate somewhere
- The order of the head matters for performance and for SEO. The title should be high up before anything like style links
- It is better for performance to link fonts in the html head instead of css imports.
- In css always use a modern css reset at the start of the styles in every project. Andy Bell has a good one you can look up and use.
- The component must not have a width. Instead, use max-width in rem. This means it will look as it should for all users no matter what device or base font size they use.
- Does the text container need to be a flex column? Block elements will stack by default. It's fine to use a flex column if you want, but there's no benefit unless you're planning to use gap perhaps.
- Font size must never be in px
- Use the colors in the style guide, not keywords like grey
- Removing outline from interactive elements is an immediate and critical accessibility failure. It makes sites completely inaccessible to keyboard users in one line of css.
Marked as helpful1 - All page content should be contained within landmarks. Every page at least needs a
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