310 likes | 482 Views
Information Technology Fundamentals (ITF). HTML. H yper T ext M ark-Up L anguage Used to make web pages. Creating a Simple Web Page. Why use Notepad or WordPad instead of Word? Word adds formatting characters Web browsers don’t know how to interpret the formatting characters in Word.
E N D
HTML • Hyper • Text • Mark-Up • Language • Used to make web pages
Creating a Simple Web Page • Why use Notepad or WordPad instead of Word? • Word adds formatting characters • Web browsers don’t know how to interpret the formatting characters in Word
WordPad • When saving your file: • Click on File, Save As
WordPad • Under Save As Type, select Unicode Text Document (*.txt)
WordPad • In File name, end the file name with .html
Internet Explorer • Student accounts are not allowed to use File, Open • To open your HTML files • Open a My Computer window and go to your Z drive • Double-click on your HTML file • Why does this work?
Class Work • Open WordPad and save a blank page as second.html in your Z drive
Class Work • In your new page, type in: Bethel High School 1067 Big Bethel Road Hampton, VA 23666 (757) 825-4400 Your Name Your Class Year This page was created by Your Name. It was last updated on November 6, 2008.
Class Work • Add the basic HTML tags you learned about last class
Class Work • In the Head section, add a Title that will show your name
Class Work • After the Title area, enter your first name, last name, and class year in the Head section so they will be keywords • NOTE! Disregard this step, it does not work properly
Class Work • Open second.html in Internet Explorer • If you don’t see the title, go back and check your code • If you don’t see anything in the body, check your code
Class Work • Does your page look the way you thought it would? • Probably not – why? • What you are seeing is that just pressing “Enter” to put your text on a new line doesn’t do the same thing on a web page
Class Work • Add break tags at the beginning of lines
Class Work • Save the file • Refresh Internet Explorer
Class Work • Much better! • Now, change the break tag at the beginning of the last line to a paragraph tag
Class Work • Save it and refresh Internet Explorer • Notice the difference in using a paragraph tag instead of a break tag – a blank line
Class Work • Add a horizontal rule between the BHS phone number and your name
Class Work • Save and Refresh
Class Work • Looking much better, but still too plain! • Add bold tags to Bethel High School and Your Name
Class Work • Save and Refresh
Class Work • Add italics tags to BHS Phone Number and Your Class Year
Class Work • Save and Refresh
Class Work • Add underline tags to the last line
Class Work • Save and Refresh