|
||||||||||||||||||||||||||
|
Learn HTML in One Hour or Less!Although there are lots of webpage design softwares around that does not require you to know html in order to make a webpage, I still think that you should learn some html coding. This will help you do some flexible adjustment on your webpage in case things do not turn out the way you want in the design software.
Common HTML questions:
- HTML: What is it?
- What is a tag?
- Can you show me the common tags being used?
- Can you show me an example of a HTML page?
- How do I insert a link in my webpage?
- How do I put a graphic image on my page?
- How do I put a background graphic on my page?
- How do I choose colors for my text?
- How do I choose colors for webpage background?
- How do I make a link that sends e-mail?
- Some advance html methods taught on video.
HTML: What is it? HTML is the actual coding language used to write Web pages. But don't worry, it is not hard to learn at all. Just study the information provided below and you can whip up a webpage using html in no time at all.
Here is the difference between HTML code and a browser display:
HTML Code Browser Display I want to <B>emphasize</B> this! I want to emphasize this!
Letters and words that are enclosed in "<" and ">" marks are called "tags." They give command to the browser on how the text on the webpage should be displayed.
- The <B> tag tells the browser to make bold text.
- The </B> tag means to stop making bold text.
What is a tag? In HTML, a tag tells the browser what to do.
When you write an HTML page, you enter tags for many reasons -- to change the appearance of text, to show a graphic, or to make a link to another page.
The tags you write are not visible on the browser, but their effects are.
Tags begin with the symbol "<" and end with ">".
Tags usually come in pairs, one that begins an action and one that ends it.
This tag: <I> starts printing italicized text.
This tag: </I> stops the effect of a previous <I> tag. Note the "/".
To italicize a word, you simply put <I> before the word and </I> after it:
HTML Code Browser Display I want to <I>italicize</I> this! I want to italicize this!
When you write an HTML page, you see all the tags and can change them. When you view the page on a browser, you see the result of the tags.Now try this.
Open up notepad in windows, and type the above html code. Name the file anything you like, but make sure the extension is .html and not .txt. This would ensure that the browser can read the text you've typed in.
Next, open the file you have just saved using the Internet Explorer. You will see that the word "italicize" is shown as "italicize".
Now, open the html file using notepad and remove the <I></I> tags. Open the file again in Internet Explorer and you will see that the word "italicize" is displayed as normal.
Can you show me the common tags being used? Below are the 3 of the most commonly used html tags in a webpage.
Here are some common tags:
Tag HTML Code Example Browser Display Example <B> (Bold) I want to <B>emphasize</B> this! I want to emphasize this! <I> (Italic) I want to <I>italicize</I> this! I want to italicize this! <U> (Underline) I want to <U>underline</U> this! I want to underline this!
Can you show me an example of a HTML page? Here is the simplest HTML code that can be called a page:
HTML Code Browser Display <HTML> <HEAD>
<TITLE>Page title</TITLE>
</HEAD><BODY>
<P>Learning HTML is easy!</P>
</BODY>
</HTML>
Learning HTML is easy!
Always type a title between the <TITLE> and </TITLE> tags. This title will appear at the top of the browser display.
Your page contents go between the <BODY> and </BODY> tags. The <P> and </P> indicates the start and end of a pragraph.
You can type this code in any text editor or word processor, and if you save it as plain text with a file suffix of .html (example: mypage.html), you can view it with a browser, as I have shown you earlier.
After you have created a simple page using a text editor, you should consider getting a better HTML editor. There are lots of free ones out there. If you want a good one, go spend some bucks and get Frontpage or Dreamweaver.
How can I insert a link in my webpage? A link is a special tag that links one page to another page or resource. If you click the link, the browser jumps to the link's destination.
There are two parts to a link:
Here is an example:
- One part tells the human what to do.
- The other part tells the browser what to do.
HTML Code Browser Display <A HREF="http://www.google.com">Go to Google</A> Go to Google
In this example, the phrase "http://www.google.com" tells the browser what the link's destination is, and the phrase "Go to Google" tells the human what is happening.
How do I put a graphic image on my page? Use the IMG tag. Here is an example:
HTML Code Browser Display <IMG SRC="book.gif"> 
This is a very easy tag to use, but take these precautions:
- If the name of the graphic file is in UPPERCASE, then type the name into the IMG tag in UPPERCASE also. If it is lowercase, type the name in lowercase. Case errors won't matter on your home computer, but when you load your page and graphics onto the Web, suddenly the graphics won't show up any more. This is because Windows and other popular home operating systems do not care whether the file names have the right case, but Web servers do.
- If you want to simply type in the graphic file name as shown here, the graphic file must be in the same directory as your Web page.
- You can't use just any graphic file on your page. You should limit yourself to GIF and JPG files -- most current browsers can display these graphics correctly, and they are also efficient to store on your page and to download from the Web.
How do I put a background graphic on my page? Add a special field to the BODY tag. Here is an example:
HTML Code Browser Display <BODY BACKGROUND="parchment.jpg"> 
Notes:
- Unlike this example, the background graphic repeats itself both horizontally and vertically. Therefore you can use a small graphic and still get full coverage of the browser background.
How do I choose colors for my text? Choosing colors is one of the more complex parts of HTML. To select common colors you can just type their names into a FONT tag. Here are examples:
HTML Code Browser Display I want <FONT COLOR="red">RED!</FONT> I want RED! I want <FONT COLOR="blue">BLUE!</FONT> I want BLUE! I want <FONT COLOR="green">GREEN!</FONT> I want GREEN!
But if you want to specify an exact color, you have to use special codes (don't despair -- the better HTML editors let you use a color selector dialog):
HTML Code Browser Display I want <FONT COLOR="#004080">what I want!</FONT> I want what I want! I want <FONT COLOR="#804040">what I want!</FONT> I want what I want! I want <FONT COLOR="#8000ff">what I want!</FONT> I want what I want!
How do I choose colors for my webpage background? You add some special fields to the BODY tag. Example:
HTML Code Browser Display <BODY BGCOLOR="black" TEXT="red"> This is my page text!
</BODY>
This is my page text!
How do I make a link that sends e-mail? An e-mail tag is not very difficult to design. The tag launches the visitor's own e-mail program and fills in the address you specify. Example:
HTML Code Browser Display <A HREF="MAILTO:youraddress@yourserver.com">
Click to send e-mail</A>
Click to send e-mail