IPB

Welcome Guest ( Log In | Register )



Tags
This content has not been tagged yet
 
Reply to this topicStart new topic

Web Programming Tuts For The Beginner

, HTML for the beginner


odomike
no avatar
Core2Q-QX6800
***********
Group: [HOSTED]
Posts: 1,093
Joined: 3-August 04
From: Nigeria
Member No.: 569



Post #1 post Mar 22 2005, 02:21 AM
Hello and welcome to our lil' web programming session. Here we assume that our students are complete noovices of web programming. If you havent ever done any web prograqming, then you've come to the right place.

HERE WE GO

--------------------------------------------------------------------------------

HTML TAGS

HTML works in a very simple, very logical, format. It reads like you do, top to bottom, left to right. That's important to remember. HTML is written with TEXT. What you use to set certain sections apart as bigger text, smaller text, bold text, underlined text, is a series of tags.

Think of tags as commands. Let's say you want a line of text to be bold. You will put a tag at the exact point you want the bold lettering to start and another tag where you want the bold lettering to stop. If you want just a word to be italic, you will place a start italic tag at the beginning of the word and an end italic tag at the end of the word. Is this making sense so far?

--------------------------------------------------------------------------------

Tag Format

All tag (I sometimes call them command) formats are the same. They begin with a less-than sign: < and end with a greater-than sign: >. Always. No exceptions. What goes inside the < and > is the tag. Learning HTML is learning the tag to perform whatever command you want to do. Here's an example:

The tag for bold lettering is "B". That makes sense.

Here's what the tags look like to turn the word "ODOMIKE" bold.

<B>ODOMIKE</B>

Look At What's Happening:

1. <B> is the beginning bold tag.
2. "ODOMIKE" is the word being affected by the <B> tag.
3. </B> is the end bold tag. Notice it is exactly the same as the beginning tag except there is a slash in front of the tag command.
4. This is what the bold tags above produced: Joe Nice, huh?

Some Questions

Q. Is the end tag for other commands simply the begin tag with the added slash?
A. Yup.

Q. Will the tags show up on my page?
A. No. As long as your commands are inside the < and > marks, the tag is used to alter the text, but the actual code is hidden from the viewer.

Q. Your bold tag uses a capital "B". Do all HTML tags use a capital letter?
A. The browser doesn't care. In terms of tags, capitals and lowercase letters are equal. But I think it would be a very good idea for you to make a habit of writing your tags in capital letters as it sets them apart from the normal text. It also makes them easier to pick out later when you are revisiting the code.

Q. Must everything have a tag to show up on the page?
A. No. If you just type in text, it'll show up. But it will not have any special look.

Q. What if I forget to add the end tag or forget to add the slash to the end tag command?
A. That's trouble, but easy-to-fix trouble. It will be obvious if you've not placed an end tag when you look at the document in your browser. The entire document will be affected after the point where you forgot the end tag. Just go back into the document, add the slash, and reload the document into the browser.

Q. Do all HTML tags require both a begin and end tag, like above?
A. No. There are exceptions to the rule, but let's stay on the ones that do require both tags to work for now. Moving along...

--------------------------------------------------------------------------------

Open and Close Tags

The majority of HTML tags do require both an open and a close tag (a begin and end tag). Most are very easy to understand because the tag is obvious. Here are a few and what they do to text:

Effect => BOLD, ITALIC, TYPEWRITER
Code => B, I, ,TT
Code Used => <B>BOLD</B>, <I>ITALIC</B>, <TT>TYPEWRITER</TT>
What it does => Bold, Italics, Typewriter

Can I Use Two Tags at Once?

Yes. Just make sure to begin and end both. Like so:

<B><I>Bold and Italic</I></B> gives you Bold and Italic

<B><TT>Typewriter and Bold</TT></B> gives you Typewriter and Bold

If you do use multiple tags to alter text, make a point of not getting the end tags out of order. Look at this:


<B><I><TT>Text Text</TT></B></I>

In terms of format, the example above is not correct. The end tags are out of order in relation to the start tags.

Follow this rule:

Always set the beginning and end tags at the same time, always placing them on the farthest end of the item being affected.

Here, again, is the example above in correct form:

<B><I><TT>Text Text</TT></I></B>

Notice the Bold tags are on the far ends. Next in line are the Italics and finally the Typewriter Text tags are closest to the affected text. Just keep setting commands at the farthest ends each time you add them and you'll stay in good form.

--------------------------------------------------------------------------------

Single Tags

The open and close tag format dominates the majority of the available HTML tags, but there are tags that stand alone. Here are three I use extensively:

TAG WHAT IT DOES
<HR> This command gives you a line across the page. (HR stands
for Horizontal Reference.) The line right above
the words "Single tags" was made using an <HR> tag.

<BR> This BReaks the text and starts it again on the next line.
Remember you saved your document as TEXT so where you
hit ENTER to jump to the next line was not saved. In an HTML
document, you need to denote where you want every carriage
return with a <BR>.

<P> This stands for Paragraph. It does the exact same thing as the
<BR> above except this tag skips a line. BR just jumps to the
next line, P skips a line before starting the text again.

--------------------------------------------------------------------------------

[b]
Go to the top of the page
+Quote Post
whyme
no avatar
Privileged Member
*********
Group: Members
Posts: 661
Joined: 10-January 05
Member No.: 3,189



Post #2 post Mar 22 2005, 02:28 AM
This tutorial is somewhat similar to GM-Univesity's HTML Guide. However, I'll let you go on this one.
Go to the top of the page
+Quote Post
nickmealey
no avatar
Premium Member
********
Group: Members
Posts: 156
Joined: 14-March 05
From: Washington, USA
Member No.: 4,520



Post #3 post Mar 22 2005, 03:54 AM
nice for begginers.


user posted image
Go to the top of the page
+Quote Post
PHPtech
no avatar
Member [Level 1]
****
Group: Members
Posts: 66
Joined: 18-March 05
Member No.: 4,687



Post #4 post Mar 22 2005, 04:10 AM
Pretty good, you should put your HTML in these BBCode tags though, it makes it easier to read
CODE
[html]HTML HERE[/html]
Go to the top of the page
+Quote Post
GM-University
no avatar
Super Member
*********
Group: Members
Posts: 287
Joined: 23-February 05
Member No.: 3,945



Post #5 post Mar 22 2005, 04:13 AM
Yeah, I agree, the HTML BBCode gives it a cool effect and makes it easier to read, pretty good though, good for begginers.
Go to the top of the page
+Quote Post
OpaQue
no avatar
Administrator
**************
Group: Admin
Posts: 1,583
Joined: 11-June 04
From: Somewhere in Time & Space.
Member No.: 1
myCENT:38.77



Post #6 post Mar 22 2005, 04:52 AM
CREDITS REDUCED FOR COPYING TUTORIAL!

MANY SOURCES HAVE BEEN FOUND!
Go to the top of the page
+Quote Post
rectab
no avatar
Newbie [Level 2]
**
Group: Members
Posts: 32
Joined: 25-March 05
Member No.: 4,889



Post #7 post Mar 25 2005, 04:47 PM
nice for begginers.
Go to the top of the page
+Quote Post
odomike
no avatar
Core2Q-QX6800
***********
Group: [HOSTED]
Posts: 1,093
Joined: 3-August 04
From: Nigeria
Member No.: 569



Post #8 post Mar 26 2005, 02:50 AM
Well well well, what I dont know now is whether to go on posting in this forum or not. How on earth ncan someone say that a tutorial I took my own time to write and post looks like that of some university?

It seems as if everyone is out on this board to know what and what I am gonna post. I admit to the fact that the former one was copied from some where but what I am not gonna take is the fact that I copied this tutorial from some where.

What ever is your (OpaQue) reason for reducing my credits, I dont know.

Let me take it that these are the prices I have to pay for having my website been hosted for free.
Go to the top of the page
+Quote Post
mahesh2k
no avatar
Super Member
*********
Group: Members
Posts: 472
Joined: 23-January 05
From: Planet X2
Member No.: 3,388
myCENT:86.60



Post #9 post Mar 26 2005, 04:39 PM
nice for beginners put this into your site or make it ebook pdf good work.
Go to the top of the page
+Quote Post

Reply to this topicStart new topic

Collapse

> Similar Topics

    Topic Title Replies Topic Starter Views Last Action
No New Posts   0 williantg 291 16th July 2004 - 08:03 PM
Last post by: williantg
No new   17 eforumhongkong 1,418 24th August 2004 - 03:13 AM
Last post by: NuHoaXuLa
No New Posts   3 Albus Dumbledore 387 20th May 2007 - 04:46 AM
Last post by: jlhaslip
No New Posts   1 dundun2007 743 23rd August 2004 - 08:06 PM
Last post by: Supaflyfrank
No new   22 renatik 1,327 20th October 2004 - 09:33 PM
Last post by: Danieluchis
No new   19 Inty 1,227 15th December 2008 - 10:22 AM
Last post by: liod
No New Posts   5 Lyon 1,123 10th November 2004 - 11:15 PM
Last post by: -fkid-
No New Posts   0 xsize 1,150 20th October 2004 - 04:45 PM
Last post by: xsize
No New Posts   0 Lyon 698 25th October 2004 - 10:07 PM
Last post by: Lyon
No new   26 xboxrulz 2,413 1st April 2006 - 08:39 PM
Last post by: WindAndWater
No new 29 kab012345 2,417 6th November 2008 - 01:07 AM
Last post by: Tran-Gate
No New Posts   12 michaelper22 1,463 25th August 2006 - 06:08 PM
Last post by: truefusion
No New Posts   7 jjhou 1,075 23rd June 2008 - 12:05 PM
Last post by: FeedBacker
No New Posts 6 -Blade- 511 27th November 2004 - 05:54 AM
Last post by: RED NOVA
No New Posts   1 winsonfeel 782 7th December 2004 - 07:22 PM
Last post by: dawu