1. Macromedia Dreamweaver MX 2004 Design Professional Links WORKING WITH

2. Web Collection: Dreamweaver MX 2004 Chapter D 2Working with Links Create internal and external links Create internal links to named anchors Insert Flash Text Create, modify, and copy a navigation bar Manage Web site links Working with Links

3. Web Collection: Dreamweaver MX 2004 Chapter D 3Working with Links Understanding Internal and External Links Web Pages contain two types of links: –Internal or Relative - are links to web pages in the same web site –External or Absolute - are links to web pages on other web sites or to email addresses

4. Web Collection: Dreamweaver MX 2004 Chapter D 4Working with Links Description of Absolute and Relative Paths

5. Web Collection: Dreamweaver MX 2004 Chapter D 5Working with Links External Link

6. Web Collection: Dreamweaver MX 2004 Chapter D 6Working with Links Internal Link (same server)

7. Web Collection: Dreamweaver MX 2004 Chapter D 7Working with Links Creating a Link Selected Text URL for Link

8. Web Collection: Dreamweaver MX 2004 Chapter D 8Working with Links Site map with External links Click to collapse window Click to Expand or Collapse links list Email link External link on services page

9. Web Collection: Dreamweaver MX 2004 Chapter D 9Working with Links Creating an Internal Link Selected text to be used for link Browse for File Icon catalog.htm

10. Web Collection: Dreamweaver MX 2004 Chapter D 10Working with Links Site map with Internal links Two internal links

11. Web Collection: Dreamweaver MX 2004 Chapter D 11Working with Links Create Internal Links to Named Anchors A named anchor is a specific location on a Web page that has a descriptive name Named anchors acts as a target for internal links A target is the location on the Web page that a browser displays

12. Web Collection: Dreamweaver MX 2004 Chapter D 12Working with Links Internal link to Named Anchor Text used for link to named anchor Named Anchors Named Anchor button

13. Web Collection: Dreamweaver MX 2004 Chapter D 13Working with Links Insert the Named Anchor Name of new anchor

14. Web Collection: Dreamweaver MX 2004 Chapter D 14Working with Links Create link to named anchor Point to File icon Named anchor named preceded by #

15. Web Collection: Dreamweaver MX 2004 Chapter D 15Working with Links Flash Text Flash text is a vector-based graphic file that contains text Flash text allows you to add visual interest to an otherwise “dull” web page Flash text files are saved with the.swf file extension

16. Web Collection: Dreamweaver MX 2004 Chapter D 16Working with Links Flash Text Text + link path + rollover

17. Web Collection: Dreamweaver MX 2004 Chapter D 17Working with Links Create Flash Text Media List arrow Flash Text button

18. Web Collection: Dreamweaver MX 2004 Chapter D 18Working with Links Flash Text options Font list arrow Font size box Color text box Save as text box Link text box Target list arrow Rollover color text box Text box

19. Web Collection: Dreamweaver MX 2004 Chapter D 19Working with Links Add Flash Text Flash text file Flash button

20. Web Collection: Dreamweaver MX 2004 Chapter D 20Working with Links Navigation Bar Navigation bars allow you to create a more visually appealing method for navigation that utilizes graphics rather than text Navigation bars can be created in many different graphics programs including Macromedia Fireworks or Adobe Illustrator

21. Web Collection: Dreamweaver MX 2004 Chapter D 21Working with Links Navigation Bar Navigation bar elements can have four possible states A state is the condition of the element relative to the mouse pointer There are four mouse states

22. Web Collection: Dreamweaver MX 2004 Chapter D 22Working with Links Navigation Bar The four mouse states are: –Up - the state when the mouse pointer is not on top of the element –Over - the state when the mouse pointer is positioned on top of the element –Down - the state when you click the element –Over while down - the state when you click the element and continue pressing and holding the mouse button

23. Web Collection: Dreamweaver MX 2004 Chapter D 23Working with Links Navigation Bar 1 per page Multiple links 4 rollover states up, over, down, and over while down

24. Web Collection: Dreamweaver MX 2004 Chapter D 24Working with Links Navigation Bar example Navigation bar

25. Web Collection: Dreamweaver MX 2004 Chapter D 25Working with Links Navigation Bar options Click to select an image for each element state Remove checkmark Insert list arrow Element name text box Graphic file specific for Up image state

26. Web Collection: Dreamweaver MX 2004 Chapter D 26Working with Links Modify Navigation Bar options To change orientation, you must start over Show “Down image” image initially is selected Nav bar elements

27. Web Collection: Dreamweaver MX 2004 Chapter D 27Working with Links Image Maps Another way to create navigation links for web pages is to create an image map An image map is a graphic that has one or more hot spots placed on top of it A hotspot is an area on a graphic that, when clicked, links to different locations on the page or to another web page or web site

28. Web Collection: Dreamweaver MX 2004 Chapter D 28Working with Links Manage Web Links Check Links Site wide: –Internal links –External links –Named anchors –Graphic files –Orphaned files

29. Web Collection: Dreamweaver MX 2004 Chapter D 29Working with Links Link Checker Show list arrow External links display

30. Web Collection: Dreamweaver MX 2004 Chapter D 30Working with Links Orphaned Files Orphaned files

31. Web Collection: Dreamweaver MX 2004 Chapter D 31Working with Links Links as Assets URLs button External links for TripSmart web site

32. Web Collection: Dreamweaver MX 2004 Chapter D 32Working with Links Chapter D Summary External and internal links Named Anchor links Flash Text Navigation bar Link Checker