| |
|
|
  |
WEB PAGE CREATION FOR BEGINNERS: HTML INTRODUCTION (PART 2) |
|
This beginners tutorial is brought to you in partnership with
Templatemonster.com, the one stop shop for high end templates.
|
|
|
|
Flags
Use these to jump around or read it all
HTML Flags
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 flags.
Think of flags as commands. Let's say you want a line of text to be bold. You will put a flag at the
exact point you want the bold lettering to start and another flag where you want the bold lettering to
stop. If you want just a word to be italic, you will place a start italic flag at the beginning of the
word and an end italic flag at the end of the word. Is this making sense so far?
Flag Format
All flag (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 flag. Learning HTML is learning the flag to perform whatever command you want to do.
Here's an example:
The flag for bold lettering is "B". That makes sense.
Here's what the flags look like to turn the word "Joe" bold:
<B>Joe</B>
Look At What's Happening:
1. <B> is the beginning bold flag.
2. "Joe" is the word being affected by the <B> flag.
3. </B> is the end bold flag. Notice it is exactly
the same as the beginning flag except there is a slash in front of the flag command.
4. This is what the bold flags above produced: Joe Nice, huh?
Some Questions
Q. Is the end flag for other commands simply the begin flag with the added slash?
A. Yup.
Q. Will the flags show up on my page?
A. No. As long as your commands are inside the < and > marks, the flag is used to alter
the text, but the actual code is hidden from the viewer.
Q. Your bold flag uses a capital "B". Do all HTML flags use a capital letter?
A. The browser doesn't care. In terms of flags, 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 flags 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 flag 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 flag or forget to add the slash to the end flag command?
A. That's trouble, but easy-to-fix trouble. It will be obvious if you've not placed an end flag
when you look at the document in your browser. The entire document will be affected after the point
where you forgot the end flag. Just go back into the document, add the slash, and reload the document
into the browser.
Q. Do all HTML flags require both a begin and end flag, like above?
A. No. There are exceptions to the rule, but let's stay on the ones that do require
both flags to work for now. Moving along...
Open and Close Flags
The majority of HTML flags do require both an open and a close flag (a begin and end flag). Most are very
easy to understand because the flag is obvious. Here are a few and what they do to text:
| Affect |
Code |
Code Used |
What It Does |
| BOLD |
B |
<B>Bold</B> |
Bold |
| Italic |
I |
<I>Italic</I> |
Italic |
| Typewriter |
TT |
<TT>Typewriter</TT> |
Typewriter |
Can I Use Two Flags 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 flags to alter text, make a point of not getting the end flags 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 flags 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 flags are on the far ends. Next in line are the Italics and finally the Typewriter Text
flags 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 Flags
The open and close flag format dominates the majority of the available HTML flags, but there are flags
that stand alone. Here are three I use extensively:
| Flag |
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 Flags" was made using an
<HR> flag. |
| <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 flag skips a line. BR just jumps to the next line, P skips a line before starting the text again. |
Writing Your First Page
So, here we go... you're going to write your first HTML page using what you have learned above plus two other
items. And these two items are important to every page you will ever write. Why? Because they will be on
every page you ever write.
You will start every page with this flag: <HTML>
That makes sense. You are denoting that this is an HTML document.
Your next flags will always be these: <TITLE> and </TITLE>
See the very top of this page? I mean way up top. Above the FILE -- EDIT -- VIEW menus. The colored bar
up there. Right now it reads "Basic HTML: Flags" That's the title of the page and that's what you are
denoting here. Whatever you put between these two flags will show up in the title bar way at the top.
Finally, you'll end every page you write with this flag: </HTML>
Get it? You started the page with HTML and you will end the page with /HTML. That makes sense again.
So, Here We Go!
I want you to play around with these commands. Just remember that HTML reads like you do, top to bottom,
left to right. It will respond where you place the start flag and stop where you place the end flag.
Just make sure your flags are within the < and > items.
Here's a sample page to show you what I mean:
<HTML>
<TITLE> My first html page </TITLE>
<B>This is my first HTML page!</B><P>
I can write in <I>Italic</I> or <B>Bold</B><BR>
<HR>
<B><I>Or I can write in both</I></B><BR>
<HR>
<TT>...and that's all</TT>
</HTML>
Notice I only used the flags I showed you on this page. Yes, it's a simple page, but you're just starting
out. Notice the <HTML> and </HTML>. Notice the <TITLE> and </TITLE>. See how
there's a beginning and end flag when I alter the text and that the P and BR commands are used to go to
new lines?
Look at the program above and then what it produced. Look at the source code when you open the page. See
how the HTML flags denoted where text was affected? Good! I knew you would. Now go! Go into the world --
or at least to your text editor -- and create. Follow the instructions in HTML Intrduction (Part 1)1 to help
you save and then display your first HTML page.
You Can Do This!
<< Previous Beginners Article |
Next Beginners Article >>
Beginners Main Menu 1 to 7 |
Beginners Main Menu 8 to 14
Beginners Main Menu 15 to 21
|
|
|
 advertisment |
 |
 |
| advertisment |
|
|
| advertisment |
|
|
|
|
|
|
|
|
|
advertisement
Host With Us: HostingHelper.co.uk From Only $5.00p/m
