Changes between Version 13 and Version 14 of SimplifyingBeWelcome


Ignore:
Timestamp:
Apr 20, 2008, 5:37:26 PM (11 years ago)
Author:
lemon-head
Comment:

--

Legend:

Unmodified
Added
Removed
Modified
  • SimplifyingBeWelcome

    v13 v14  
    5151
    5252ok, thinking more about it.. how do I navigate to "my messages" ? Put this in a sidebar? Or a css dropdown? (these can be tricky on IE6). Navigation bites :( Well, I still like the layout :)
     53
     54-- lemon-head
     55
     56----
     57
     58
     59
     60(from a message on mailinglist)
     61
     62
     63The problem of squeezing in essential navigation without clutter is not a
     64new one, not at all. Thus, it is a good idea to look at other websites,
     65and how they do it.
     66
     67What I propose:
     68It won't help to have endless discussions about different theoretic
     69layouts.
     70Instead, we should make basic implementations or drafts for different of
     71the below solutions and compare which is best for us.
     72
     73See
     74 * NavigationSidebar - talk about layout with navigation in sidebar
     75 * NavigationDropdowns - talk about layout with navigation dropdown menus
     76
     77
     78Typical solutions found on other websites:
     79
     80a) navigation sidebar (our sidebar does not count, because it appears as
     81part of the content, and not as something outside meant for navigation).
     82Examples: gmail, studivz, a big number of major sites.
     83Issues:
     84- Consumes horizontal space: Sidebars reduce the page width we can use for
     85content. This is ok for pages with one column of text, because smaller
     86columns are easier to read anyway. But any time we want to use more than
     87one column for the content, or we want to show big things such as a map,
     88we want all the horizontal space we get.
     89+ has more space for text, links and even images, than a horizontal menu
     90has.
     91+ can be nicely separated into several sections (like the "widgets" in
     92wordpress sidebar)
     93
     94b) tabs and horizontal menus (as we have it already).
     95Issues:
     96- Consume vertical space, so it easily happens that you have to scroll for
     97the desired content.
     98- Space in one row of tabs is limited, and more than 2 levels of tabs will
     99usually look strange.
     100+ The strict tree hierarchy implied by a tab-based navigation is great for
     101memorizing the navigation structure, even when it does not always fit with
     102the actual structure of our site (or does it?).
     103
     104c) CSS / Javascript dropdown menus (a combination of css and js can make
     105them more accessible for older browsers). Issues:
     106- items in the dropdown are not visible in the first place
     107- problems in IE6 with js switched off.
     108- easily pops out unintended, then it hides other page elements. Special
     109attention in the design!
     110- Often a dropdown does not look like anything will pop up. Consider
     111visual affordances in the design!
     112+ efficient use of display space.
     113
     114d) increase the number of navigation steps from A to B, making it possible
     115to reduce the number of navigation links on each page. In an extreme form,
     116we could require people to navigate through a central sitemap ("navigation
     117hub"), when they want from page A to page B. (I am generally not in favour
     118of this solution).
     119Issues:
     120- slower navigation.
     121
     122e) have different navigation links on each page. For instance, we could
     123have a big detailed nav menu for the start page, but more minimalistic nav
     124menus for group or profile pages, with links to "navigation hubs", or with
     125drop menus to save space.
     126Issues:
     127- Not consistent on different types of pages. We have to do the design
     128with care, so people still recognize a link as the same, if one time it is
     129in a sidebar, and another time int a horizontal menu.
     130
     131
     132I hope I did not forget anything!
     133
     134-- lemon-head
     135
     136
     137----