Responsive Redesign: City of Chicago Legistar

This is the website for the City of Chicago's Legistar, the repository of city government legislation, members, and other records -- despite being a public access point for key information, the Legistar is inefficient and difficult to navigate.

Original Website: Linked here
Redesigned Website: Linked here

Problems

• Multiple navigation bars/tabs is overly complex, especially given that the first navbar has only two items (one of which links back to the current page, which no apparent indicator that it does so)
• The second navigation bar (“council home”, “legislation”, etc) is too small to be easily readable and clickable with a touchscreen
• The sign-in link in the top right corner is very easy to miss and is missing any visual styling
• The four sections in the main body of the page (Legislation, Meetings, Legislative Bodies, and Council Members) are redundant with the second navigation bar and provide no additional functionality besides a description for each section
• It is not particularly obvious that the headers of each section are links

Accessibility Issues

WAVE reports four errors for the page (one for each of the blue images/icons for each section) relating to a lack of alt text for the images. Given that these images serve as links to their respective sections, it is especially important to include alt text describing the image and the section of the Legistar that its link leads to. WAVE also highlights a number of alerts, such as a lack of a h1 element and repetitive links in close proximity (the icon and text of a section linking to the same place, but being separate links).

Visual Design Guide