Basic HTML Code

More Question about HTML? Try Google.

Section 1.1: A Basic Background on HTML

HTML:
HTML stands for HyperText Markup Language. This language is what allows you to create hypertext links, fill in forms, and form clickable images. Along with this markup launguage there are two other acronyms that are important to know: URL & HTTP.
URL:
URL stands for Uniform Resource Locators. A URL is the address at which a specific "chunk" of information is located on the Web.
HTTP:
HTTP stands for Hyper Text Transfer Protocal. HTTP is a group of client-server interactions. These actions are specifically to distribute HyperText documents.
The Basis of the HyperText Markup Language is in the HTML tags . These tags are the portions of text surronded by greater-than & less-than signs < __ > . These are the instructions that tell the client browser what the page looks like. For example: 
 <H1> This is a Heading level one </H1>
What the above line does by using the tag <H1> is indicate that the the following text will be displayed as a Level 1 Header. The closing tag of </H1> ends the Level 1 Header.

The previous example using <H1> and </H1> shows how almost all HTML commands need an end tag with a forwad slash. This tag ends the command. There are a few examples of tags that do not need an end tag, like a line break <BR> o r an image tag <IMG>.

Section 1.2: Creating an HTML File

When you register for your account on StudentWeb a homepage is automaticly made for you. It will end up to be located in your public_html directory. The name of this file is index.html this will be the page that will see first. It is highly recomended that you DO NOT change the name of this file...although feel free to edit the heck out of it. When someone accesses the URL: 
http://studentweb.tulane.edu/~ Your_login_name /
They will automaticly be brought to the index.html file. The above line is equivalant to: 
http://studentweb.tulane.edu/~ Your_login_name / index.html
Here is an example of the page that is premade for you. It will have Your name, a link to StudentWeb, and an email to you.

The easiest way for you to edit or create a HTML document is through one of the UNIX editors: Z, VI, Pico, and the others too. You may choose to use Word, Wordperfect, or any other program that types text (the notepad or simple text).

What you need to do, though, is end the file name with .html . For example, if you title your document "homepage" you need to add the .html to make it "homepage.html". This tells HTML browsers that this is an HTML document. If you are us ing a DOS machine, you may have to put .htm instead, but it will work in the same way.

In order to make this document work, you will need to put it into the directory named public_html in your account on StudentWeb. For this reason, it may be easier to create the document in the UNIX shell (while logged on) in order to cut down on the necessary steps. If you still want to create a file on your personal computer, there is on e more step that you must do, which is sFTP (File Transfer Protocol) the file over to your account on StudentWeb. For more on this go here.

When your file is in the public_html directory, its URL (or Internet address) will be: 

http://studentweb.tulane.edu/~ your_login_name / file_name.html
That line contains no spaces, and capital letters do matter. It is necessary to put the "~" sign before your login name.

Section1.3: How to Start an HTML file

There are a few basic tags that you should put into your html file, these are: 
<html>
<title> </title>
<body>

</body>
</html>
If this was all that you put in your page, it would be blank. They are not necessary, but highly recomended.

This below is a very basic page, but it should give you a basic look at HTML. 

<html>
<title> This is your title </title>
<body>
<h1> This is your main heading </h1>
    This is just text.  If you insert a paragraph tag... <p>
    Then it creates a new paragraph.  Spaces      don't     matter.
</body>
</html>

The above code would make a page that would look like this example

Notice that what is in the <title> title </title> part shows up at the very top of the browser. Again, notice that extra spaces don't do anything.

A Few Things to Remember:

  1. If you insert extra spaces into your text, HTML browsers will reduce the spaces into a single space. If you want your text to look a certain way, then you will have to use the HTML tags.

  2. When using HTML tags, capital letters are the same as lowercase letters, so: 
    <TITLE>   is the same as   <title>    and also    <TitLe>
  3. On all text modifying tags you must insert the ending tags to stop the modification of text.

Section 1.4: Making Links & Adding Pictures

To add a link to your page, you must know the URL (address) of the page or image you want to link it to. You make a link by using the <a href=""> </a> tag. You need to put the address of the page or image that you want to link inside of the quotes. What you want them to click on needs to go between the > and the </a>. If that was not clear look at the folowing example: 
 <A HREF="You Put The Address Here"> This is what you Click </A>

This would give you:

This is what you Click

If you want to make a link to send email to yourself from your web page the link is coded like this: 

 <A HREF="mailto: You Put YOUR Email Address Here"> email </A>

Which looks like:

email

In order to link a picture to your page, you need to know its address. Once you know its adress, you insert it into a HTML tag <IMG SRC=""> Again, you put the internet address within the quotes. 

<IMG SRC="This is the address of the picture">
For more on pictures refer to Section 3.3 Graphic Commands

Questions about HTML Contact:
StudentWeb Help

Help Index - Help Page 1 - Help Page 2
Help Page 3 - Help Page 4 - Help Page 5