NACCHO: Roots Redesign

Client Background

The National Association of County and City Health Officials (NACCHO) supports local health departments with the tools and resources needed to enhance public health across the country. The NACCHO Roots website serves as a primary platform to engage stakeholders, deliver educational content, and promote public health initiatives. The Roots Redesign project aims to improve user engagement, streamline access to resources, and enhance the platform’s overall usability and accessibility.

Project Goals

1. Enhance User Experience: Redesign the site layout with an emphasis on intuitive navigation, clean design, and user-friendly interfaces.

2. Implement Interactive Features: Add interactive elements to provide users with a more engaging experience and highlight critical information.

3. Improve Accessibility: Ensure that all new features and existing content meet or exceed WCAG accessibility standards.

4. Optimize Content Management: Streamline the process of adding and updating content to ensure that NACCHO staff can efficiently manage resources and information.

5. Performance and Responsiveness: Ensure that all site elements are optimized for performance across devices, particularly mobile, to cater to a diverse audience.

Challenges and Solutions

1. Interactive Feature Enhancement

• Challenge: Incorporating new interactive elements, such as tooltips, carousels, and interactive infographics, in a way that doesn’t hinder site speed or accessibility.

• Solution: Employed optimized JavaScript libraries and conditional loading to ensure interactivity without sacrificing page load times or accessibility standards.

2. Content Accessibility and Visibility

• Challenge: Ensuring all content adheres to accessibility standards, especially with visually complex interactive features.

• Solution: Added ARIA roles and labels, and tested each interactive element to verify compatibility with screen readers and keyboard navigation.

3. Optimized Content Import System

• Challenge: Frequent updates to educational resources and articles made it essential to streamline the content import process.

• Solution: Utilized automated import scripts compatible with NACCHO’s CMS, reducing manual input and maintaining content accuracy.

4. Cross-Platform Responsiveness

• Challenge: Ensuring a consistent user experience across multiple devices, with special attention to mobile and tablet views.

• Solution: Refined CSS media queries to improve responsiveness across screen sizes, specifically targeting interactive and visually intensive sections.

5. Data Management and Storage Efficiency

• Challenge: Maintaining high-performance standards with a large and growing dataset of resources and interactive components.

• Solution: Optimized database queries and implemented caching strategies to handle increased traffic and data storage demands.

Deployment and Testing

• Staggered Deployment: The redesigned features and interactive components were deployed incrementally across development environments, allowing for targeted testing and adjustments.

• Accessibility and Usability Testing: Each interactive feature was tested on various devices and browsers, focusing on accessibility compliance and user-friendliness.

• Cross-Device Validation: Conducted testing on both desktop and mobile devices to ensure consistent performance and responsiveness across different platforms.

Results

• Enhanced User Engagement: Interactive elements and improved navigation contributed to a more engaging experience, encouraging users to explore resources and educational content.

• Improved Content Management: The streamlined import process has enabled NACCHO staff to efficiently manage and update resources, keeping content timely and relevant.

• Accessibility Compliance: The site now meets WCAG standards, with refined accessibility measures that accommodate users relying on screen readers and keyboard navigation.

• Performance Optimization: Optimized scripts and caching have resulted in faster load times and a seamless experience across devices.

Value Added

• Efficient Content Management System: The redesign supports easy content management, empowering NACCHO to provide timely updates and maintain resource quality.

• Long-Term Accessibility and Scalability: By adhering to accessibility standards and optimizing performance, the site is prepared for future growth and evolving user needs.

• Enhanced User Experience: The combination of interactive features and responsive design enhances user engagement, fostering a more effective and enjoyable learning environment.