copyright 2006 south-western/thomson learning chapter 17 creating and linking web pages
TRANSCRIPT
Copyright 2006 South-Western/Thomson Learning
Chapter 17 Creating and Linking
Web Pages
Slide 2
History of WWW
• World Wide Web was invented in 1989• Inventor was Tim Berners-Lee • Release of Netscape browser in 1994 brought
increased use of the Web
Lesson 121
Slide 3
Web Site
• A collection of related Web pages connected using hyperlinks
• Hyperlinks can be text or graphics
• When clicked, hyperlinks take a user to a new location– On the same Web page– On another page at the same Web site– On a different Web site
Lesson 121
Slide 4
HTML
• Stands for HyperText Markup Language
• Web browsers use HTML to interpret and display Web pages
Lesson 121
Choose View, Source to view the HTML code for a Web page
Slide 5
HTML Tags
• Make up the code that Web browsers understand
• Normally work in pairs, but some work alone• Can be written in UPPERCASE or lowercase• Are written in angle brackets < >
– Open HTML tags start commands <Center>– Close HTML tags stop commands </Center>
Lesson 121
Slide 6
Basic HTML Tags
• These tags provide the basic structure of a Web page
– <HTML> </HTML> begins and ends a Web page
– <HEAD> </HEAD> creates a header for a Web page
– <TITLE> </TITLE> displays a title in the title bar of the browser
– <BODY> </BODY> causes words and pictures to display in the main viewing area of the browser
Lesson 121
Slide 7
File Extension
• A three- or four-letter code that identifies a file type
• Separated from the filename by a period– PowerPoint files use .ppt extension– Word files use .doc extension
• Exact and complete filenames and extensions must be used in HTML documents
Lesson 121
Slide 8
Displaying File Extensions
• To display file extensions– Choose Start, Control Panel– Select Appearances and Themes, Folder Options– Click the View tab– Remove the check by
Hide extensions forknown file types
Lesson 121
Slide 9
Basic Formatting Tags
• Formatting tags help organize and add interest to Web pages– <P> </P> leaves one blank line and begins a new
paragraph– <BR> </BR> begins a new line– <TITLE> </TITLE> places a title in the title bar of
the Web browser
Lesson 122
Slide 10
Headings and Nested Tags
• Heading tags create a bold heading in a font larger than the body text
• Nested tags are organized in pairs moving from the outside in
<CENTER> <H2> Mission Log <H2> <CENTER>
Lesson 122
Slide 11
Bulleted List Tags
• Tags that create bulleted lists must be nested correctly<UL>
<LI>Launched rocket on December 7, 1972.</LI>
<LI>Landed on the moon on December 11, 1972.</LI>
<LI>Splashdown took place on December 19, 1972.</LI>
</UL>
Lesson 122
Slide 12
Sample Web Page
• This Web page has headings and a bulleted list
Lesson 122
<H2> tags create heading
<CENTER> tags center text heading
<HR> tag creates a line
<B> tag creates bold text
<UL> and <LI> tags create a bulleted list
Slide 13
Adding Hyperlinks
• Hyperlinks are created with an anchor tag• A hypertext reference is placed between
quotation marks <A HREF="http://www.nasa.gov">Link to NASA</A>
Lesson 122
Hyperlink created with anchor tag
Slide 14
Adding Color
• The background color of a Web page can be set with HTML tags
• An attribute is added to the tag • A value is given for the attribute
Lesson 123
<BODY BGCOLOR=WHITE>
Tag Attribute Value
Slide 15
Graphics
• Graphics should be in a format that allows small file sizes for quick loading– GIF– JPEG
• Place graphics in the correct folder • Display graphics with the <IMG> tag• Indicate width and height attributes
Lesson 123
<IMG SRC="images/title.gif" WIDTH="627" HEIGHT="148">
Slide 16
Using Application Programs
• Web pages can be created using programs such as– Word– Excel– PowerPoint
• The Save As Web Page command saves documents in a format that can be read by a browser
Lesson 124
Slide 17
Save As Web Page
• To save a Word document as a Web page– Create the document– Choose File, Save As Web Page– Select a folder and enter a filename– Change the page
title if needed– Click Save
Lesson 124
Slide 18
Slide Show for the Web
• PowerPoint slide shows can be saved as Web pages
• In the browser window– An outline appears at the left of the window– The first slide appears– Buttons are provided
for navigating andplaying the show
Lesson 124
Click to play the show
Slide 19
Linking Pages
• An index page can be used to link Web pages– List each page name on the index page– Create a link from each page name to that page
Lesson 125
<P><B>Web Site Index </B></P>
<A HREF="webpage7.html">Mission Overview</A><BR>
<A HREF="webpage8.html">Photo Gallery</A><BR>
<A HREF="webpage9.mht">Astronaut Bio, Cernan</A><BR>
<A HREF="webpage10.mht">Astronaut Bio, Evans</A><BR>
<A HREF="webpage11.mht"> Astronaut Bio, Schmitt </A><BR>
<A HREF="webpage12.mht">Apollo 17 Slide Show</A><BR>
Slide 20
Web Creation Programs
• Several programs for creating Web sites are available– Macromedia Dreamweaver– Adobe GoLive– Microsoft FrontPage
Lesson 125
FrontPage is a popular Web page creation program