This pull request addresses the lack of mobile-friendly design elements, particularly in the navigation bar, on the current website. It ensures a responsive design that accommodates different screen sizes and enhances user experience on mobile devices. The fix adheres to Human-Computer Interaction (HCI) and Web Content Accessibility (WCA) standards, improving accessibility rates.
Motivation
The current navigation bar collapses into a single button on mobile devices, making it difficult for users with larger fingers to navigate efficiently. This update aims to improve accessibility and usability by providing a more user-friendly experience on mobile devices, aligning with HCI and WCA standards.
Testing
Testing has been performed on various devices and browsers, including iPhone 14 Pro Max, Samsung Galaxy S24, and Samsung Galaxy Fold, using iOS Safari and Android Chrome. The updated navigation bar ensures proper functionality and accessibility across different devices and screen sizes.
Title: Improved Mobile-Friendly Navigation Bar
Summary
This pull request addresses the lack of mobile-friendly design elements, particularly in the navigation bar, on the current website. It ensures a responsive design that accommodates different screen sizes and enhances user experience on mobile devices. The fix adheres to Human-Computer Interaction (HCI) and Web Content Accessibility (WCA) standards, improving accessibility rates.
Motivation
The current navigation bar collapses into a single button on mobile devices, making it difficult for users with larger fingers to navigate efficiently. This update aims to improve accessibility and usability by providing a more user-friendly experience on mobile devices, aligning with HCI and WCA standards.
Testing
Testing has been performed on various devices and browsers, including iPhone 14 Pro Max, Samsung Galaxy S24, and Samsung Galaxy Fold, using iOS Safari and Android Chrome. The updated navigation bar ensures proper functionality and accessibility across different devices and screen sizes.
Screenshots
Before
https://github.com/camicroscope/caMicroscope/assets/66128370/67925d89-21fd-4023-82de-a997ae1d386c
After
https://github.com/camicroscope/caMicroscope/assets/66128370/0bf974c7-ff33-4f0b-9c9e-b1e11ec01a51