Competitive chess has been a hobby of mine since middle school, and the USCF is the national organization for chess tournaments. I saw that their site had recently been remade but still had several issues, so I thought it would be interesting to try and redesign their website in a better way.
The website I chose to do was uschess.org.
Redesign the USCF website to make it better in terms of accessibility and visual design.
I identified a few major issues with the website below:
More problems with accessibility were found with the help of WebAIM WAVE, a tool to assess the accessibility of websites. The blue text has a low contrast with the background and could be detrimental to people with visual impairments. Several of the images do not have alternative text. All the links on the page do not contain text. There are also redundant links on the stories featured on the page. For the most part, I don’t think the links not containing text are a problem, since they work and look fine. I agree that the low contrast text could be fixed.
Below are Figma prototypes of the website in three different device formats.
Desktop View
Tablet View
Mobile View
Using the hi-fi prototype as reference, I recreated the new design using HTML and CSS to the best of my ability. The new version is easier to read and makes the most out of the given space. It is responsive when viewing the page from different devices so that no weird formatting issues arise on smaller screens.
Check out the website here!