|
Astro Lesson #2 : lets.play.tag!
Today we will discuss Tags. Not the tickets that hang off clothes
in the nearest boutique but rather the instructions you will write to tell
web browsers how to display your text, pictures, backgrounds etc. Let's
start with a very simple page which we will add to as these lessons progress
(providing you all sit up straight in the back row there! Yes - I'm talking
to you: put that thing down, Mister!)
Tags look like this < and >. Attributes within these little
'brackets' control everything needed to make your page work, and
just like a light switch, they need to be turned on and off.
First things first though. Retrogrrl would like to teach you some
HTML, and later on she will not fuss if you decide to use a scrummy
program like Macromedia Dreamweaver, but for now open up the Notepad
program in your accessories folder - not a wordprocessing program
'cos it is too fancy for plain ol' HTML and you may run into problems.
(The latest wp software can convert your text into HTML format -
but if you want total control you need to learn this stuff). People
from Planet MAc can use SimpleText. Done?
- What you see is what you get, right? No way, WYSIWYG
is not the case in HTML. Right-click on this page and select 'view
source' (or select view, then view source from your browser menu)
See all that gobbledegook? That don't look much like what's actually
on this page, hey? But it's this 'code' that tells the browser
how to display this information.
So - just because there might be 5 lines of text in your notepad
document, each on a separate line, does not mean that it will
appear that way on the web page... more than likely it will look
quite different. Unless you tell it otherwise. Comprende?
(If that's a 'Yes' - keep going, if that's a 'No'
please write out 100 times 'I must pay attention in class' and
leave it on ReTroGrrl's desk before you leave the room)
Okely dokely, now you should be polite and tell the world what this
document is all about... do that by typing this at the top of the
page
<HTML>
Press enter/return twice to leave a blank line - this will not appear
on the page but by keeping the code tidy it's easier to find mistakes.
Trying to find that missing <P> tag in a whole mess o' code
is near impossible! (RG knows - she's done it too!) At the very end
of your page of code you should also be polite and tell it that you
have now finished already
</HTML>
Thankyou.
- Next - give the page a title. Now this is also something
that will not appear to the general public BUT - it will display
on the browser title bar - look at the top of your browser now
... you should see 'what are html tags blah blah blah' right?
If you want to be popular, and don't we all?, many search engines
(we're talking Alta Vista, Hot Bot, Yahoo! type things here) use
this to find pages on the net. If you don't have it, you may be
'Lost in Space' forever with nary a soul to care! The tag to do
this is
<TITLE> blah blah blah </TITLE>
Uppercase or Lowercase, that is the question. Doesn't matter - but be
consistent please. Specially when inserting graphics, which we will soon
come to - browsers will only be disappointed if they are looking for PHOTO.gif
if you have saved it as photo.GIF - lowercase makes things easier... photo.gif.
Most web servers (machines that either fetch web pages for you or those
that have the pages) talk in Unix, which is case sensitive.
Don't
forget to save this file as an HTML type - and because it is the first
page it should be called 'index.html' (See Lesson#1)
Next time we will discuss bodies - not dead ones but the <BODY>
tag. Astro Lesson #2 now comes to a timely end.
next.pod
copyright.wendy.phillips.1998
|
