Header Navigation Bar
The Header is the main component of navigation for
all GL Homes System. It allows the user to move through all the sections and
subsections on an application.
Use Case
- For all applications on Mobile and Desktop versions, as it contains all main navigational elements.
HTML
Do's & Dont's
Test the Navbar in different screen sizes
Depending on the device used to display your content, the Navbar
will adjust its size to better fit the screen. Be mindful of these
adjustments, and pay close attention to the gap (identified as
“Adaptable Gap” in the Spacing & Size content above), and make sure
it is correctly displayed in all sizes.
Use nomenclature from GL Homes systems
When defining names for each section/dropdowns, keep in mind that
all of our systems are designed for a streamlined experience,
therefore our content and titles should be consistent throughout the
platform. Take a look at other systems and how they name their
Homepage, Search, and other universal interactions.
Don’t overcrowd the Navbar
Spacing is a defining attribute of our Navbar. If you need to add
more text than the current version allows for, please use a larger
and more flexible format. If that is still not a good fit, please
get in touch with the UIUX Team and we will work with you developing
a good solution.
Alternative and Related components
