Main Page Content
Submission Style Guide Code 2001
This document outlines the acceptable tags for use in posting articles. Please note that while you may use other tags, our editors (or our CMS) will most likely remove them before posting. This site is coded to xHTML 1.0 Transitional, so please only use elements and attributes from that specification. In particular, please remember:
- All tags must be properly nested
and
tags need to be self closing:and
- All markup must be in lower case, and all attributes quoted
<h#> Tags and Their Use
The
tags should be used for section headings. Using
is forbidden since that is the top-most title of every page. Please use them in order; don't skip to
without first using
. For your settings, the
tags will render as:This is the <h2> tag
This is the <h3> tag
This is the <h4> tag
This is the <h5> tag
This is the <h6> tag
Paragraphs
Please wrap each paragraph within a
pair.Styling Text
Bold
Please use the
pair to strongly emphasise. This is preferred to
since it describes structure instead of style.This is bold textItalic
Please use the
pair to emphasise text. This is preferred to
since it describes structure instead of style.This is italic textUnderline
Please do not use the
pair to underline text. Not only is it deprecated, but it may confuse users about whether or not it is a link. If you think something should be underlined, it would probably be more correct to make it bold or italic.Color
Do not apply any color to any text via CSS or the
tag. The CSS for the site allows any user to customize the colors and fonts, and setting colors would override those settings, possibly hiding your text.The <font> Tag
The
tag is not allowed, if you use it we will remove it. All font properties for the site are defined via the CSS and customizable by each user. All markup must be structural; the
tag does not denote structure. Also, the
tag is deprecated.Script and Code Samples
If you're using block-level code samples (see below), please don't forget to escape all your entities. This means, in particular, changing all your>
and <
characters into >
and <
entities (respectively) as well as &
to &
and "
to "e;
. You can get a complete list of the accepted character entities from section 24.2 Character entity references for ISO 8859-1 characters of the HTML 4.01 specification at the W3C site. There is also a character entity chart right here on the evolt.org site: A Simple Character Entity ChartCode Blocks
Blocks of code/script/markup should be placed between
tags. Since
is a block level element, it will be rendered as its own paragraph. This is how a block of code will appear on the site. Long lines of text will result in a scrollbar that doesn't mess up the layout.Short lines willbe rendered thuslyYou may also post block level PHP code between
tags for pretty syntax colour coding:Inline Code
Code/script/markup snippets within a paragraph should be wrapped within
tags. This will escape all your entities for you.This is a sample of inline code.
Linking
Whenever possible, please try to add a 'title' attribute to your
tags. So a tag may appear like this:
.Off-Site Links
Please add a 'target' attribute to your links to open a new window so readers of your article on evolt.org don't lose their place. Please use "_blank" so all new links open in one window, since the use of "_new" opens links in a new window for each link. To expand on the above example:
.Miscellaneous Tags
Abbreviations
Whenever you use abbreviations in articles, please keep in mind that not everyone knows all abbreviations out there. To allow users to see what an abbreviation means, you can wrap it in the
tag and add a title
attribute with the full name of the abbreviated item. For example:The W3C is an example of this in action. The abbreviation in the previous sentence uses the
tag.Acronyms
Whenever you use acronyms in articles, please keep in mind that not everyone knows all the acronyms out there, either. To allow users to see what an acronym means, you can wrap it in the
tag and add a title
attribute with the full name of the acronym. For example:WYSIWYG is an example of this in action. The acronym in the previous sentence uses the
tag.Horizontal Rules
The
tag will render as: Bullet Lists (Ordered, Unordered, Dictionary Lists)
The
,
, and
tags will all work. No special formatting is applied via the CSS. You can see examples of lists below.Forms and Form Elements
Please do not use any
tags or elements.Tables
You may use all the normal attributes for your tables. This includes cellpadding, cellspacing, border, align, and valign. Please do not color any table cells or content as it may conflict with user-defined styles. Please use, , and to delineate the header, body, and footer of the table. Please use <th> for header cells. A sample table: Header1 (<th>) Header2 (<th>) Header3 (<th>) Cell1A and 1B Cell2A Cell3A Cell2B Cell3B Cell1C Cell2C and 3C Footer
Data Tables
Just in case you have a table with tabular data that you want to display with gridlines, we've created a class to do just that. Simply add class="data"
to the table tag. You will also need to set "cellspacing" to 0. The minimum code to render a table this way is: . An example table is below. Header1 (<th>) Header2 (<th>) Header3 (<th>) Cell1A and 1B Cell2A Cell3A Cell2B Cell3B Cell1C Cell2C and 3C Footer
JavaScript
Please do not use JavaScript (or VBScript, or ECMAScript) in articles. If it is necessary for an article, we may leave it, and most likely will edit it. Otherwise, all submissions with any client-side scripting will have it removed.Allowed Tags
Following is the list of accepted tags, most of which have been covered above. - <a>,</a>
- <strong>,</strong>
- <em>,</em>
- <p>,</p>
- <blockquote>,</blockquote>
- <ul>,</ul>
- <ol>,</ol>
- <li>,</li>
- <dl>,</dl>
- <dd>,</dd>
- <dt>,</dt>
- <pre>,</pre>
- <code>,</code>
- <abbr>,</abbr>
- <acronym>,</acronym>
- <cite>,</cite>
- <table>,</table>
- <thead>,</thead>
- <tbody>,</tbody>
- <tfoot>,</tfoot>
- <tr>,</tr>
- <th>,</th>
- <td>,</td>
- <br />
- <img>
Writing Style
Research has shown that the writing on a web site has a significant impact on the usability (and therefore effectiveness) of a site - up to 125% improvement. The following are outline guidelines, which will significantly improve the impact of our copy.
- Be succinct - no more than 50% of equivalent wordage in print
BECAUSE
Reading from screens is substantially slower than from paper. Users intensely dislike reading long texts. -
- Be scannable - structure articles with 2 or 3 headlines (nested if necessary).
- Use meaningful rather than teaser headlines and subheads (reading a headline should tell users what the section's about).
- Use text weight and colour to add highlighting and emphasis.
- Use bulleted lists.
BECAUSE - Users do not read copy in full (at least not on 1st reading), they scan. Headlines and page titles are often viewed out of context.
- Users are adept at disregarding everything that does not look like a clear headline and do not waste their time on links which may be a waste of time.
-
- Structure long documents. Content should not be arbitrarily cut up into page 1, page 2 etc. Each page should encapsulate a discrete topic. Each page should be written as an inverse pyramid, with a clear summary of the page at the start.
- Secondary and background information should always be available on separate pages accessed from a link.
- Printable versions should be on a single page.
BECAUSE
While users dislike long documents, they particularly dislike having to download several pages to cover one topic. They do like choice over which subtopics to read.
- Use cool, objective language to build credibility.
BECAUSE
Users detest marketing copy - a promotional style with boastful claims. Users are busy, they want the facts, and tend to believe content which gives it to them without embellishment. -
- Linked text should describe where the links lead, not give ‘click here’ instructions. An appropriate way to consider linked text is that it should represent the headline of the content users will arrive at.
- Use link titles to give additional explanation if warranted.
BECAUSE
Users do not follow bad links, and links can be presented out of context by certain browsers and search engines. ‘Click here’ instructions also break up the flow of text and make it more difficult to read.
Bibliography: http://www.useit.com/papers/webwriting/
The access keys for this page are: ALT (Control on a Mac) plus:
- 1 links to the evolt.org home page.
- plus 2 skips to the main content of the page.
- plus 3 skips to login and registration.
- plus 4 skips to the search form.
- plus 5 links to site FAQs.
- plus 6 skips to list of content categories in this site.
- plus 7 skips to the index of other sites in the evolt network.
- plus 9 links to the feedback page.
- plus 0 will repeat this list.