Dynamic Web Menu System Requirements

One of the main things you must determine when designing a Web site is what kind of navigation/menu system you will use to make it easy for your visitors to find their way around the site. At the same time the navigation/menu system must also satisfy other important requirements especially when you have a large Web site driven by a CMS. I will analyze these requirements giving you some references which will help you to better evaluate or design Dynamic Web Menu systems.

When speaking of a Dynamic Web Menu I mean a client-side Web software tool that can get/receive menu data from A CMS/database and display it as a list of options from which a user selects actions to be performed.

Dynamic Web Menu requirements

Platform and Browser Independent

Since the Internet in its entirety is a network composed by a heterogeneous hardware and operating system platforms, and the implementation of browsers on various platforms is so widely different (and change constantly), the Web menu must be independent from these elements. This means that once a Web menu application is created, that same application must run without any modifications on any computer.

I've intentionally used the browser-independent definition instead of cross-browser because the latter means that the developer must design elements that are tailored to each browser and platform combination so that the Web menu always displays properly.

Internationalization (i18n)

Since internet is used in different countries with different spoken languages, the Web menu must be capable to displaying different character sets and Unicode codification using both language directions (left-to-right or right-to-left).

Hierarchical

A hierarchical Web menu is able to represent the entire structure of the site (site map) or a portion of it using different techniques (drop-down, popup, tree).

Although this is not a foundamental requirement, it improves usability because allows visitors to click directly onto the page they are seeking, instead of moving through the site navigation system and down through categories by clicking on links on different pages. Hierarchical menus may also act as simple menus (only one level), while the opposite is not true.

CDL (Content-Display-Logic) paradigm

A Dynamic Web Menu must follow the CDL paradigm where the Content, Display and Logic are maintained separated.

• The Content is the set of menu data stored in a convenient form (text file, XML, database).
• The Display is the set of visualization and multimedia settings and files.
• The Logic is the Web menu software, the glue that holds everything together.

This separation allows one to change the Web menu content or to view it without involving technical resources. This results in lower maintenance costs and much more flexibility. Also the Web menu software could be easily cached by the client system, thereby reducing the downloading time.

Since normally a client-side software does not have the permission to receive data using a direct connection to the server database, the Web menu may receive its content using one the following strategies:

• The content could be embedded on the page during its composition.
• The content could be parsed from a real static text or XML file (e.g.: menudata.txt) that must be created before page delivering.
• The content could be parsed from a virtual text or XML file (e.g.: menudata.php) that will be requested by the client menu software application and generated on-the-fly by a server-side software.
• The previous two techniques could be combined on a server-side software to cache the results reducing the server load.

Linking Capabilities

Each Web menu item must have the same ability of an HTML anchor/link element to call various URL schemas (http, ftp, mailto, Javascript, ...), support Javascript and target frames.

The Web menu must have also the ability to disable each menu item, so you could temporary disable the access to a specific site section without affecting the entire menu structure aspect.

Accessibility

Accessibility is access to information not being constrained by reasons of deficiency or discapacity. Many people may access the information of a Web site from contexts that are very different to ours, because...

• they may be visually, hearing or mobility impaired;
• they may have reading or comprehension problems;
• they may not be able to use keyboards or mice;
• they may have an only-text browser, a small screen or a slow connection, etc.

Accessibility is not only interesting for people with a discapacity, but enhances global access to the Web and improve search engine spidering.

For the above reasons accessibility is an important Web menu requirement. However, due to it's nature of client-side software application, Dynamic Web Menu often lacks some accessibility requirements that could be fully recovered including an alternative content. The alternative content generation task could be eventually achieved by a server-side function that will not be discussed here.

An accessible Web menu must also not impede the whole page accessibility. A negative example is offered by some menus that produce markup-language specific code (e.g.: HTML) which cannot be easily ported to other markup-languages (e.g.: XHTML).

Intuitive / Usability

An intuitive Web menu means that it is easy to use and instantly understandable to most visitors of your site. Using an intuitive Web menu will greatly improve the usability of the Web site, and therefore user satisfaction and return rates.

Usability is a quality attribute that assesses how easy user interfaces are to use and it is defined by five quality components:

• Learnability: How easy is it for users to accomplish basic tasks the first time they encounter the design?
• Efficiency: Once users have learned the design, how quickly can they perform tasks?
• Memorability: When users return to the design after a period of not using it, how easily can they reestablish proficiency?
• Errors: How many errors do users make, how severe are these errors, and how easily can they recover from the errors?
• Satisfaction: How pleasant is it to use the design?

Visual and Multimedia features

Visual and multimedia presentation aspects are often overlooked by many developers but, since the Web is a communication medium, they must be taken in serious consideration. The presentation aspects stimulate instinctive emotional responses that could improve the Web experience.

A Dynamic Web Menu system must be able to adapt its visual/multimedia presentation to the needs of the Web site where it's used. This may include the ability to change colors, fonts, images and also give some interaction to user using graphic and sounds effects.

Final Remarks

Web navigation/menu system still remains one of the key components of a Web site. Nowadays the Dynamic Menu Systems used on the Web are largely based on hierarchical unordered HTML lists (that's <ul> and <li> tags) modelled using CSS (Cascade Style Sheets). This technique allows to displays the simple hierarchy in a more complex form such as a set of dropdown menus or - with client-side JavaScript applications (ECMAScript) - an expandable/collapsable tree. Even if the Web browser is not able to execute the JavaScript code or render the CSS, the user may continue browsing using the hierarchical structure composed by the unordered list.

The alternative Web menu client solutions based upon specific browser plugins (e.g.: Java, Flash, etc.) normally offer better and richest multimedia experience but lacks some of the above requirements. For this reason, these last must always include an alternative version based on unordered HTML list.

Bibliography and Reference

• W3C, "Web Content Accessibility Guidelines 1.0" [online] 1999-05-05, http://www.w3.org/XML/.
• U.S. Department of Health and Human Services, "Usability" [online] 1999-11-28, http://www.usability.gov.

Editor's Note

This article was revised by its author on 27th October 2005.