DRUPAL FOR LEGAL AID WEBSITES

BACKGROUND

As part of the most recent DLAW project (DLAW10), Urban Insight developed a new theme that users can choose to use on their DLAW website. The new theme was designed after gathering feedback via user interviews and website manager feedback, and is designed following updated UX and design best practices, resulting in a customizable and modern look and feel.

For more than fifteen years, DLAW has powered legal aid organizations in building cost-effective websites to share critical content publicly and widely. As time went on, while technically viable, the look and feel of the website templates began to feel outdated and lacked design polish, and important features that became standard in legal aid websites were lacking.

The new theme allowed Urban Insight to address user feedback and enhance the user experience for both visitors and editors, improving the visual presentation options and usability while still leaving the design of their website flexible and at the discretion of each individual website.

THE CHALLENGE

This update posed a dual challenge: the need to redesign DLAW’s look and feel while maintaining backward compatibility with the existing DLAW sites.

The previous DLAW theme, created as part of the DLAW9 project, is accessible and keeps content rich, but can feel outdated and relies on a dot pattern that can cause confusion or turn visitors off. Additionally, the default menu can make user navigation difficult. During usability testing, participants did not always understand what was available on the site or how to best move forward for help.

Some editors and users, though, still responded well to the original theme, and we did not want to force an updated design on these organizations. This required us to not only design a new theme, but implement it in a way that would allow site editors to choose the theme they wanted used on their site. In allowing each organization to decide, we needed to empower them to make that change without development work and without introducing any bugs or broken pages.

THE SOLUTION

This process began with a User Experience Research Study to gain insights to inform the new design and functionalities. 5 DLAW website managers, 4 non-DLAW legal aid website managers, and 4 general website users were interviewed via Zoom and asked to complete specific tasks as well as give their general impressions.

Highlights and important insights included:

• Menu styles were inconsistent and the overall styling was not easy to read
• Design was described as dated and underwhelming
• Font seemed inconsistent
• Homepage sliders were deemed distracting and could delay users in finding help

From there, we created a flexible, modern design that could be utilized across organizations. The new design follows modern design and accessibility standards and meets WCAG 2.1 AA accessibility standards. If the new theme is used, fonts are updated across the site, the selected accent colors are used throughout, in various tints, a mega-menu becomes available, and the overall visual appeal increases.

We also developed a feature to allow a website editor to control what theme is being used on the site and to make a switch instantaneously while maintaining site structure and content. All functionality, from search to guided referrals, was tested across both themes to ensure compatibility.

IMPACT

Feedback through the rollout and training has been positive and confirmed that improvements have been made for both the visitor seeing the front end and the website manager updating the CMS.

The updated design results in a more modern website, which communicates to users that the website is current and consistently maintained, therefore likely to be accurate and trustworthy.

The mega menu that becomes available on the new theme allows editors much more flexibility over menu layout and size, and is a more robust and clear way for users to navigate a site.

DLAW is build to be WCAG 2.1 AA accessible and achieves a PageSpeed Insights Accessibility score of 100.