Friday, July 30, 2010

Adding Menus to the Navigational Bar

Now that you’ve developed your navigational bar, let’s add some menus to it. We’ll create the following areas for our navigational menu:
  • Products
  • Services
  • Site Index
Let’s go ahead and create these now.
  1. Create a new layer called products menu.
  2. Select WindowCharacter. The Character palette displays. Enter the following information, as shown in figure below.
    • Font Family: Verdana
    • Font Style: Regular
    • Font Size: 14 pt
       
    • Leading: 100%
    • Tracking: 0
    • Color: RGB = 255, 255, 255
    • Anti-aliasing Method: Smooth
  3. Select the Text tool from the toolbox. Make sure that you are in the products menu layer, then type Products. Your screen should look similar to figure below.

  4. Right-click on the products menu layer, then select Duplicate Layer. Rename your duplicate layer services.
  5. Select the Move tool from the toolbox. Hold your Shift key and press the Down Arrow eight times.
  6. Select the Text tool and highlight the text Products (that you just moved down eight times). Type the word Services, as shown in figure below. Use the Move tool to center your text if necessary.
  7. Right-click on the services layer, then select Duplicate Layer. Rename your duplicate layer site index.
  8. Select the Move tool from the toolbox. Hold the Shift key and press the Down Arrow 10 times.
  9. Select the Text tool and highlight the text Services (that you just moved down 10 times). Type Site Index, as shown in figure below. Use the Move tool to center your text if necessary.

    In this tutorial:
    1. Designing a Modern Web Page Style
    2. The Simeon Software Group
    3. Creating the Navigation Bar Layer
    4. Creating a Watermark Layer
    5. Adding Menus to the Navigational Bar
    6. Creating Colored Menu Selections
    7. Adding Photos to Your Web Page
    8. Editing your Web Page in Dreamweaver 
    9. Creating Background Images
    10. Silver and Backgrounds

2 comments: