As we all know the only way to making a web page is by using a specific language known as HTML (Hypertext Markup Language). Here i will teach you the basics of HTML. I will show you how to start off, where to put things, etc. Keep in mind that HTML is not case-sensitive, meaning that big or small caps will result as the same thing.
Starting off:
Now, here are the tags that you will be using for almost every html page.
<HTML>
<HEAD>
<TITLE>
</TITLE>
</HEAD>
<BODY>
</BODY>
</HTML>
You dont have to put all caps for the tags like i did in the example...
Whatever you want the public to see when viewing your webpage, you will put inbetween the body tag.
For example:
<body>
Hello, and welcome to True-Fusion...
</body>
Some things are obvious to where to put things, like the title of the page.
You would put it inbetween the TITLE tag:
<TITLE>tRUE-fUSION</TITLE>
Within the HEAD tag, you can place in meta tags, style sheets, javascript, and more...
Formatting text:
Moving on to styling text..
If you're used to text editing programs and most graphics programs, then this part should be easy learning.
Bold, italic, and underline are found as "B", "I", and "U" in the programs i've mentioned above.
Well, in HTML, it's practically the same thing.
For the bold tag it's simply <B></B>.
For the italic tag it's <I></I>.
And for the underline tag it's <U></U>.
The Paragraph tag adds a line inbetween words. The Paragraph tag is <P>. This tag does not need to be closed. It closes itself when another form of itself is founded after itself. Some other HTML tags don't need to be closed either. Only reason why you would have to close this tag is if you added some attributes, and you don't want it to affect everything after this tag.
Another formatting tag is the line break tag. This tag works almost the same as the paragraph tag, only that it just brings the line of text a line downward. The HTML for this tag is <BR>. This tag does not need to be closed either.
Moving on to headings. Headings start from H1 to H6. H1 is the biggest size out of them all.
The tag for headings are:<H1></H1>
<H2></H2>
<H3></H3>
<H4></H4>
<H5></H5>
<H6></H6>
Tables:
Tables are the best way to organize a website. A website just can't be a good-looking website without them, unless DIVs are used, but that's a different story.
Here's the tags for a basic table:
<TABLE>
<TR>
<TD>
</TD>
</TR>
</TABLE>
Images:
Images, the best way to spice up a website. The tag for images is very easy, and does not need to be closed.
<img src="blahblah.jpg" alt="">
Links/Anchors:
To connect one page with another you need an anchor, a.k.a. a link. You can use links as text or images. Links can also be used to send a user to a certain location on a webpage, this is where the term anchor comes in.
HTML tag for a regular link is:
<a href="blahblah.html">Blah Blah</a>
Linking using an image:
<a href="blahblah.html"><img src="blahblah.jpg" alt=""></a>
Linking to an image:
<a href="blahblah.jpg">Blah Blah</a>
Making anchors:
First make an anchor by placing this: <a name="anchor"></a> somewhere in a webpage that requires lots of scrolling.
Then make a link to that anchor like this: <a href="#anchor">Blah Blah</a>.
Then when a user clicks on the link it'll take him down or up to where the anchor was placed.
Note: the name for anchors can be whatever you want.
Lists:
Lists are easy ways to organize a group of text. There are 3 different kinds of lists. The tags are based on initials of the lists.
These lists are:
Ordered List
Unordered List
Definition List
The tag for an Ordered List is:
<OL>
<LI>List Item One
<LI>List Item Two
<LI>List Item Three
</OL>
Note: the <LI> tag does not need to be closed
The tag for an Unordered List is:
<UL>
<LI>List Item One
<LI>List Item Two
<LI>List Item Three
</UL>
The tag for a Definition List is:
<DL>
<DT>Definition Term One
<DD>Definition Term One's Definition
<DT>Definition Term Two
<DD>Definition Term Two's Definition
<DT>Definition Term Three
<DD>Definition Term Three's Definition
</DL>
If you're pretty creative you can mix in unordered list into ordered list.
Example:
<ol>
<li>List Item One
<li>List Item Two
<ul>
<li>Nested List Item One
<li>Nested List Item Two
</ul>
</li>
<li>List Item Three
</ol>
