1 creating the header page the header frame always displays on the ahs web site the image...
Post on 04-Jan-2016
223 Views
Preview:
TRANSCRIPT
1
Creating the Header PageCreating the Header Page
• The header frame always displays on the AHS Web site
• The image (screagle.gif) that will go in the header is contained on the HTML Data Disk
2
Entering Initial HTML TagsEntering Initial HTML Tags
• Select New from the File menu
• Enter the initial HTML tags, as usual, and type AHS Header Frame as the title
• Make the background color navy:
<BODY BGCOLOR=“NAVY”>
• Press ENTER twice
• Click the blank line (line 6)
3
Entering Initial HTML TagsEntering Initial HTML Tags
background color
4
Adding an Image and a Heading
Adding an Image and a Heading
• Create a one-row borderless table that contains the image and heading text
• Enter this HTML
code starting on line 7
5
Saving the HTML FileSaving the HTML File
• Save the HTML file in your network account with header.htm as the file name
file name
6
Entering Initial HTML TagsEntering Initial HTML Tags
• Select New from the File menu
• Enter the initial HTML tags, as usual, and type AHS Menu Frame as the title• Set the colors of the background, body
text, and the links by entering the following tag:<BODY BGCOLOR=“#FFCC00” LINK=“NAVY” VLINK=“NAVY” ALINK=“NAVY”>
7
Entering Initial HTML TagsEntering Initial HTML Tags
• Press the ENTER key twice
• Click the blank line (line 7)
8
Adding Hypertext References and Targets
Adding Hypertext References and Targets
• Enter this HTML code starting on line 7 to create the navigational links:
9
Adding Hypertext References and Targets
Adding Hypertext References and Targets
The target attributetells the browser in which frame
to open the link
10
Saving the HTML FileSaving the HTML File
• Save the HTML file in your network account with menu.htm as the file name
file name
11
Creating the Home PageCreating the Home Page
• Select New from the File menu
• Enter the initial HTML tags, as usual, and type AHS Home Frame as the title
• Set the color of links to red:<BODY LINK=“RED” VLINK=“RED” ALINK=“RED”>
• Press ENTER twice
• Click the blank line (line 6)
12
Creating the Home PageCreating the Home Page
• Enter this HTML code starting on line 7 to create the navigational links:
13
Saving the HTML FileSaving the HTML File
• Save the HTML file in your network account with home.htm as the file name
file name
14
Viewing and Printing the HTML Files Using your Browser
Viewing and Printing the HTML Files Using your Browser
• Start your browser
• Type a:\framedef.htm in the address box and then press the ENTER key
• The three Web pages created in this project display on the Web site home page
15
Viewing and Printing the HTML Files Using your Browser
Viewing and Printing the HTML Files Using your Browser
frame 1header.htm
frame 2menu.htm
frame 3home.htm
16
Viewing and Printing the HTML Files Using your Browser
Viewing and Printing the HTML Files Using your Browser
• In the Print dialog box of the browser, under the Print Frames section, are three options: As laid out on screen Only the selected frame All frames individually
• The default is to print all frames individually
• For this project, print as laid out on screen
17
Viewing and Printing the HTML Files Using your Browser
Viewing and Printing the HTML Files Using your Browser
• Click the Print button on the Standard Buttons toolbar
18
Testing the LinksTesting the Links
• Click the Reunion News link on the menu.htm frame
• Click all other links in the frame, ending with Home
19
Printing all HTML FilesPrinting all HTML Files
• Click the home.htm button on the Standard taskbar
• Select Print from the File menu
• Repeat the first two steps for the framedef.htm, header.htm, and menu.htm files
• Close (BBEDit) Notepad and close your browser
20
top related