Presentation on theme: "Skills: create simple Web pages Concepts: hypertext, markup, HTML tag, appearance vs. content, text editor, HTML page structure This work is licensed under."— Presentation transcript:
Skills: create simple Web pages Concepts: hypertext, markup, HTML tag, appearance vs. content, text editor, HTML page structure This work is licensed under a Creative Commons Attribution-Noncommercial-Share Alike 3.0 License. Introducing HTML
Where does this topic fit? Internet concepts – Applications – Technology – Implications Internet skills – Application development (web) – Content creation – User skills
HTML hypertext markup language
Hypertext Hypertext: Linear text:Table of contents Chapter 1 1 Chapter 210 Chapter
Markup – adding tags to control appearance This word is bold.
TagEffect … large heading … smaller heading … paragraph … bold text … italicized text … underlined text Examples of HTML tags What do you suppose the command to bre ak a line (like I just did) is?
TagEffect draw a horizontal line (a rule) across the window force a break in the line being typed Examples of HTML tags
HTML tags control appearance, not content
W3schools make changes on the left side see the result on the right side
Codeacademy course on HTML and CSS
1.Write page content using a text editor 2.Add tags 3.Save page 4.View page using a Web browser 5.Correct any errors Steps to create a Web page
Text editor versus word processor This is one sentence.
Which text editor? All programs > Accessories > Notepad
Chrome: Ctrl + U FireFox: Ctrl + U Internet Explorer: Ctrl + F3 To display the HTML source
Page title goes here. The body of the page goes here. Structure of an HTML page HTML page structure Let’s create a Web page.
Self-study questions 1.What happens if you accidentally leave the closing tag off of a bold-face portion of text? 2.What happens if you accidently misspell the tag as ? 3.How would you make some text both bold face and italicized? 4.What does the tag do? 5.What happens if you leave out the at the end of a heading? 6.What happens if you accidentally leave the "<" off of a tag? 7.Does it matter if tags are in upper case or lower case? 8.We introduced several HTML tags that altered the appearance of the page in this presentation. Do you recall what they were and what each does? 9.An HTML page has two sections, what are they and what tags are used to start and end them? 10.What tags start and end an entire HTML page? 11.What are some of the other tags shown at w3schools, and what are their functions? 12.The HTML standard has been revised several times, but Web authors don’t have to go back and change all of their old pages when a new standard is published. Why not? What does have to be changed when the HTML standard is revised?
Resources W3schools HTML reference and tutorial: HTML & CSS for Beginners Free text editors: editor.htm