Creating a customizable menu using CSS and the unordered list tag.

March 15, 2013 in Uncategorized

As we progress away from our digital wire frames, the next stage involves adding functional navigation into our sites. The goal of navigation within a site is twofold. For one, the navigation should be functional and organized. Placement of the menu and the wording your choose to label your links play a major role in the usability and organization of your site. You want the navigation to be easy to use, and in place that is noticeable by your users. The second goal revolves around aesthetics, or general appearance. You want the menu to look clean, well spaced, and using a color scheme that matches the colors within the site, but while still maintaining an easy to read appearance (AVOID BRIGHT/NEON COLORS).

To accomplish these goals, we are going to be using the unordered list tag. We will be covering this in class, but for additional resources on the subject (highly recommend reading these while you design and lay yours out), I’ve included a series of links that further expand on customizing an unordered list:

 

-Basic unordered list tag explained

-Unordered List vs. Ordered List Explained (also includes a completely setup unordered list in html format

)-List Tutorial (Step by step tutorials on creating vertical lists, horizontal lists, and rollover effects).

-Advanced menus created using CSS and the unordered list (Creating rollover effects, stylizing the list, etc.).

 

Comments are closed.