Macromedia Dreamweaver MX Illustrated Introductory

1
Working on the Web Sites Hyperlinks and
Appearance
2
Objectives

• Understand Navigation view
• Add existing pages to the navigation structure
• Add blank pages to the navigation structure
• Turn on shared borders
• Change link bar properties
• Change the content of a shared border
• Apply a theme to a Web site
• Customize a theme

3
Working on the Web Sites Hyperlinks and
Appearance

• Hyperlinks can open
• Internal links, which are locations in the same
  Web page
• External links, which are locations in another
  Web page or Web site
• Shared borders are areas that appear in every
  page in a Web site that use them and using them
  is an easy way to create the hyperlinks that
  connect the pages in a Web site

4
Working on the Web Sites Hyperlinks and
Appearance

• You can enhance your Web sites appearance by
  applying a theme, which is a collection of
  coordinated graphics, colors, and fonts applied
  to individual pages or all pages in a Web site

5
Understanding Navigation View

• Navigation view shows a Web sites navigation
  structure
• FrontPage automatically adds the home page to the
  navigation structure
• If you use a template, FrontPage might add other
  pages created by the template to the navigation
  structure
• When you add new pages, you must manually add
  them to the sites navigation structure in
  Navigation view

6
Understanding Navigation View

• When you add pages below the home page, the home
  page becomes the parent page and the pages below
  it become child pages
• After you add pages to the navigation structure,
  you can move, rename, delete, and open pages
• Renaming a page changes its title, which appears
  on the page icon
• When you delete a page from the navigation
  structure, you can delete the page from the
  navigation structure or from the Web site

7
Understanding Navigation View

• Double-clicking a page icon in the navigation
  structure opens the page in Design view
• Some Web sites include pages that dont need to
  be included in the navigation structure
• You cannot add files that are not Web pages to
  the navigation structure
• Position pages in the navigation structure to
  impact the appearance of some FrontPage
  components in a Web site

8
Understanding Navigation View

• Sample navigation structure

9
Adding Existing Pages to the Navigation Structure

• You can use Navigation view to add an existing
  page in a Web site to the navigation structure by
  dragging its filename from the Folder List and
  dropping it in the correct position in the
  navigation structure
• You can insert components that are dependent on
  the navigation structure and rearrange the pages
  in the navigation structure at any time

10
Adding Existing Pages to the Navigation Structure

• The hyperlinks that appear in the link bar in a
  shared border are called navigation buttons, even
  though a navigation button might appear as
  regular text instead of as a button

11
Adding Existing Pages to the Navigation Structure

• Adding a child page of the home page

12
Adding Blank Pages to the Navigation Structure

• You can use Page, Folders, or Navigation view to
  add a new page to a Web site
• When you create a new page in Navigation view,
  you can create the new page in the site and add
  it to the navigation structure at the same time
• If you add a page in Page or Folders view, you
  must switch to Navigation view to add the page to
  the navigation structure

13
Adding Blank Pages to the Navigation Structure

• New Page in Folders view

14
Turning on Shared Borders

• A shared border is an area that appears in every
  page in a Web site that uses it
• Shared borders can contain a link bar or a page
  banner
• A link bar contains hyperlinks based on the
  navigation structure
• A page banner is a picture or text object that
  includes a pages title

15
Turning on Shared Borders

• Shared borders can also contain other text and
  graphics that you want to appear in every page
  that uses them
• If you used a template to create a Web site,
  FrontPage may have automatically created shared
  borders for the site
• You can turn on shared borders from Page,
  Folders, or Navigation view

16
Changing Link Bar Properties

• If you select the option to include navigation
  buttons when turning on shared borders, FrontPage
  creates a link bar component using the default
  settings for that shared border
• By default, the top shared border link bar
  contains links to same-level pages, the home
  page, and the parent page
• By default, the left and right shared border link
  bars contain links to child-level pages
• After you create shared borders, you can use the
  Link Bar Properties dialog box to review and
  revise the link bar

17
Changing Link Bar Properties

• Link Bar Properties dialog box for the top shared
  border

18
Changing the Content of a Shared Border

• In Design view, you can add the following to any
  shared border
• Text
• Pictures
• Objects

19
Changing the Content of a Shared Border

• You can turn off shared borders for
• All pages in the navigation structure
• The current page in Page view
• Only the pages selected in Folders or Navigation
  view
• Useful when the content of a shared border
  repeats information that already exists in the
  page, such as company name and address

20
Applying a Theme to a Web Site

• Themes ensure a consistent, professionally
  designed appearance in a site
• You can change a themes appearance by changing
  its attributes - active graphics, vivid colors,
  and background picture
• Active graphics are theme elements that become
  animated in the page
• Vivid colors are created by an enhanced color set
  to produce brighter, deeper colors
• A background picture is a picture that is used as
  the pages background

21
Applying a Theme to a Web Site
Preview of selected theme
Theme attributes
22
Customizing a Theme

• You can change the appearance of text, colors,
  hyperlinks, backgrounds, and other theme elements
  once youve applied a theme to a Web site
• Customizing a theme is more efficient than using
  Formatting commands to create a new look
• Customizing a theme helps ensure consistency

23
Customizing a Theme
24
Summary

• Navigation view shows a Web sites navigation
  structure
• FrontPage automatically adds the home page to the
  navigation structure
• You can add existing pages to the navigation
  structure
• You can add blank pages to the navigation
  structure
• Shared borders are areas that appear on every
  page in a Web site that uses them
• Shared borders can contain a link bar or page
  banner

25
Summary

• You can change link bar properties for shared
  borders
• You can change the content of a shared border
• Applying a theme to a Web site ensures a
  consistent, professionally designed appearance
• You can change a themes appearance by changing
  its attributes
• You can customize a theme that youve applied to
  a Web site to more closely match your needs