Design Usability
  Home arrow Design Usability arrow Create Great JavaScript and CSS Menus Simp...
Dev Articles Forums 
ADO.NET  
Apache  
ASP  
ASP.NET  
C#  
C++  
ColdFusion  
COM/COM+  
Delphi-Kylix  
Design Usability  
Development Cycles  
DHTML  
Embedded Tools  
Flash  
Graphic Design  
HTML  
IIS  
Interviews  
Java  
JavaScript  
MySQL  
Oracle  
Photoshop  
PHP  
Reviews  
Ruby-on-Rails  
SQL  
SQL Server  
Style Sheets  
VB.Net  
Visual Basic  
Web Authoring  
Web Services  
Web Standards  
XML  
Dedicated Servers  
Download TestComplete 
IBM® developerWorks 
Weekly Newsletter
 
Developer Updates  
Free Website Content 
 RSS  Articles
 RSS  Forums
 RSS  All Feeds
Write For Us Get Paid 
Request Media Kit
Contact Us 
Site Map 
Privacy Policy 
Support 
 USERNAME
 
 PASSWORD
 
 
  >>> SIGN UP!  
  Lost Password? 
DESIGN USABILITY

Create Great JavaScript and CSS Menus Simply
By: Stephen Davies
  • Search For More Articles!
  • Disclaimer
  • Author Terms
  • Rating: 3 stars3 stars3 stars3 stars3 stars / 5
    2007-09-18

    Table of Contents:
  • Create Great JavaScript and CSS Menus Simply
  • A Combo Box
  • Rollover Menu Example
  • Alternative Design Idea with CSS

  • Rate this Article: Poor Best 
      ADD THIS ARTICLE TO:
      Del.ici.ous Digg
      Blink Simpy
      Google Spurl
      Y! MyWeb Furl
    Email Me Similar Content When Posted
    Add Developer Shed Article Feed To Your Site
    Email Article To Friend
    Print Version Of Article
    PDF Version Of Article
     
     
     
    ADVERTISEMENT

    Free Web 2.0 Code Generator! Generate data entry and reporting .NET Web apps in minutes. Quickly create visually stunning, feature-rich apps that are easy to customize and ready to deploy. Download Now!

    Create Great JavaScript and CSS Menus Simply
    (Page 1 of 4 )

    You have many options when it comes to displaying your web site's menu on its pages. This article will show you some of the more appealing of these options. We will consider ease of maintenance, aesthetics and user-friendliness.

    Many sites today have found new and interesting ways to show menus on their pages. There are still the standard HTML hyperlinks. There's nothing wrong there; simplicity always works. DHTML menus that float up and down the screen appear here and there but are not always that practical. Flash menus add a little extra visual creative flair to an otherwise flat menu system. JavaScript can create very interesting menus that employ both user friendly simplicity as well as looking visually appealing.

    In this article, JavaScript menus, the CSS alternative option and their aesthetic applications over the last decade will be demonstrated. These will be useful menus for most sites. The scripts can be edited to the requirements of any type of site, menu system, and so forth.

    So, why be bothered with designing menus? CSS drop down menus are pretty cool. If designed correctly, they can reduce editing time on web sites. This is the drop down menu's power as it can be easily and quickly edited, especially if held in a CSS style sheet. That was one of the first attractive selling points for web designers while scrutinizing the latest design methods flourishing on the web. In addition, there are JavaScript menus which cover the same level of functionality and are also quickly edited for today's web designer.

    It wasn't too long before menu designs became more intricate. There are now DHTML floating menus, animated flash menus, and many more intricate types. But from a design point of view, it is all about navigational aid and familiarity. How will visitors navigate to the information required? Are the menus laid out in a logical and familiar fashion? Will visitors get lost on the site and therefore lose interest? These are just some of the questions posed when designing a functional JavaScript menu or any menu system for that matter.

    It has everything to do with planning a logical structure for the site that allows visitors to find their way. Visitors who find the information they seek are happy visitors. Those who feel differently as the menus let them down simply leave the web site, never to be seen again.

    Additionally, a great menu system must be accompanied by great content or the menus become meaningless.

    More Design Usability Articles
    More By Stephen Davies


       · This solution does not appear to work in IE6. The "popup" menus do not appear, and...
       · No only does this not work in ie - which is a bit of a drawback ! but the whole...
     

    DESIGN USABILITY ARTICLES

    - Create Great JavaScript and CSS Menus Simply
    - Design Principles that Shape a Web Site
    - Creating Aqua Style Images
    - Easy as A,B,C – dynamic A to Z indexes
    - EasyChart: a Usability Teaching Tool to Demo...
    - Building Friendly Pop-up Windows
    - Back to School: Design Usability
    - Using HTML_QuickForm To Manage Web Forms, Pa...
    - Using HTML_QuickForm To Manage Web Forms, Pa...
    - More Website Knick Knack
    - Browsers as Test Platforms
    - Website Knick Knack
    - Dynamic Page Elements-Cloak and Dagger Web D...
    - Accessibility and Dreamweaver MX 2004






    © 2003-2008 by Developer Shed. All rights reserved. DS Cluster 5 hosted by Hostway