Home >> Communication >> Site Planning >> Design Elements

Design Elements and Navigation Schemes

Spend some time examining and comparing the content and navigational design schemes of sites you find appealling. "Collect" these sites into your design journal or Web log.

 

Flash navigation in an HTML page:

You could make the navigation in Flash and use the GetURL action to open different Web pages when clicked. Create a Flash movie that is the size of the navigation bar (something like 700 pixels wide and 80 pixels high) then insert this SWF in Dreamweaver instead of using GIF or JPG images for graphics.

See this simple bare-bones example

Save this page by right-clicking the above link and choosing SAVE TARGET AS. Make a folder called TEMP on your zip disk and save it. Then open it Dreamweaver.

View the FLA of the menu

 

Embedding Flash in Design:

Bridal Babe: animated images enhance design and create interest by integrating tightly in the design

Bionic Box: Flash images are used in place of JPEGs in the site's visual design

TLC: Fansite for While You Were Out

Poems that Go: dynamic article and Flash image | view SWF | view TXT article | download FLA | view complete tutorial for adding a dynamic text scrolling section to your site

 

All Flash Web Sites:

Mark Morris Dance Company: Web site done in Flash | view site | download FLA |

Student Personal Site: done in Flash with dynamically loading text | Men's Retreat |

 

HTML Pages with Flash Content:

How Stuff Works: a good example of using interactive images for information

TLC: Before and After pictures

The War: Interactive content War Tracker | Weapons | Sun Interactive Map |

Former Student Project: Student Sharing

 

Survivor 2

Compare this front page profile with the earlier profile navigation.

 

Interactive Content NOT in Flash:

Mobile Phone Penetration Rates (again!)

Directions Map in Student Project Site

Pop-up photo exhibit Hände

 

Other Examples of Navigation Schemes

Etc. UK- a very simple and clean layout with a compact navigation scheme that allows for a lot of white space

Oxgenizer- icon rollovers on front page, simple navigation inside. Does it work?