Location via proxy:   [ UP ]  
[Report a bug]   [Manage cookies]                
SlideShare a Scribd company logo
HTML Introduction
Hypertext Markup Language HTML stands for Hypertext Markup Language What an HTML Document Is HTML documents are plain-text (also known as ASCII) files that can be created using any text editor (e.g., SimpleText on a Macintosh; Notepad on a Windows machine). You can also use word-processing software if you remember to save your document as "text only with line breaks".
Tags Explained An  element  is a fundamental component of the structure of a text document.  Some examples of elements are heads, tables, paragraphs, and lists.  Think of it this way: you use HTML tags to mark the elements of a file for your browser.  Elements can contain plain text, other elements, or both.
Tags Explained (continued) To denote the various elements in an HTML document, you use  tags .  HTML tags consist of a left angle bracket (<), a tag name, and a right angle bracket (>).  Tags are usually paired (e.g., <H1> and </H1>) to start and end the tag instruction.  The end tag looks just like the start tag except a slash (/) precedes the text within the brackets.
Attributes Some elements may include an  attribute , which is additional information that is included inside the start tag.  For example, you can specify the alignment of images (top, middle, or bottom) by including the appropriate attribute with the image source HTML code.
The Minimal HTML Document Every HTML document should contain certain standard HTML tags.  Each document consists of head and body text.  The head contains the title, and the body contains the actual text that is made up of paragraphs, lists, and other elements.  Browsers expect specific information because they are programmed according to HTML specifications.
Required elements are shown in this sample bare-bones document:  <html>  <head>  <TITLE>A Simple HTML Example</TITLE>  </head>  <body>  <H1>HTML is Easy To Learn</H1>  <P>Welcome to the world of HTML. This is the first paragraph. While short it is still a paragraph!</P>  <P>And this is the second paragraph.</P>  </body>  </html>
Shortcuts You Should Know Ctrl + C copy Ctrl + V paste Ctrl + X cut Ctrl + S save F5 refresh Alt + Tab toggles between open  windows
Project Requirements Minimum of 20 elements for College Prep Information Processing Minimum of 25 elements for Honors Information Processing If your partner is in Honors and you are in College Prep then they are responsible for completing the last five elements
Now we will create folders to store your files in. Sit with your partner and log in to one of the user names.  (You may want to share your password with your partner.) Anywhere on the desktop, right click and choose New, Folder. Give the folder a name such as “Our Webpage.”
Folders (continued) Every time you save a file that has to do with your webpage you will have to be logged in under that user name and you will have to save the file in that folder on the desktop. This will help you keep all of your files organized and easy to find when you are ready to upload them.
Web Diagram Today you should complete your website diagram. Remember to add a labeled rectangle for each page of your site. Also add arrows to show links.

More Related Content

HTML Introduction

  • 2. Hypertext Markup Language HTML stands for Hypertext Markup Language What an HTML Document Is HTML documents are plain-text (also known as ASCII) files that can be created using any text editor (e.g., SimpleText on a Macintosh; Notepad on a Windows machine). You can also use word-processing software if you remember to save your document as &quot;text only with line breaks&quot;.
  • 3. Tags Explained An element is a fundamental component of the structure of a text document. Some examples of elements are heads, tables, paragraphs, and lists. Think of it this way: you use HTML tags to mark the elements of a file for your browser. Elements can contain plain text, other elements, or both.
  • 4. Tags Explained (continued) To denote the various elements in an HTML document, you use tags . HTML tags consist of a left angle bracket (<), a tag name, and a right angle bracket (>). Tags are usually paired (e.g., <H1> and </H1>) to start and end the tag instruction. The end tag looks just like the start tag except a slash (/) precedes the text within the brackets.
  • 5. Attributes Some elements may include an attribute , which is additional information that is included inside the start tag. For example, you can specify the alignment of images (top, middle, or bottom) by including the appropriate attribute with the image source HTML code.
  • 6. The Minimal HTML Document Every HTML document should contain certain standard HTML tags. Each document consists of head and body text. The head contains the title, and the body contains the actual text that is made up of paragraphs, lists, and other elements. Browsers expect specific information because they are programmed according to HTML specifications.
  • 7. Required elements are shown in this sample bare-bones document: <html> <head> <TITLE>A Simple HTML Example</TITLE> </head> <body> <H1>HTML is Easy To Learn</H1> <P>Welcome to the world of HTML. This is the first paragraph. While short it is still a paragraph!</P> <P>And this is the second paragraph.</P> </body> </html>
  • 8. Shortcuts You Should Know Ctrl + C copy Ctrl + V paste Ctrl + X cut Ctrl + S save F5 refresh Alt + Tab toggles between open windows
  • 9. Project Requirements Minimum of 20 elements for College Prep Information Processing Minimum of 25 elements for Honors Information Processing If your partner is in Honors and you are in College Prep then they are responsible for completing the last five elements
  • 10. Now we will create folders to store your files in. Sit with your partner and log in to one of the user names. (You may want to share your password with your partner.) Anywhere on the desktop, right click and choose New, Folder. Give the folder a name such as “Our Webpage.”
  • 11. Folders (continued) Every time you save a file that has to do with your webpage you will have to be logged in under that user name and you will have to save the file in that folder on the desktop. This will help you keep all of your files organized and easy to find when you are ready to upload them.
  • 12. Web Diagram Today you should complete your website diagram. Remember to add a labeled rectangle for each page of your site. Also add arrows to show links.