. RaysWebClass.Com: Lesson 2 HTML Document Syntax


Lesson 2:   HTML Document Syntax

  1. HTML: Do you want to know what it is?
    HTML stands for Hypertext Markup Language. Tim Berners-Lee based HTML on the Standard Generalized Markup Language (SGML), used by News Papers and Magazines. Quite simply, HTML is the language used to create Web Pages. HTML is pure text, it therefore can be written using Microsoft's Notepad (which we will do in this class). In order for your HTML documents to open in a Browser you will need to add the four letter extension .HTML to the end of your document's file name.
  2. HTML Syntax

  3. Web Safe Colors:
    Web safe colors are a set of colors that are predefined by name. For example, you may set the text color to red in the body tag. e.g. <body text='red'> This is possible because red is translated into the hexadecimal value #FF0000 by your browser.

    Take time to formularize yourself with the Web Safe Colors.
    Also try Makeing Your Own Colors.
    And More About Colors
  4. Structure of HTML

Web Page Design: Exercise 2

  1. Download your HTMLClass Folder:

    Click Here to download your HTMLClass Folder
    When the dialog box pops up click Save as
    Click on Desktop (left column)
    And click the Save button
    (A copy of the HTMLClass.zip file will appear on your desktop)
    Right Click the zip file and choose Extract All...
    Remove ~HTMLClass from the end of the location
    Remove the check mark in front of Show extracted files when complete
    And click Extract (lower right)
    (You will now have the HTMLClass folder on your desktop)
    (You may delete the ~HTMLClass.zip file from your desktop)

  2. Create your Home Page:

    Double Click the HTMLClass folder to open it
    Right Click anywhere inside the HTMLClass folder and choose New
    And Text Document from the second dialog box
    Rename the Text Document test.html. Make sure you get rid of the .txt on the end.
    (It will ask if you're sure you want to do this, choose Yes)
    Double Click the test.html file. Your browser should open a new tab.
        IF THE BROWSER DID NOT OPEN, make sure you can see hidden files
        and file extensions, Follow these instructions
    Right Click anywhere on the new blank page in your browser
    and choose View source Notepad should open.
        IF NOTEPAD DID NOT OPEN (or some other program did) follow these instructions. Triple Click the code below and paste it into the test.html file:
    <!DOCTYPE html>
    <html lang='en'>
        <title>My First Web Page</title>
    <body bgcolor='white' text='blue'>
        <h1>My First Web Page</h1>
    From the Notepad Menu choose File then Save
    Click on your browse icon (at the bottom of your monitor).
    Then click the refresh button (top of your browser)

    The above code will create a web page that looks like this:

    Congratulations! You have just created your first Web Page!