Design comparison
Solution retrospective
Bạn tự hào nhất về việc đây là dự án tôi làm nhanh nhất.
What challenges did you encounter, and how did you overcome them?không có
What specific areas of your project would you like help with?Tôi muốn các bạn nhận xét về việc sử dụng nguyên tắc BEM và các semantic đã chính xác hay chưa?
Community feedback
- @chilldeleuzePosted about 1 month ago
Good job, you nailed the design.
There's a small issue with the buttons though: They would only work if the user clicks directly on the text. A click anywhere else on the buttons wouldn't open the link. You might want to get rid of the
<div class="box-social">
and instead rely only on the<a>
.It seems like you used BEM, or some variant. Maybe try to use double dashes between block and element, so the code is a little more readable (e.g.
.box--profile
. I also think leaving an empty space between the css-selector and the opening curly brace is a good idea, since it increases readability.Marked as helpful0 - @AdrianoEscarabotePosted about 1 month ago
Hey Tran Thi Yen Nhi, how’s it going? I was really impressed with your project’s result, though I have some advice that could be helpful:
Consider using
rem
for font sizes. When font sizes are set in absolute units like pixels, users can't adjust the text size based on their preferences. Relative units likerem
adapt to the screen size and user settings, making them more flexible across various devices.If you'd rather keep using
px
, you can download a handy VS Code extension that converts pixels torem
automaticallylink -> px to rem
Since this project is only based on a single page component, there is no need for a h1 tag. It's always a good idea to prevent accessibility errors, so I believe it would be beneficial for you to add a "h1" in this component. Don't worry if you forget about "h1," though; it's a good practice for when you are developing larger sites.
<h1>Welcome to Social links profile</h1>
Everything else looks great.
Hope this helps! 👍
0
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