Unit 1 — HTML BASICS Lesson 2 — HTML Organization Techniques
HTML BASICS 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: – The tag creates a double-space. The tag creates a single- space. The close tag for the tag is optional.
HTML BASICS 6 Use tag attributes and values to format a Web page in a variety of ways. – The BACKGROUND COLOR attribute – A BACKGROUND COLOR value Lines and Background Colors
HTML BASICS 7 You can use either names or hexadecimal numbers to define color values. – White = #FFFFFF – Green = #00FF00 – Black = # – Blue = #0000FF – Red = #FF0000 – Yellow = #FFFF00 Is the same as… Lines and Background Colors (cont.)
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 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. Text Powerful Lines Text Powerful Lines
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 Web hyperlinks: – Open anchor tag – HREF= attribute – Full Web address in quotes – Name of the link between brackets – Close anchor tag Course Creating Hyperlinks to the Web
HTML BASICS 13 Web hyperlinks: – Break tag – Open anchor tag – HREF= attribute – Filename in quotes – Name of the link between brackets – Close anchor tag one Linking to Pages Already Created
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. Text <BODY TEXT=BLUE LINK=RED VLINK=GREEN> Text
HTML BASICS 16 Coloring Text (cont.) Text <BODY TEXT=BLUE LINK=RED VLINK=GREEN> Text
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.