|
Last Revised: November 10, 2009 It seems that, for those that want to write guides, having a quick guide to some of the basics of the language would help. Obviously, by reading this, you will not become an expert by any means, but it can help you out, even just a small bit. TEXT FORMATTING You can really bring attention to words or headings with a little formatting, like using bold or italics. If you have used BBC(forum) formatting, then this shouldn't be too difficult to learn.
That shouldn't be too hard. Changing other elements of the text gets a bit tougher. This is done through the use of the <font> tag. While the tag alone does nothing, attributes can be changed on it depending on what you want it to do. Below is some of the more useful and common. SIZE
As you can see, the size=? is the attribute for size. The larger the value, the bigger the text. The smaller the value, the smaller the text. The base size for all text on this site is 3, with headers usually 4 and titles 5. COLOR
Pretty similar to the size attribute. You can name just about any basic color, like red, orange, yellow, green, aqua, blue, purple, white, and so on. If you want more flexibility in your choice of color, you can use the hex code instead. To do this, be sure to start it with "#" and then the code. There are places online to get these codes or can use some programs like Photoshop to get it for you. COMBININGAll of these attributes can be used in combination to give you the look you want. Here are some examples:
PAGE FORMATTING While you may be able to now play around with how the text looks, it is nothing if you don't know how to show it. SPACINGThere are a few ways to accomplish this. One way, though it can get messy, is with the <br /> tag. This stands for "break". As seen with the slash, it starts and ends itself. This small tag basically just says "start a new line". While it works, it isn't overly useful in guides compared to the next method. <p>The best way to space is through the <p> tag. This stands for "paragraph". Anything between the <p></p> tags is seperated by a break, leaving an empty line above and below. Each of the paragraphs in this guide use these tags and I placed them around this paragraph to give you an idea of what it looks like.</p> The <p> tag also has the ability to change the alignment of the text within. For example, this text is aligned left (the default)... <p align="center">This text is aligned center</p> <p align="right">This text is aligned right</p> LISTSThis part can get confusing. This section will help you organize the text into small lists like above. There are two ways to do this. One is through the use of bullets and the other is by numbering. To make a bulleted list, the tag is <ul>. This stands for "unordered list". It isn't as simple as just surrounding a bunch of text with <ul></ul>. You have to specify the individual items within the list. This is done with the <li> tag. This stands for "list item". I know this is alot, so here is an example: <ul>
If you want to create a numbered list, it is almost identical to the method above. Instead, you use the tag <ol>. This stands for "ordered list". Here is another example: <ol>
As with the <p> tag, the list places an empty line above and below itself (I forced a format change in the example to show the tags without spacing). OTHER STUFF LINKS Being able to link to other sites is very helpful and isn't too difficult. It makes use of the <a> tag. This stands for "anchor". While the name may not fit it's roll right away, it will in a second. A basic link will look like this: <a href="http://www.acecalcs.net">CLICK HERE!</a>. This would give you CLICK HERE!, linking to the AceCalcs main page. If you don't want the link to redirect from the current page, you can add the attribute of target="_blank". The above example would then look like this: <a href="http://www.acecalcs.net" target="_blank">CLICK HERE!</a>. To try it... CLICK HERE! LINKING WITHIN DOCUMENTThis is where the "anchor" name comes in. You are able to have a link go to a specific location of the current page. To do this, you have to first set up the "anchor", or where you want it to link to. This is done by making an <a> tag with a name. That will look like this: <a name="top"></a>. To then link to this location, you create a link that looks like this: <a href="#top">Go to top</a>. I set up an anchor at the title of this page, so just click here to give it a try. DISPLAYING HTML RESERVED CHARACTERSThere are specific characters that won't show on the page without some playing. Those mainly being < and >. That is obvious as they are used to mark the start and end of tags. To show them on the page, like I did for the examples, you have to use their HTML entities:
So when I was displaying those examples, the tag of <a> would look like this in the code: < a > . I added a blank space in there as well. Browsers are set to erase all blank space between characters except 1 space. If you want more than 1 space, you have to use . CONCLUSION That should be enough for any basic guide to be written. If you feel ambitious enough, you can always browse around the internet to learn about some other useful syntax, like <table> or <img>. Another way to understand things better would be to look at the source code for this page. The option should be under a "View" menu or by right clicking the page. There are also alot of programs out there that can help you out. Frontpage and Dreamweaver are some of the best, but aren't free. I personally use Notepad++, but that is just a text editor that color codes tags. So yes, I wrote this whole site in Notepad. >_> Hope this helped motivate you to get a guide you wrote added to the site or to start a new one! :D |