1 / 20

Bell Ringer

Learn about HTML, the coding language used to create web pages. Discover its origins, its role in web design, and the basic tags used in HTML coding. Conduct your own research and find answers to questions about HTML.

arthurcrocker
Télécharger la présentation

Bell Ringer

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Bell Ringer • Conduct your own research & answer the following questions (1 paragraph). • What is HTML? • Who developed HTML? • How is it used in web design?

  2. HTML Tags IDT 8: Create and Organize web pages through the use of a variety of web programming design tools.

  3. Flash drive Navigate to your flash drive. Create a folder called websites Inside the websites folder – Create another folder called practice.

  4. What is HTML? Hypertext Mark Up Language – coding language used to create web pages. HTML uses tags to code a web page. HTML tags are keywords (tag names) surrounded by angle brackets like <html> HTML documents are also called web pages Latest version is HTML 5

  5. What software? Use a text editor to create a web page Notepad Notepad ++

  6. Web page code outline <!DOCTYPE html> <html> (open tag) <head> (open tag) <title> (open tag) </title> (closing tag) </head> (closing tag) <body> (open tag) </body> (closing tag) </html> (closing tag)

  7. <!DOCTYPE html> <html> <head> <title>First Page</title> </head> <body>Hello! This is my first page of code. I can't believe I'm on my way to being a webmaster. This is so great!!! </body> </html> Simple page of Code

  8. Saving an HTML document • File – Save As • Navigate to your websites folder – practice folder • In your practice folder save your page as: • index.html • The homepage for a website is always saved as index.html!

  9. What does that look like?

  10. Did you notice anything? • Regular text • No break when an ENTER was keyed • Nothing exciting about page • No design elements used • Formatting is needed

  11. Look at some additions (changes in Red) <html> <head><title>First Page</title></head> <body bgcolor="blue"> <hr> Hello! This is my first page of code. I can't believe I'm on my way to being a webmaster.<p> This is so great!!! <hr> </body> </html>

  12. Here’s what those did…

  13. What changed? • Background color • Breaks in text • Horizontal rules • All with just a few keystrokes

  14. Additional helpful tags • <p> paragraph break - similar to double space in a word document. • <br> line break – similar to single space in a word document • <font color =“red”>Change text color</font> • <h1> Heading tag – creates large, bolded text</h1> • Heading tags range from h1 (largest) to h6 (smallest)

  15. Open a browser Go to www.w3schools.com

  16. What can you create? • Edit and add the following content to your page: • Name • Grade • “I like Introduction to Digital Technology because I have learned…” • Clubs and activities you are involved in.

  17. Open the notes you took over HTML. Review the tags that you learned. Go to w3schools.com. Click on the HTML tutorials. Read through the first 4 chapters…HTML Home – HMTL Basic.

  18. * Three Page Website About Me*1st Page - index.html2nd Page – hobbies.html3rd page – family.html and friends.html

  19. Go to the Class website We’re moving on to web design!Go back to your normal seats

More Related