Download presentation
Presentation is loading. Please wait.
1
Web Design Mr. Briggs’ Classes September 6-7, 2011
2
Today’s Objectives ► Create a web page using HTML code. ► Learn to correctly use tags and save an HTML document in Notepad. ► Reading 2.3: Generate relevant questions about readings on issues that can be researched.
3
Homework ► HTML test on Friday ► Study all HTML notes – memorize ► Be able to write the code for a basic web page. ► Now that you’re all web designers, you need to read some articles on design. Look over the following web sites. Pay particular attention to basic HTML tags. You’ll be having an HTML quiz next week. ► http://www.w3schools.com/html/default.asp http://www.w3schools.com/html/default.asp ► http://www.w3.org/MarkUp/Guide/ http://www.w3.org/MarkUp/Guide/ ► http://www.utoronto.ca/web/HTMLdocs/Ne wHTML/html_intro.html http://www.utoronto.ca/web/HTMLdocs/Ne wHTML/html_intro.html http://www.utoronto.ca/web/HTMLdocs/Ne wHTML/html_intro.html
4
Today’s Assignment (9/6/11) ► Review HTML basic code ► Create your first WP using HTML Code. Review notes from last Friday. ► Use Notepad. ► Create an HTML doc. In body, explain why you want to take this class – about 100 words. ► Use the tags as explained. Include Name and period in ► Use the tags as explained. Include Name and period in ► Create a September 2011 Folder. ► Save as HTML assignment 01 folder in My Documents.
5
Q’s for The Elements handout 1. Why is the header in the title bar important when creating a web page? 2. What is the purpose of using headers in the body of a wp? 3. Give 3 specific examples where both numbered and bulleted lists can be used in a wp. 4. Why would you ever want to include a comment in your wp? 5. When should tables be used and when should they be visible and/or invisible?
6
HTML ► HTML = hypertext markup language – the computer language that allows the GUI of the WWW ► Need to create HTML documents as pure text documents. Use Notepad. ► Start>Programs>Accessories>Notepad
7
HTML ► ► ► First and last code source – signifies document as an HTML doc. That can be viewed in a browser ► ► ► Title of page that appears on the browser icon. ► Information in the HEAD does not appear on the actual browser page.
8
HTML <HTML><HEAD></HEAD></HTML> ► Remember, “/” is called a switch and turns off the tag.
9
HTML ► Within the tags you will need a title. <HTML><HEAD> This is my first web page This is my first web page </HEAD></HTML>
11
HTML ► ► ► This tag encloses all of the text and code that actually appears on the screen.
12
HTML <HTML><HEAD> This is my first web page This is my first web page So why do I want to be in this class you ask? So why do I want to be in this class you ask? Well I want to learn about web design. I want to create web pages about music - my favorite band is The Who. I would also like to create I would also like to create web pages about my family too. web pages about my family too. </HEAD></HTML>
14
Why use lower case tags? ► If you want to follow the latest web standards, you should always use lowercase tags. The World Wide Web Consortium (W3C) recommends lowercase tags in their HTML 4 recommendation, and XHTML (the next generation HTML) demands lowercase tags.
15
New Tags ► bold ► This is a heading ► This is a heading These are different size headings. is the largest and is the smallest
16
New Tags ► underline ► italicize ► paragraph ► line break ► (your comment will be ignored by the browser)
17
New Tags ► Include hyperlinks (external) ► anchor – used in creating hyperlinks ► Text to be displayed ► Text to be displayed ► Visit W3Schools! ► Visit W3Schools! ► Visit W3Schools! Visit W3Schools! Visit W3Schools!
18
New Tags ► Image ► You must correctly save an image in your wp folder. ► Use this tag to insert an image in your wp. ► ► Image tag Image file name Alternative author-defined text
Similar presentations
