This Factoidz article is the second element of a three-part series on the creating HTML tables in order to better organise Factoidz articles. Below is a table of contents to allow readers to navigate between articles:

• How to Use HTML Tables to Optimize Your Factoidz Articles (Part 1 of 3)
• How to Use HTML Tables to Optimize Your Factoidz Articles (Part 2 of 3)
• How to Use HTML Tables to Optimize Your Factoidz Articles (Part 3 of 3) (Coming soon!)

Tables they are a very useful tool once one understands how they work. I've published an article on Factoidz, entitled 'How to Interpret Road Signs in Europe,' which wouldn't have been possible without tables. However, due to their complexity and to the fact that they can be customised by the user, are relatively complex structures as far as HTML code is concerned. However, there are plenty of ways to tackle this problem.

In a previous Factoidz article, unrelated to this present series, we examined a few basic HTML codes which are potentially useful to any Factoidz writer. Furthermore, this present Factoidz is the continuation of another article, which approaches HTML tables from a more elementary point of view. I strongly recommend that a writer who doesn't master HTML code read my more elementary articles before going through this one. This particular Factoidz series is an introductory tutorial on how to create tables with HTML code. One must keep in mind that this is simply a practical reference, which by no means approaches HTML from a critical point of view; simply put, most people would probably agree that elements here work, even if some of them may present technical issues.

Hence, to better understand how to use tables we will proceed in three parts. In a first part, we have seen how on-line table generators can be used by Factoidz writers to enhance their articles. In this second part, we will learn how to build HTML tables without the help of on-line table generators. In a third and final part, which will be released soon, we will examine how the Factoidz writer's text box has features to help users further manipulate tables.

2. Beyond on-line table generators

Online table generators, as we have already seen in the first part of this Factoidz series, make it easy to create and insert tables into a Factoidz article through source code. However, table generators have important downfalls. One problem is that they rarely cover the whole range of table options available. For example, generators do not allow one to customise more intricate elements, such as the appearance of a table border, or the colour of each single cell. Hence, it is necessary to go through the source code of tables in order to understand how they work.

Table C

Code Effect <table>...</table> This code basically creates, or 'identifies' a table. Everything between <table> and </table> will constitute the table. While the table itself won't resemble much without subsequently inserting rows and columns, this is the absolute first and last code to enter when one want to use a table. <tr>...</tr> This element designates a row. Everything between <tr> and </tr> will constitute the cell. Each time this code is written, a new cell will  appear vertically. <td>...</td> This element designates a column. Everything between <td> and </td> will constitute the cell. Each time this code is written, a new column will appear.

The two first elements are absolutely necessary to create a table. The third element, the column element, is to be used only if one desires multiple columns. Hence, if one were to create a table from scratch, he could enter the source code on the left to obtain the result on the right. Note that in HTML: indentations and line breaks are used for clarity's sake, and have no effect on the effect of the code itself. The only elements of importance for the 'punctuation' of HTML are spaces, angle brackets and solidus:

<table>

      <tr>       <td>First Cell</td>     <td>Second Cell</td>   </tr>     <tr>       <td>Third Cell</td>     <td>Fourth Cell</td>   </tr>  

</table>

    First Cell Second Cell Third Cell Fourth Cell

Notice how there are no frames in this table. As one may understand by carefully examining the source code, the problem is that there is so far no code relating to border width. Hence, by adding the simple argument border="1" within the table command as indicated on the left, one will obtain the result on the right:

<table border="1">

  <tr>       <td>First Cell</td>     <td>Second Cell</td>   </tr>     <tr>       <td>Third Cell</td>     <td>Fourth Cell</td>   </tr>  

</table>

    First Cell Second Cell Third Cell Fourth Cell

By experimenting with different commands, one can further customise a table, with more flexibility than any on-line table generator can procure:

<table style="background-

color:yellow" width="200"

border="3" bordercolor=

"red">

  <tr>       <td width="20%">

First Cell</td>

    <td>Second Cell</td>   </tr>     <tr BGCOLOR="teal">      <td>Third Cell</td>     <td>Fourth Cell</td>   </tr>  

</table>

    First Cell Second Cell Third Cell Fourth Cell

The attentive and perusing reader will have understood that HTML code isn't all that bad after all, and that will a little bit of careful planing, one can make his own tables without the help of limiting on-line table generators. Fortunately, there are other web-based tools that can be of help, and are far less limiting than on-line table generators. In fact, I was surprised when I discovered that the Factoidz text box has several table-related tools built-in to its interface...

To be continued...