P
@shakthivel-rn
Submitted
What are you most proud of, and what would you do differently next time?
I learned how to use css variables and how to use Figma
Mudasir Nadeem
@mudasirNadeem
All comments
- Mudasir Nadeem• 90
@mudasirNadeem
Posted
hello Blocg page when i hover to the card the header color will chenge this is wrong so when i hover to the header to chenge color
and second learn more is button the not only text
0 @abiyyuaqzal
Submitted
Mudasir Nadeem• 90@mudasirNadeem
Posted
this is very good solution to improve your skill
0- Tiger Trần• 50
@tttam0113
Submitted
Mudasir Nadeem• 90@mudasirNadeem
Posted
Your solution is well-structured with semantic HTML and accessible elements like alt text and focus states. However, improving responsive design on smaller screens and adding more utility classes for reusability would enhance it further.
1 - P
@shakthivel-rn
Submitted
What are you most proud of, and what would you do differently next time?
I learned how to use css variables and how to use Figma
Mudasir Nadeem• 90@mudasirNadeem
Posted
The solution demonstrates effective use of semantic HTML and is generally well-structured, but it could improve accessibility by adding alt attributes for images and using proper heading levels. While the layout looks good, consider implementing media queries for better responsiveness on smaller screens. Overall, it closely matches the design with minor adjustments needed for optimization.
Marked as helpful
0 - fr4nbtt• 50
@fr4nbtt
Submitted
Mudasir Nadeem• 90@mudasirNadeem
Posted
Semantic HTML: The solution effectively uses semantic HTML elements, which enhances both accessibility and SEO. Using appropriate tags (like <header>, <nav>, <main>, and <footer>) helps convey the document's structure clearly.
Accessibility: Overall, the design is quite accessible. However, consider adding ARIA labels for better screen reader support and ensuring that color contrast ratios meet WCAG standards. Including keyboard navigation support would further improve accessibility.
Responsive Layout: The layout adapts well across various screen sizes, showcasing a strong mobile-first approach. It maintains usability and aesthetics on both mobile and desktop views. Testing on additional devices could help refine any minor issues.
Code Structure: The code is well-structured and readable, with clear class naming conventions that promote reusability. Including comments to explain more complex sections could further enhance clarity for future developers.
Design Consistency: The solution aligns closely with the original design specifications, maintaining key visual elements and functionality. Any minor discrepancies could be addressed by comparing with the design mockup to ensure alignment.
Marked as helpful
1
