Mixing links and dynamic options?
I'm building a web-app and trying to figure out its navigation. There are two similar pages, linked to from the navbar on the top. On each of these pages there is a dropdown with options -- on page 1 this is split into 2 sections, on page 2 it isn't:
download bmml source – Wireframes created with Balsamiq Mockups
Due to the layout, this ends up using a lot of space on the page. The idea is to move these options into the navbar. (Boss's idea.) He wants it like this:
Here, the dropdowns for A and B are hooked up to JavaScript, while the dropdown for page 2 navigates to another webpage. (The pages are different enough that i do not want to figure out how to get all the content on one page.) The dropdowns are just navigation and do not change -- the currently selected item is represented off to the side.
I suggested something a little different:
The page 1 dropdown is still hooked up to JS, and page 2 still takes you to another link.
What is the best way to build this interface?
It is likely that more types will be added to page 1 in the future, and possible but unlikely that page 2 will be split into types.