CDC.gov

Project Overview: Current CDC.gov Template Redesign

The latest version of the CDC.gov Template introduces a brand-new layout, significantly reducing the amount of code and bringing in a fresh theme and color scheme and components which are aligned with the U.S. Web Design System (USWDS). This version was rewritten from the ground up using a heavily customized Bootstrap 5 framework, integrating with the new Content Management System (CMS) and providing a modern, streamlined experience.

Innovative Features and Layout Enhancements

This new Template includes several new features, such as a dynamic hero area, smooth animations, and a sticky right rail for better navigation. It uses structured layouts with semantic elements like main, section, and aside; the HTML elements chosen accurately reflect the purpose and content, enhancing clarity and accessibility. Additionally, new menus and sticky navigation were introduced to enhance user experience on both desktop and mobile. The use of Animate on Scroll (AOS) brings sections to life as users scroll through the page.

Updated Components and Features

All components in the Template have been updated with the latest design standards. Custom SCSS mixins and an object-oriented approach to JavaScript provide a robust foundation for future enhancements, ensuring scalability and maintainability.

Collaboration and Seamless Integration

The development process involved close collaboration with both UX and back-end developers, ensuring that design updates were not only visually appealing but also fully integrated with the new CMS. The end result is a Template that is both user-friendly and easy to manage, providing a cohesive experience across all CDC.gov pages.