Testimonial grid section (no libraries)

Community feedback

• 

  Manshiporiya•80

  @ManshiporiyaPosted about 2 months ago

  Semantic HTML: It's great to see you used appropriate elements for your layout. However, ensure all sections have meaningful roles. For example, using <header>, <main>, <footer>, <nav> where applicable helps make your HTML more semantic and accessible.

  Accessibility: You mentioned challenges regarding the style guide and color contrast. It’s important to prioritize accessibility over strict adherence to a style guide, especially when accessibility issues are "critical." You might consider revisiting this decision, as users with visual impairments may struggle with low-contrast colors. Tools like WAVE or Lighthouse can help identify accessibility problems.

  Fluid Approach & Layout Adaptability: Switching from Flexbox to Grid seems to have worked well for your layout, but it's important to ensure responsiveness across different screen sizes. I’d recommend experimenting with a fluid approach, using relative units like % or fr units in CSS Grid, to improve adaptability. You could also include media queries to enhance the layout at smaller or larger viewport sizes.

  Style Guides: Style guides can sometimes be confusing, especially if they appear to contradict best practices. It might help to discuss the style guide with your team to better understand the rationale behind it or suggest modifications to address accessibility. Adhering to accessibility standards should ideally align with the overall goals of the project.

  Code Quality: The structure and readability of your code are important. Utilizing consistent naming conventions, comments, and well-organized CSS can help keep the codebase maintainable. Consider using utility classes or pre-processors like SASS to improve reusability.

  Alignment with Design: It would be helpful if you double-checked the solution against the provided design. For instance, small details like font sizes, padding, and colors can make a big difference in the visual consistency and user experience.

  Overall, your solution shows a good understanding of the basics, and your use of CSS Grid is commendable. In the future, aim for a more fluid approach and ensure accessibility is always prioritized. Keep up the great work!

  0