Download presentation
Presentation is loading. Please wait.
1
Lesson 2 — HTML Organization Techniques
Unit 1 — HTML BASICS Lesson 2 — HTML Organization Techniques
2
Objectives Organize page information with single and double spacing.
Organize page information with lines. Implement attributes and values. Change Web page color defaults by altering attributes and values. HTML BASICS
3
Objectives (cont.) Alter Web page text colors.
Create a hyperlink to another spot within a Web page. Create a hyperlink to an URL or Web page anywhere on the World Wide Web. Create a hyperlink to another Web page on your own computer. HTML BASICS
4
Creating Better Web Pages
Formatting tags can greatly improve the look of a Web page. The page shown in Figure 2-2 is unorganized and needs reworking. HTML BASICS
5
Creating Better Web Pages
Two simple tags can make the changes in Figure 2-4: <P></P> <BR> The <P> tag creates a double-space. The <BR> tag creates a single-space. The close tag for the <P> tag is optional. HTML BASICS
6
Lines and Background Colors
Use tag attributes and values to format a Web page in a variety of ways. The BACKGROUND COLOR attribute A BACKGROUND COLOR value <BODY BGCOLOR = YELLOW> HTML BASICS
7
Lines and Background Colors (cont.)
You can use either names or hexadecimal numbers to define color values. White = #FFFFFF Green = #00FF00 Black = #000000 Blue = #0000FF Red = #FF0000 Yellow = #FFFF00 <BODY BGCOLOR = YELLOW> Is the same as… <BODY BGCOLOR = #FFFF00> HTML BASICS
8
Lines and Background Colors (cont.)
The BACKGROUND COLOR attribute has been changed to yellow. Horizontal rules, or lines, have been added through the use of the <PR> tag. HTML BASICS
9
Lines and Background Colors (cont.)
The WIDTH attribute changes the length or width of the line. The SIZE attribute changes the size of the line. HTML BASICS
10
Hyperlinks Inside Your Document
Internal hyperlinks require two steps: Enter an anchor tag using a # before the name of the target location. Define where the link will take you (the target location) with the NAME attribute. <HTML> <TITLE>Text</TITLE> <BODY> <A HREF=“#POWERFUL”> Powerful Lines</A> <P>Text</P> <A NAME=“POWERFUL”> </BODY> </HTML> HTML BASICS
11
Hyperlinks Inside Your Document (cont.)
Internal hyperlinks jump from an index to content below in another area on a Web page. Internal hyperlink Jumps to content below HTML BASICS
12
Creating Hyperlinks to the Web
<A HREF=“ Web hyperlinks: Open anchor tag<A> HREF= attribute Full Web address in quotes Name of the link between brackets Close anchor tag </A> HTML BASICS
13
Linking to Pages Already Created
<BR><A HREF=“one.html”>one</A> Web hyperlinks: Break tag Open anchor tag<A> HREF= attribute Filename in quotes Name of the link between brackets Close anchor tag </A> HTML BASICS
14
Linking to Pages Already Created (cont.)
Hyperlinks to the World Wide Web look exactly like hyperlinks to pages on the local computer. Links to the Web Links to files on the local computer HTML BASICS
15
Coloring Text You will use three separate attributes to color text:
Use the text attribute to change color of text. Use the hypertext link color attribute to change color of hypertext links. Use the visited link attribute to change color of hypertext links that have been selected. <HTML> <TITLE>Text</TITLE> <BODY TEXT=BLUE LINK=RED VLINK=GREEN> <P>Text</P> </BODY> </HTML> HTML BASICS
16
Coloring Text (cont.) <BODY TEXT=BLUE LINK=RED VLINK=GREEN>
<HTML> <TITLE>Text</TITLE> <BODY TEXT=BLUE LINK=RED VLINK=GREEN> <P>Text</P> </BODY> </HTML> HTML BASICS
17
Summary You can organize page information with single and double spacing. You can organize page information with lines. You can use attributes and values to improve Web page design. You can change color defaults, attributes, and values. HTML BASICS
18
Summary (cont.) You can create hypertext links to a spot in a Web document. You can create hypertext links to another page on the World Wide Web. You can create hypertext links to Web pages on your own computer. HTML BASICS
Similar presentations
