So why did I put it in? To illustrate the fact that there are things you *don't* need to know. You'll find tutorials out there which take days to go through, full of quizzes and chapter reviews. They'll guide you through everything you could possibly want to know about html and many things that you don't. Maybe this is the sort of thing you like, but I'll bet that for some of you, the basic facts that you are after are going to get lost amongst the useless knowledge and fancy extras that you aren't ready to deal with yet. This minitutorial is for you.
The main page of every website is named index.html. Whenever you type a URL into your browser, it is directed to a particular machine on the internet and on that machine it looks in the folder associated with that URL and finds good ol' index.html, reads it, and throws it up on your screen. For example, if you type in www.pele.cx/velvet you'll get my homepage. What you will see is the the file, index.html, which is in the directory /html/velvet on my machine, pele. If you were to type www.pele.cx you would see the file named index.html which is in the /html directory. If you were to type www.pele.cx/robertsloan you would see the version of index.html that is in robert's directory, /html/robertsloan. (I'll take that out of published version if you want) Remember: the main page is always index.html. When it comes right down to it, typing in a URL is really just a way of naming a directory on another computer and saying, "Show me index.html in this directory."
Okay. Now our first step is to make a file called, you guessed it, index.html. You can do this in any text editor. However, because some word processors, such as Word, do wierd things if you try to save files in html format, be *sure* to save it as a plain text file. It can still have the .html extension, but for file type, be sure to select txt. Now go ahead and make a new file however you usually do it, and name it index.html. Now open up that nice, blank, new file.
The first thing we need to do, is tell this file that we're going to be writing some html. We do this by typing:
<html>
Now, let me explain a bit about < >'s in html. Html commands are always put between < >'s. An opening < tells the browser to read what follows it as html code. A closing > says, "Okay, code's over, the rest is just text. Show it like it is." Some commands are stand alone commands...what's between one set of < >'s is all you need. For example, <br> means a line break. <hr> means draw a line across the page. These commands are complete all on their own and don't need anything to go with them. Others, such as when you ad a link, have to be closed when completed. <html> is one of those. That simply means that when the command is complete...in this case, when you're all done writing html...you'll have a set of < >'s with the closing command in them. The very last line of index.html will be:
</html>
Go ahead and put it in and we'll type the page between the two. Your file should now look like this:
<html>
</html>
Looks simple, doesn't it? As long as you take it one step at a time, it *is* simple. The next thing we need is a heading for our page.
If we said the html was starting by typing <html>, how do you think we'll say the heading is starting? We type:
<head>
Things that go in the head include the title of the page, (logically enough, bracketed between <title> and </title>) and any metatags we might want to use. Meta tags are things that apply to the entire page. Two that you might want to use are "description" and "keywords."
<meta name="description" content="The homepage of Velvet Wood, a very ecclectic lady, contains information on and links to a variety of things, including paganism, writing, art, bdsm, and many other subjects.">
First you have your opening <, then the word "meta" showing what showing that this is a metatag. " name="description" " says that we're setting the description for the page. "contents=" says that what follows in the quotes is the actual text you want displayed. Finally, we end with a > to show we're all done.
Keywords are used by search engines to determine whether or not your page meets the criteria for any particular search. Here is the keywords metatag for my page:
<meta name="keywords" content="paganism pagan bdsm S&M B&D Velvet Wood writing art fantasy role-playing leather sadism masochism power exchange">
Note that the name is set to "keywords", but the format is the same as the description metatag above. Between the quotes, you should list anything that might be used to describe the contents of your page. It is considered very bad nettiquette to list things unrelated to your site just to gather more hits, and doing so is grounds for being removed from a search engine. XXX sites do this frequently, which is why you'll sometimes have a dozen of them pop up in a totally non-sex related websearch. They've got everything from aardvark to zygote listed in their keywords!
Put your title beneath your metatags. The title is just the name of the page, it's what the page is called by default when someone bookmarks it. Of course, most people tend to edit their bookmarks so that they can fit more of them on their location bar...my location bar looks something like this:
Not a one of those are the actual title of the page referenced. However, it's still considered proper form to set a title, so:
<title>Hi, I'm a Webpage</title>
We're all done with everything we need in our heading. So we indicate that by putting:
</head>
So far, here's what we've got:
<html>
<head>
<meta name="description" content="Description of the contents of this webpage">
<meta name="keywords" content="A few keywords referring to this webpage">
</html>
Now we're ready to put put some content on our page.
or
Back to the Top!
Want to email me? I can be reached at velvet@pele.cx
