Since I was made a content editor about two months ago, I've looked at the raw texts of a great many writeups, either because the writer had fled and left errors that needed correction, or through requests made at Broken Nodes, and the one thing I've noticed most often is that almost everyone who's ever written something here has awfully funny ideas about how HTML works.

Despite how good or competent many writeups seem, the formatting code often looks totally illiterate, almost random in its use. I realize that not everybody can pick up HTML as easily as others can, but there are so few tags that can be used here that not learning how to use them properly is really inexcusable, and (I daresay) offensively lazy.

Additionally, many seem to be stuck on using broken HTML 1.0 syntax. Given that HTML 1.0 is over 10 years old, I'd ask that anyone who is able to check out XHTML (the future!) and to use it as pedantically as you use words in your writeups.

Here's a summary of the tags you can use here, and how they work. Please memorize and use these, as they make reading things much easier, especially if you have to go back and edit something. A big, unbroken block of source code and text can't be all that easy to peruse to look for errors when necessary. Anyway, the list:

• <p> -- the "paragraph" tag. Put one at the beginning of a paragraph, and then a </p> tag at the end to format a paragraph. Do not use <br><br>, which is not only deprecated with the introduction of XHTML, but is also sloppy code, even though if performs mostly the same function (more on that below). You can add parameters to the <p> tag to change the paragraph's alignment. <p align="right"> will align your paragraph flush right, for example. The other options are "left" and "justify" (which evens out all the lines in the paragraph, like those I used above this list). The "center" option quite obviously centers the text inside the paragraph, which can be useful for single-lines of text that need to be centered, as E2 does not allow the use of <center>. This is the HTML tag you'll probably use the most often. Do not forget to close this tag, as some browsers will render unclosed paragraph tags as though they were nested, resulting in a page of successively right-shifting paragraphs. Another excellent reason to use this tag properly (which means closing it) is that it'll throw off E2's paragraph counter (which you can enable in your Writeup Settings) if you leave unclosed paragraphs. I'm not sure if any of the modern browsers do that (nesting paragraph tags) anymore, but I do remember it happening way back when, during the web's dark ages-like infancy, which was ruled over by Netscape 1.x and IE 2.x and the like. Of course, nobody uses those browsers anymore, but in the 11 years I've maintained my own websites, the very, very occasional oddity will show up in my Apache access logs. Sometime last year I got a hit from someone using AOL 2.0 on Windows 3.1. Truly, it boggles the mind. Frankly, I'm amazed that a browser that old (AOL 2.0 was ~1995-96) could even render anything at all on the web today, and if it could, it would probably take several minutes to do so, even if it's just tables and paragraphs.



• <br /> -- the XHTMLized version of the old <br> tag. It should not be used for formatting unless you're double-spacing list tags, or citing sources individually (one per line) at the end of a writeup. It does not require a close tag, and because of this, XHTML dictates that it must contain a space and a slash before the end-bracket. (Alternately, you can close your <br> tags if you'd prefer, but it's kind of pointless to do so when syntax doesn't directly require it.)



• <ul>, <ol>, and <li> -- list tags. You can use <ul> to create an unordered, bulleted list, like this:
  
  
  • Unordered list item 1
  • Unordered list item 2
  • etc.
  
  Or, you can use <ol> to create an ordered list, like this:
  
  
  1. Ordered list item 1
  2. Ordered list item 2
  3. etc.
  
  The <ol> tag has a "type" parameter, which is used to change the type of order the list is ordered by. An example of such use would be <ol type="1">, which creates the list type, ordered by single digits, as above. Other options for this parameter are 01, or other options with a specified number of leading zeroes, 5 (or any other number) which will start the list at the number you specify, I, which orders by Roman numerals, and A, which orders by letters.
  
  Inside either of those tags goes the <li> tag, which indicates a list item. You should wrap a set of <li> tags around each list item, so that it looks like this:
  
  <li>List item 1</li>
  <li>List item 2</li>
  <li>etc.</li>
  
  The end of your list should be followed by the close-list tag, which will be either </ul> or </ol>, because all three of these tags will nest if they're left unclosed.



• <abbr>, <big>, <em> or <i>, <s>, <small>, <strong> or <b>, and <tt> -- each of these are tags which will format the text style of individual words or entire paragraphs. (Note: Both <em> and <strong> behave exactly the same as <i> and <b>, but only on E2. Everywhere else on the web, the first two are laden with parameters defined by cascading stylesheets. Consider <em> and <strong> as "reserved for future use" on E2. Both may render differently in text-to-speech programs, but we're probably far enough away from such things being in regular use that you can pick which bold or italic tag you'd prefer to use.)
  
  <abbr> will allow you to abbreviate words while simultaneously putting a broken underline beneath it. For example, <abbr lang="en-US" title="Everything2.com">E2</abbr> is on the <abbr lang="en-US" title="World Wide Web">WWW</abbr> will render the following (with apologies to in10se's abbr writeup):
  
  

  E2 is on the WWW.

  
  <big> allows you to make words bigger. This tag can be nested (used more than once on the same word or words), and is closed with </big>, repeated however many times the tag is nested at its opening. (Generally, four or five nests are the most you'll need, as anything bigger is kind of obnoxious.)
  
  <em> is used to emphasise text. This tag is a CSS-specific tag, and thus it should be used here with the growth of CSS and how many of E2's themes may support user-defined tags in the future. You could realistically use <i> as an alternative to this, and some have suggested that <i> should be used for italicising small text instead of <em>. Up to you, really. Moreover, <cite> also has this effect on text.
  
  <small> is used to make words smaller. Much like its <big> counterpart, it can be nested. It is closed with a </small> tag, repeated as often as its nesting dictates.
  
  <s> is used to strike through words. Close it with the </s> tag. Generally there isn't much use for this tag, and it replaces the old <strike> tag. The <del> tag also does this.
  
  <strong> should be used to make words bold. Close it with a </strong> tag. This is also CSS-defined and should be used for the same reasons as <em> should be used. The <b> tag can be used as an alternative.
  
  <tt> is used for monospacing a word or group of words. Its primary use is for the display of code, like I'm using here to denote each HTML tag I'm using. Use this when a <pre> tag (see below) wouldn't be appropriate and close it with </tt>. Unlike the <pre> tag, it provides no auto-linebreaks, as you can see. <kbd> and <code> serve the same function.
  
  <u> is used for underlining text that isn't going to be a link. Doesn't really serve much of a purpose unless you like writing your section headers manually (i.e., without the use of the <h#> tags). <ins> also serves this function.



• Heading tags aren't used too often anymore, but they are still supported on E2. They aren't used much anymore because different browsers render them differently -- use too big a heading and it'll overwhelm somebody's browser window. Basically they just make text bold and/or bigger, and provide a line break after the bolded text. Here's an example:
  
  

  <h1>This is text rendered in H1</h1>

  <h2>This is text rendered in H2</h2>

  <h3>This is text rendered in H3</h3>

  ...and so on all the way down to <h6>. Close these tags as shown in this example. The same alignment parameters that <p> uses are also applicable with these tags. (Incidentally, E2 uses an <h1> tag, modified with CSS, to display node titles.)



• <blockquote> and <pre> are used for mass-formatting, always of whole paragraphs or even whole writeups (though it is inadvisable to use <pre> for anything other than displaying code, as it tends to stretch the page widthwise if used with long lines).
  
  The <blockquote> tag is quite simple:
  
  

  <blockquote>It just indents your paragraph or writeup about 40px on both the left and right sides. Some authors prefer to use this tag around their entire writeups, though most prefer to use it only to display a quote from something or someone that is more than a few sentences long.</blockquote>

  
  
  <pre> monospaces ("preformats") text, but only in blocks, so its use is best reserved for code, or ASCII art. HTML tags that format text will not work inside a <pre> tag, so there's no need to add line breaks to the end of each line when using one. Here's an example:
  
  

  <pre>
  --------------------------------
  |                              |
  |   this text is using <pre>   |
  |                              |
  --------------------------------
  </pre>
  




• Finally, <hr /> can be used to create a horizontal rule (line), though the only parameters E2 allows are the width parameter, which is specified in percentages, and the align parameter. A half-page wide, centered horizontal rule will look like this:
  
  

  ---

  Thus, the code for the line above this would be <hr align="center" width="200" />, which is 200px wide. You could just use an unmodified <hr /> tag and not specify a width, which would simplify things. An option addition to any <hr /> tag is the noshadow modifier, which will force the line to render without a dropshadow. E2 doesn't currently support it, at least not in writeups, but it does use it in the lines separating multiple writeups in single nodes.

That about wraps up the tags that are allowed here on E2. Please use them frequently and with relish, safe in the knowledge that you're doing yourself a favor by making your work more easily editable for yourself, and for content editors should the need arise. Single unclosed <p> tags in between each paragraph may have sufficed back in 1995, but things are different now. Please keep this in mind as we move toward more advanced forms of how we see text. Clean code is easier on everyone, whether they realize it or not.

If you're serious about what you write here, please be serious about how you write it. This has been a public service announcement by the E2 Content Editors.