Local masthead - navigation

Notice: This documentation has been deprecated

For new web site development and existing site improvement, please refer to the EBI Visual Framework (v1.1) documentation. All services are expected to use the new framework by February 2017.
Example: 
Problem: 
Users of your Service will want to be able to navigate to any of the information associated with that Service. There may be key things, across Services, that users want to be able to find or to do.
Solution: 
Below is example markup for a local navigation menu, including some recommended menu items. The items on the left can be thought of as "navigational", allowing your users to navigate to different pages of information or features of your Service. The items that are floated to the right of the menu are more "functional" in nature. <nav> <ul class="grid_24" id="local-nav"> <li class="first"><a href="#" title="Go to the [service-name] homepage">Home</a></li> <li class="active"><a href="#" title="Read documentation for [service-name]">Documentation</a></li> <li><a href="#" title="Get help and support for using [service-name]">Help</a></li> <li class="last"><a href="#">About [service-name]</a></li> <!-- If you need to include functional (as opposed to purely navigational) links in your local menu, add them here, and give them a class of "functional". Remember: you'll need a class of "last" for whichever one will show up last... For example: --> <li class="functional last"><a href="#" class="icon icon-functional" data-icon="l">Login</a></li> <li class="functional"><a href="#" class="icon icon-static" data-icon="\">Feedback</a></li> <li class="functional"><a href="#" class="icon icon-functional" data-icon="r">Share</a></li> </ul> </nav>
Usage: 
Our recommendation is to add, as a minimum, certain key items to your local navigation menu: Home, Documentation, Help and About [service-name]. We realise, though, that in some cases, you may have built these things into a web application. If not, consider having these areas of information as a minimum. Note also that you need to keep menu label text as short (but clear!) as possible. Save sentence-length descriptions for the title attributes of links.