HTML Lesson 2.

Slides:



Advertisements
Similar presentations
Introduction to HTML
Advertisements

HTML Basics Customizing your site using the basics of HTML.
Internet Services and Web Authoring (CSET 226) Lecture # 5 HyperText Markup Language (HTML) 1.
1 Lesson 5. 2 R3 R1 R5 R4 R6 R2 B B A A
Html: getting started HTML is hyper text markup language. It is what web browsers look at on the Internet. HTML documents should be created in a simple.
HTML.
HTML Creating Web pages. HTML Hyper Text Markup Language Not programming, but a markup language using tags to format text in Web browsers.
HTML and Web Page Design Presented by Frank H. Osborne, Ph. D. © 2005 ID 2950 Technology and the Young Child.
Adding HTML to Blackboard
Web Page Development Identify elements of a Web Page Start Notepad
HTML Basics An Introduction to HTML. What is HTML? Stands for “Hyper Text Markup Language” Composed of “tags” which are surrounded by sideways triangles.
Basic HTML The Magic Of Web Pages. Create an HTML folder  Make a folder in your H drive and name it “HTML”. We will save EVERYTHING for this unit here.
HTML. We’ll learn … What HTML is What tags are What a basic web page looks like What 3 HTML tags are required What HTML comments look like How to title.
Introduction to HTML. Topics HTML –What is HTML –Parts of an HTML Document –HTML Tags.
Did someone say Music? November 7, Adding MUSIC to a web page: 1. Find your music! 2. A good website is 3. You will.
Define html document byusing Example : Title of the document The content of the document......
Web Design Using HTML Codes. WHAT DO I NEED TO BEGIN DESIGNING A HOME PAGE? 1.YOU NEED A FOLDER (also called a DIRECTORY) You should set up a folder or.
HTML Structure Building a basic web page using notepad.
Web Design Unit Assignment #2: Job Skills Favorite Links Page You will create a HTML web page with links to informational websites about a variety of job.
McGraw-Hill/Irwin Copyright © 2013 by The McGraw-Hill Companies, Inc. All rights reserved. Extended Learning Module F Building a Web Page with HTML.
More Basic HTML. Add spacing (single & double space) Save Refresh Add horizontal rule Add comments Add styles Add headings Add features Add alignments.
Html Basic Codes Week Two. Start Your Text Editor Windows use 'Notepad’ Macintosh use 'Simple Text'
Web Programming Basics of HTML. HTML stands for Hyper Text Mark-up Language A mark-up language is different than those that you have learned before in.
Just Enough HTML How to Create Basic HTML Documents.
HTML Hyper Text Markup Language. What is an HTML File?  HTML stands for Hyper Text Markup Language  An HTML file is a text file containing small markup.
All you ever needed to know…and more!. H.T.M.L. HyperText Mark-up Language Web’s programming language All web browsers Set of instructions Written with.
Computer Information Technology – Section 3-4. HTML – The Language of the Internet Objectives: The Student will: 1. Look at HTML 2. Understand the basic.
Basic HTML PowerPoint How Hyper Text Markup Language Works.
CREATING WEB PAGES Using…More HTML code! My First \ Web Page.
Chapter 2 Web Page Design Mr. Gironda. Elements of a Web Page These are things that most web pages use.
HTML Lesson 3 Hyper Text Markup Language. Assignment Part 2  Set the file name as “FirstName2.htm”  Set the title as “FirstName LastName First Web Site”
HTML— More Tags, Formatting, and Lists. Formatting Tags  Bold  Italics  Underline  Big text  Small text  Subscript (H 2 O)  Superscript (10 3 )
HTML/XHTML Structure Building a basic web page using notepad.
HTML Lesson 2. Review Questions  What are HTML tags used for?  What do HTML tags look like?  What are the 3 required HTML tags?  In what section of.
HTML GUIDE Press F5 and then Click on the links on the left to get to the section you want Section 1: Getting Started Section 2: Moving Banner Section.
HTML. Hyper Text Markup Language Markup your text document The markup is the tag Hyper text means you can jump from place to place.
Quick Questions 1. What does HTML stand for? 2. What are the three main languages of the Web? 3. What is the purpose of the tags? 4. Why do we indent different.
Headings are defined with the to tags. defines the largest heading. defines the smallest heading. Note: Browsers automatically add an empty line before.
This shows CIS17 and the first day introduction..
Getting Started with HTML. HTML  Hyper Text Markup Language  HTML isn’t a program language, its known as a markup language  A Markup language has tags.
HTML Review * is used as a reference for most of the notes in this powerpoint.
HTML. Hyper Text Markup Language Markup your text document The markup is the tag Hyper text means you can jump from place to place Programming language.
Chapter 4 HTML Tags. HTML is written in something called tags. Tags come in pairs, an opening one and a closing one. The first pair of tags we'll write.
Project 02 Creating and Editing a Web Page Concept Map of Unit Creating and Editing a Web Page Key Learning Understand the elements to create a web page.
Week-11 (Lecture-1) Introduction to HTML programming: A web based markup language for web. Ex.
Revised June 2008 Online PD Basic HTML1 Let’s Try It!  Open Notepad oStart > All Programs > Accessories > Notepad oDon’t get WordPad by mistake – won’t.
Web Page Design Mr. Gironda
Let’s Try It! Open Notepad
HTML.
Online PD Basic HTML The Magic Of Web Pages
INTRO TO WEB DEVELOPMENT html
Extended Learning Module F
Introduction to basic HTML
Elements of HTML Web Design – Sec 3-2
Elements of HTML Web Design – Sec 3-2
HTML GUIDE Press F5 and then
Creating a Home Page in HTML
HTML Formatting.
J. Verlin Sophomore Seminar September 7 – October 2, 2017
Elements of HTML Web Design – Sec 3-2
HTML Robert McIntosh
Web Page Design Mr. Wilson
HTML.
Essentials of HTML.
My web site..
Essentials of HTML.
Web Design and Development
Web pages Lesson 4.
HTML Lesson 4.
WJEC GCSE Computer Science
Presentation transcript:

HTML Lesson 2

Today in class …. Review questions … Show a sample Project #1 Submit Project #1 How to change the background color How to make a list Project #2 Done early: www.w3schools.com

Review Questions What are HTML tags used for? What do HTML tags look like? What are the 3 required HTML tags? What is a comment for? What does the code for a comment look like? In what section of your HTML code does the title tag go?

Review Questions Where does the title show up on your actual web page? What are headings used for and what section of your HTML code to they go in? How do you make text show up bold on your web page? How do you make text show up italic on your web page?

Review Questions How to you force the browser to go to the next line? How do you make a line show up across your web page? How do you make a picture show up on your web page?

Remember A Basic Web Page <html> <head> <title> My page </title> </head> <body> Hello this is my page </body> </html> Head section Body section Tags don’t show up on the page

Centering and changing the background color <center> I’m in the center of the page</center> <body bgcolor=“#XXXXXXXX”> Replace the x’s with code for a specific color Called hex codes http://www.webmonkey.com/2010/02/color_chart s/ Or search for html color codes

How To Make A List What is you want this to show up: My Favorite TV Shows are: Big Brother ___________

Lists Ordered(numbered) list <strong> My Favorite TV Shows </strong> <ol> <li> Big Brother </li> <li> ____________</li> </ol> Un-ordered (bulleted list) Change the <ol> </ol> to <ul> </ul>

Project 2 – Pick a Theme Create a new folder called “LastName FirstName Project 2” Open up notepad++ and save the file to your Project 2 folder. Name It: project2.html Add all the required tags (What are they again? Title your web page: Your Name Project 2 Add a comment on top of the <head> section listing your name, the period, and the date In the <body>, add 1 heading for your theme name Put a horizontal rule under your heading Find a picture related to your theme (use google images), download it into your project 2 folder, and add it to your web page.

Project 2 – Pick a Theme Add a paragraph with AT LEAST 5 sentences to your page about your theme. Make 1 sentence bold Make 1 sentence italic Make 1 sentence underlined Separate the sentences with line breaks Choose a background color for you page (or maybe a background image if you’re really resourceful!) Add an ordered list related to your theme. Add a heading for your list so people know what it’s about! Add an unordered list related to your theme, Add a heading for your list so people know what it’s about! Add something fun that your find online: www.w3schools.com is a good place to start!

Sharing is Caring Show your partner your site Exit slip: Who is your partner What was the theme of their site What did you like about it What would you change about it