
You should be able to copy paste any of the following codes onto your web page and have them work. Then just deleat what I have in there and type in what you want between the codes. At least it's a start until you start doing it so much you memorize the codes. Also the easiest way to learn HTML is to just start putting some on the page and see what it does, and then get it to do what you want it to.
You will notice that there are two sets of arrows around each code
one is to start the code and the other is to stop it.
<CODE HERE>
</CODE HERE>
You must always start a code or what you want on your web page will not work the way you want it to. You must always stop a code or it will continue on down the whole web page.
The code is very fussy, if you make a space where a space should not be it will not work, if you leave out a space it will not work. If you write htpp instead of http or leave out letters, comas, " , #, / it will not work. With HTML upper and lowercase is not so important you can put HTML or html and get the same result. But when you get into other code such as Java script then you need to be more consistant.
(The following will not show up on your page, but you need to have it anyway.)
Basic Lay out of A Web Page:
<HTML>
<HEAD>
</HEAD>
<BODY TAG>
</BODY>
</HTML>
HTML (hypertext markup language)
Basicly what you need to learn so that you can get what you want to show up on your web page.
Thus you begin each page with:
<HTML>
and end each page with:
</HTML>
HEADING
The heading is important to include if you wish your web page to show up in search engines.
<HEAD>
<TITLE>Put the title of your web page here </TITLE>
<META NAME="description" content="Write a sentance describing your page here.">
<META NAME="keywords" content="write,key,words,to,your,page,separated,by,comas,without,spaces.">
</HEAD>
This line and lines like it should have no breaks in them. When you view the source they should keep going in one straight line.
<META NAME="keywords" content="write,key,words,to,your,page,separated,by,comas,without,spaces.">
BODY
The body is the main part of your page. You begin it with a line of code or tags to chose the colors/graphics for your page.
There are many here are 3 basic ones.
BODY TAGS:
Without picture background:
With picture background:
<body BGCOLOR="#000000" text="#000000" link="#000000" vlink="#000000" alink="#000000" background="some.gif"> Example Two
With picture background fixed:
<body BGCOLOR="#000000" text="#000000" link="#000000" vlink="#000000" alink="#000000" background="some.gif" bgproperties="fixed"> Example Three
When you are finished with the main part of your page type </BODY> to stop the body.
(Note: The above codes should not wrap (go down to the next line) inside of your file manager, the codes should be in a continuous line across the page. In example one on my computer it does not wrap, to show you what I mean. If you have a smaller screen, or have the font (text) larger then it may go down to the next line, but if you copy paste them on your note pad it should go straight across with no breaks in the lines. Otherwise it will not work with some browswers.
What you may wish to include in the body:
TEXT SIZES
TYPES OF TEXT
<b>Bold</b>
<STRONG>Strong</STRONG>
<BIG>Big</BIG>
<i>italic</i>
<blink></blink>
<PRE>Exactly as typed
on the page
In typwriter font</PRE>
<PRE><B>You can add other
code such as bold or even sizes also
to the above code, here I made it
bold.</B></PRE>
<SMALL>Small</SMALL>
Down<SUB>DOWN</SUB>Down
UP<SUP>UP <SUP>UP
<DEL>line through</DEL>
<U>underline</U>
SPECIAL TEXT
<FONT FACE="Hancock">Hancock</FONT>
With Size
<FONT FACE="Bookman Old Style" SIZE=4>
Bookman Old Style</FONT>
With color
<FONT FACE="Iglesia-Light" SIZE=6 COLOR="#ff7c80">
Iglesia-Light</FONT>
It's ok Click here :)
MAKING TEXT APPEAR ON THE PAGE AS YOU WANT IT:
<BR> makes a break between lines
<BR><BR>=<P>
alot of <BR><BR><BR><BR> will make more space between the lines.
<P> inserts a space between lines
Use <P>
</P> for blank lines making alot of <P><P><P> won't work
will make a space between words or you can indent paragraphs with it.
<P ALIGN="right"> Aligns test right</P>
<P ALIGN="center"> Aligns text Center</P>
<P ALIGN="left"> Aligns text left </P>
ALSO:
LISTS
Numbered List
<ol>
<li>item one
<li>item two
<li>item three
</ol>
Will make the Numbers for you like this:
Bullet List
<ul>
<li>item one
<li>item two
<li>item three
</ul>
Will make a list with dots in front of it like this:
Text or Defintion List
<dl>
<dt>God
<dd>The Father Who created all things and made a plan for His creation.
<dt>Jesus
<dd>The Word who became flesh, so that we could be reunited with God.
<dt>Holy Ghost
<dd>The Helper Jesus sent to fill born again believers to enable them to further His work after He returned to His Father.
<dt>Man
<dd>Created by God, and given a choice to either reject or accept Him.
<dt>Satan
<dd>The angel of light who chose to be his own god, and now is the father of the dead.
</dl>
Will create a list like this:
LINES, BARS, RULES
<hr>Makes a single line across the page.
<hr size=10 align=left noshade width=50%>
You can change the size and width of the line by changing the numbers.
You can place it to the left, center or right by changing "align=".
If you take out no shade the line will have no color.
(Note: Lines can also be made from graphics).
Begining on the page now you will find code like <a href="http:// etc"> and <img src="http:// etc"> this is an address (some call it the addy, url etc). If you look at the top of your screen you should see a white box, and before it you will see the word "Address".
That would be the address for this page:
http://.....123ABC_HTML_MadeEasy.html
Each page on the internet has a different address. In the code you must put the address you need between the "quote marks", so what you wish to do will work. I have named them http://address/.
LINKS
(USING TEXT AS LINK)
<a href="http://address/Back.html">Some Other Place</a>
(USING PICTURE AS LINK)
<a href="http://address/Back.html"><img src="http://address/SOMEOT.gif" height=100 width=100 alt="Name of picture etc." border=0></a>
(USING PICTURE AND TEXT AS LINK)
<img src="http://address/SOMEOT.gif" height=100 width=100 alt="Some other page" border=0><a href="http://address/Back.html>Some Other Place</a>
(LINK WITHIN YOUR PAGE)
<a href="#Bottom">Bottom of Page
</a> (Put this where you want the link to start)
<a name="Bottom"> (Put this where you want the link to go to)
This code is used to make indexes and other links on the same page. This page is an example See Index.
TO E-MAIL RIGHT FROM PAGE
E-Mail <A HREF="mailto:YourE-Mail@Here">YourE-Mail@Here</A>
This is my e-mail:
E-Mail iyohi@hotmail.com
TO E-MAIL USING PICTURE
<A HREF="mailto:YourE-Mail@Here"><img src="http://address/e-mail.gif" alt="YourE-Mail@Here" border=0></A>
AHHHH!!!! I don't get it! HTML is too HARD! I just want a web page! It's ok :) Relax :) Smile. Go to one of the following places and they will add the code for you as you work:
Tripod
Hint: pick Quick Page
Angel Fire
Pick Angelfire's Basic Editor
Geo Cities
Pick Intel.com Web Page Wizard or Basic Home Page Editor
Make a hyperlink to your next page.
Then stop the body
</BODY>
And lastly stop the HTML
</HTML>
|
|
|
|
|
|
|
|
<a name="Bottom">
Back to a (LINK WITHIN YOUR PAGE)