Day Two - Header Content

      Okay, open up your handy little Notepad, and open index.html. There should be a total of six tags. First, the open html tag, then the open head tag, one line beneath it, and a blank line beneath that.

      Click your cursor into the blank line, and type the <title> tag. This tag tells the browser to place the text that follows it in the title bar of the browser. For this reason, always try and keep titles short and to the point; a title that is too long will be truncated by the browser, and the viewer will not see this information. After the <title> tag, type ‘My First Page!’ followed by the </title> tag. Save this, and then open your favorite browser, something like Microsoft Internet Explorer, or maybe Netscape Navigator.

      Click on File up in the left hand corner, and then Open or Open File. Find your file, 'index.html', and open it. There should be nothing in the main window; that’s okay. We’ll get there tomorrow. Look up in the top little bar, and you’ll see it says ‘My First Page!’ Corny, but gets the point. You can always change it to whatever you want.

      HINT: All pages should have titles specified, especially your index. If you don’t specify a title, the browser will put something in there for you; perhaps the page name, perhaps ‘untitled document’. If a visitor to your site wanted to put your page in her Favorites folder, which would help her remember what your page is about: ‘Untitled’ or ‘Sanna’s Webpage!’? To help people remember what your page is about, always put a title in every HTML file you make.


      Now, go back into your Notepad, and put another couple of blank lines after the title line. Now we’re going to put in a couple of meta tags. Meta tags are not seen by the person viewing your webpage unless they check the source of your page. They are used by search engines to establish authorship, copyright info, and for categorizing your page in their directory.

      All meta tags have a name attribute and a content attribute. Attributes are placed after the meta tag, and before the closing carrot. All attributes attached to tags take the following format:

<TAG attribute1="description" attribute2="arguement">

      Always have a space between the tag and the attribute, and between the end of the description and the next attribute. Never have a space before the enter sign or after it, and do not have a space between the last description and the closing carrot. The ‘description’ is called an ‘argument’; tags are modified by attributes, and attributes are modified by arguements.

      Authorship: To make it clear that you are the one who authored your webpage, write a meta tag that looks like this:
<META name="author" content="Sanna!">

      But put your name there, of course. This tells the browser that this particular meta tag specifies that you, yourself, authored this page. There are various other meta tag names, such as ‘copyright’, ‘keywords’, ‘description’, ‘robots’, and ‘generator’, to name just a few. Replace ‘author’ in the above example with any of these, and then adjust the content arguement to fit. For example, the copyright attribute. In the place of the copyright content arguement goes a statement about your page.

<META name="copyright" content="HTML 3-A-Day is under intellectual copyright by Sanna the SK, 2001-02.">

      Or any such ‘disclaimer’, if you will. Often, people with fanfic pages place disclaimers here including whom the original domain of their fics belong to; in my case, ‘ST: Voyager belongs to Paramount; no copyright infringement intended.’ But don’t disclaim all of your material away! If you wrote it, if you authored it, if you created it, it’s yours! For now, though, you can just put your name and the current year. We’ll get back to other names like ‘keywords’ and ‘description’ later, when there’s more material in the page.

      FAQ: "You capitalized ‘meta’, but not ‘html’, ‘head’, or ‘body’. Why? Does it matter?"
      Answer: No. HTML, as a language, is not case sensitive. All caps or all lowercase, even a mixing of the two, is all the same to the browser. Many coders use lowercase for tags that take no attributes, like ‘html’, and uppercase for tags that take attributes, like ‘meta’, to ease in reading. It’s up to you, what you want to do.

      So, to review: in between the head tags, we now have this:
<title> My First Page! </title>

<META name="author" content="Sanna!">
<META name="copyright" content="HTML 3-A-Day is under intellectual copyright by Sanna the SK, 2001-02.">

Always remember to save!!
Day Three: placing text on the page.

This HTML Tutorial was created by Sanna for the edification of new HTML programmers. Please do not steal the text from this page and call it yours. Reproduction rights granted for educational purposes only! Be nice, y'all; you know right from wrong. August 10, 2002.
HTML 3-A-Day
Main Index
Hosted by