basic html


If you want to have a site, then you're going to need to learn some basic HTML. You can go out and buy an expensive book, which will teach you way more than you really need to know, or you can sit back and read this simple guide. If you still have questions when you're through, you can email me and I'll be glad to help. Just don't email me saying "Hey. Make me a layout kthanxbai." =P

Dividers


First things first, you need to know how to seperate your content (other than site headers). The most common way is with a line break, which is simply like pressing "enter" in Wordpad. You do this by adding <br> at the end of a line. When coding, putting in a line break by pressing "enter" will not work. Another way to separate your code is with a horizontal line, which is simply <hr>.

Text and Fonts


There are many ways to change the appearance of text on a website. The most common ways are the font weight and decorations. They are as follows:

Italic
<i>text here</i>

Bold
<b>text here</b>

Underline
<u>text here</u>

Strike through
<s>text here</s>

You can also edit the color of the font. Here's the simple code to do that:

Colored Text
<font color="#000000">Colored Text</font>

Titles


Adding titles to your site is easy. What are titles? The title is the name that appears at the top of the window or on a tab. To ensure that your site has one, just put this code in the <head> tag of your site:

<title>Your Title Here</title>

Images


Most websites have images in them somewhere, and it's an easy code to master. First off, your image must be hosted on the internet. You can upload it to your site, or you can use an image host like Imageshack or Photobucket. After you've uploaded it, here is how you code it into your site:

<img src=direct link to image here>

If you want to link an image, it will automatically have a border around it that is the color of your links. If you want to get rid of that, then use this code:

<img src=direct link to image here border=0>

You can also align your image, so that the text appears beside it. If you want your image on the right and the text on the left, then add this code to your image: align=right. If you want the text on the right and the image on the left, add this code: align=left.

Links


Of course a site has to has links! One thing that people don't seem to realize about links is that if you are linking to a page within your site, the www.yoursite.com is not necessary. For example, if I want to link to a picture that is in the location http://jenviousity.com/images/picture.png, then I don't have to put all of that. I can simply link to images/picture.png. Here is the basic code for a link:

<a href=URL here>text</a>

Do you want your link to open in a new window? That's simple! somewhere between the "a" and "href", put this code: target=_blank.

Text Boxes


Text boxes become very handy on a website. you can put large quantities of text in a little space, and they can be very cute.~ So, here is the basic code for a text box (not for forms, but just for you):

<div style="width: 200px; height: 100px; border: 1px solid #000000; overflow-y: scroll;"> text here</div>

That particular code, with enough text added to show its effects, would look like this:

text here text here text here text here text here text here text here text here text here text here text here text here text here text here text here text here text here text here text here text here text here text here text here text here text here text here text here text here text here text here text here text here text here text here text here

Want to customize your text box or other parts of your layout? Check out the CSS command guide!

Spans



You can use the <span> tag to apply CSS commands to your text, without having a CSS stylesheet. To do this, just put your text in this format:

<span style="CSS commands here, separated by ;">text here</span>

You can add any CSS commands from the guide here, and they will apply to the text. (This includes borders and backgrounds).