More concise information and better resources for learning HTML can be found at various locations on the internet but we in the Clan Board feel it would be useful to have an article here on it to teach members basic principles to use for profile pages and for articles. This text will focus on the styles and techniques used on the Clan page
There are several technologies available for web design currently available. Due to our currently very limiting server situation, the Clan site utilities HTML (HyperText Markup Language), CSS2 (Cascading Style Sheets Version 2), and JavaScript (a web scripting language developed by Sun). However, for basic sites like you will be dealing with you will only use HTML and so this document will focus mainly on it.
HTML uses what are called tags to control formatting. An example tag may look like this: <p> for the paragraph tag. Most tags also must be closed to show where that formatting ends. For example, to close the paragraph tag you would use </p>.
Some tags also have properties which you can set. An example which is used in many of our pages at the clan is this: <p class="paragraph">. We actually set the definition of the paragraph class using CSS but that is beyond the scope of this document. Another common example is some of the headers we use at the tops of the pages such as this one. We use the <h1> tag which creates a large header, however we invoke it as <h1 align="center"> which allows us to center it. As explained earlier, we must close the tag with </h1> to avoid making the entire document a large, centered header.
Websites have a few required tags that you must use. They include the <html> and <body> tags, however we also recommend using the <head>, and <title> tags.
A basic website layout might look like this:
<html>
<head>
<title>My Website title</title>
</head>
<body>
<h1 align="center">My Title</h1>
<p>
This is my main body
</p>
</body>
</html>
This sample code would render a website that looks like this:
This is my main body
Another important thing to remember is that HTML does not treat white space as you would expect. If you indent your text in the HTML document or if you make new lines that will not translate to those features being displayed. If you would like to force a new line use the <br> tag wherever you would like to force a new line. If you would like to use indentation you will need to use CSS.
We have, however, made that part a little easier as we showed briefly above. If you would like to have a paragraph indented, you will need to include the CSS definition file in the head tags of your website. Please just accept the format of this one until you understand more. You would then encapsulate your paragraph text with <p class="paragraph"> and </p> as the starting and ending tags respectively. Here is what it would look like:
<html>
<head>
<title>My Website title</title>
<link rel="stylesheet" href="/rebellion/clangodmakers/styles.css" type="text/css">
</head>
<body>
<p class="paragraph">
My Test Paragraph which uses the news basic HTML principles along with the CSS class paragraph which we imported so that we can indent our text. Pretty cool, huh?
</p>
</body>
</html>
That code would render a page which looks like this:
My Test Paragraph which uses the news basic HTML principles along with the CSS class paragraph which we imported so that we can indent our text. Pretty cool, huh?
Another good resource to use for learning HTML is to use the View Source function of your browser. This can normally be found under the edit menu. It will show you the code used to create a specific website. You may find yourself overwhelmed if you try to examine some more complicated website's code. For example, at this point, the main Clan page or some of the profile pages (such as those authored by Satan) may be above your level but some of the simpler pages on the clan site or some of the articles and simple profiles may be a good place to start.
If you have any questions about the current content of this document or have suggestions for future revisions of it please email Satan.
