Case Study
UF Health
The University of Florida Health is a medical network associated with the University of Florida in Gainesville, Florida. The primary objective of this project was to update the in-house Apollo WordPress theme to be responsive while keeping 100% content parity between desktop and mobile views.
Objectives
UF Health Web Services serves as the in-house design and development agency that serves both the Shands and UF sides of UF Health.
- Develop a responsive version of the custom in-house WordPress theme.
- Convert the multiple, complex mega-menus in use within the theme to be mobile friendly.
- Custom Theme features such as optional banners and call-to-actions needed to work in both mobile and desktop views.
- Ensure content was displayed in a mobile friendly way and that 100% of content was retained from desktop to mobile.
Development
- Researched mobile navigation patterns and determined an off-canvas mobile navigation pattern to be the best candidate.
- Developed a custom walker class to step through the menu data and generate the mobile menu HTML.
- Created JavaScript functions to open, collapse, and highlight active navigation elements for easier navigation awareness using JQuery.
- Used SASS as a CSS preprocessor to streamline CSS management and development.
- Source control using Git.
Results
This updated theme allowed the UF Health academic websites that were powered by the Apollo theme to be easily accessed on mobile devices. This means users on any device or platform can access the information and websites for the colleges. Mobile device usage is skyrocketing this is a huge improvement for the users of these websites.
