Chicago’s Office of the City Clerk (“OCC”) is the most visited office in Chicago government. Citizens regularly use the OCC’s primary website to get information about how to purchase Chicago city vehicle stickers, search prior City Council agendas and legislation, and tune in for the live streaming of Chicago City Council meetings.
The office is known for its technological innovation: it recently moved the purchase of Chicago city vehicle stickers to a year-round online purchasing system, replacing the nearly century-old process of having citizens stand in line once a year to purchase such stickers in person. That mission of innovation was not reflected in its old website, however. The old website was a mix of WordPress and custom PHP files, with document storage split across multiple domains.
On the old site, maintenance was difficult, with simple site content changes often requiring a knowledge of HTML and CSS that OCC staff didn’t have. Additionally, the site was not easily used from mobile devices, despite the fact that nearly 50% of the site traffic came from such devices. OCC knew that it needed an overhaul for its website in order to serve the residents of Chicago for years to come.
The Office of the City Clerk was open to re-platforming its website on nearly any standard CMS, but was already leaning toward an open source solution. The OCC ultimately chose a Drupal solution because of its large community (and thus deep developer resources for future support), its facility for integrations with other systems, its regular security updates, and the demonstrated flexibility to easily add content and functionality. Drupal’s low implementation and ongoing support cost is important too -- since the OCC is ultimately accountable to Chicago taxpayers, it’s important that its budget be spent as wisely and efficiently as possible.
The Office of the City Clerk had high ambitions for the new website.
Responsive Design
The new site had to be responsively designed and visually engaging, so that current and future website users would be able to easily navigate the site, regardless of the device they were using. Drupal accomplishes this out of the box, and the OCC has been specifically praised for this by people using the new site.
Branded Solutions
The new website needed to visually integrate with the OCC’s other digital properties: EZBuy, where users can purchase Chicago city vehicle stickers, parking permits, and dog licenses; and Legistar, where users can track and search legislation and archived Chicago City Council meeting information. The previous incarnation of these digital properties all looked very different from each other and the information was disorganized, which gave site visitors a jarring experience moving from site to site. The new website was designed with this in mind, and now when users move between the sites, it’s a cohesive user experience.
Cross-Site Integration
A third goal, very much related to the second, was to be able to share content between the ChiCityClerk.com website and the EZBuy application. In the previous incarnation of the EZBuy application, even minor text changes on a page required a coordinated release with city IT staff, planned well in advance.
The first order of business was to streamline their existing content, and Clarity was able to use the Feed Import module to easily organize the 22 years' worth of documents into folders based on their type, taxonomy and year of release. This made management of the documents considerably easier for content administrators.
OCC also wanted to take advantage of Drupal’s easy content editing capabilities to shift the editorial burden from the EZBuy application to the website. In order to make that possible, Clarity used the CORS module, which allows XMLHttpRequests to another domain. Such "cross-domain" requests would otherwise be forbidden by web browsers for security reasons, but with the CORS module in place, in combination with the Views Datasource module, EZBuy FAQ content can be administered via the website. Now because that text content is shared between the website and the application, OCC staff can make minor text changes quickly, whenever required.
Easy Administration
Another requirement was to make the ChiCityClerk.com website easier to administer overall. In the past, even simple content changes would require a developer’s assistance, and a developer needed to be on call for any City Council meeting in order to implement the code required to enable the live video streaming for the meeting.
Now through the use of modules like DraggableViews, OCC staff are able to make simple content changes such as rearranging listing pages in the site, and a custom Clarity-developed module allows administrative users to toggle live streaming on and off through a simple administrative interface. Additionally, OCC staff were trained on Drupal’s built-in features such as menus, and they have been empowered to move website menu items as they consolidate information.
Stable and Secure
Finally, the Office of the City Clerk was looking for a long-term, secure solution. With Drupal’s regular security updates, the use of modules like Security Review for proactive automated testing against common security holes, and Amazon’s Web Services (AWS) datacenter security, the OCC feels that their website is properly protected from unwanted intrusions.
Results
The launch of the new ChiCityClerk.com website at the end of October 2015 has been a complete success. Page load time has been reduced by over 30%, the bounce rate has been reduced by 27%, and Chicago citizens are responding on social media channels with praise for the new user experience: "This raises the the bar for city clerks everywhere;" "You deserve to brag."
In setting up SFTP for the client (for very large documents that could not be uploaded via file browsing) we had to use two patches from the IMCE issue queue. We were able to provide community review on these patches and they should soon be making their way into the main code of the module.
The Clarity project team included:
- Gerald Angelo, Themer and Supporting Developer
- Marc DeLay, Drupal Architect
- Melissa McEwen, Themer and Supporting Developer
- Kelly Tetterton, Project Manager