How to decide when to use <th> or when not? in <table>

Like for this code

<table id="presentationsContainer">
  <tr>
    <td class="main" width="60%">Presentation October 2009</td>
    <td class="dl" width="20%">Download pdf</td>
    <td class="dl" width="20%">Download ppt</td>
  </tr>
  <tr>
    <td class="main" width="60%">Presentation October 2009</td>
    <td class="dl" width="20%">Download pdf</td>
    <td class="dl" width="20%">Download ppt</td>
  </tr>
  <tr>
    <td class="main" width="60%">Presentation October 2009</td>
    <td class="dl" width="20%">Download pdf</td>
    <td cla开发者_开发问答ss="dl" width="20%">Download ppt</td>
  </tr>
</table>

the table header tag should be used when you're talking about header data. If you had a row in your table that served as an explanation for the content in the rest of the rows, you should specify that row using th. It seems that your code probably doesn't require one because all of the information is already in the table. Something like this would be an appropriate use of th.

<table id="presentationsContainer">
  <tr>
    <th>Presentation</th>
    <th>PDF</th>
    <th>PPT</th>
  </tr>
  <tr>
    <td class="main" width="60%">October 2009</td>
    <td class="dl" width="20%">Download</td>
    <td class="dl" width="20%">Download</td>
  </tr>
  <tr>
    <td class="main" width="60%">October 2009</td>
    <td class="dl" width="20%">Download</td>
    <td class="dl" width="20%">Download</td>
  </tr>
  <tr>
    <td class="main" width="60%">October 2009</td>
    <td class="dl" width="20%">Download</td>
    <td class="dl" width="20%">Download</td>
  </tr>
</table>

Sorry if I misunderstood the question. Not much explanation up there

The use of <th> vs <td> is entirely semantic. <th> is for column or row headers, <td> is for cells. In general, use <th> when you have one cell in a column or row which groups or labels a row/column of other cells.

In your simple example, I'd remove the use of classes completely, and simply style based on tag type. The classes are redundant, they add nothing semantically and as a styling hook they're unnecessary:

  <tr>
    <th width="60%">Presentation October 2009</th>
    <td width="20%">Download pdf</td>
    <td width="20%">Download ppt</td>
  </tr>

th are for table headers.

If you want October 2009 to be the table header then the HTML would be:

<table id="presentationsContainer">
  <tr>
    <th class="main" width="60%">Presentation October 2009</th>
    <td class="dl" width="20%">Download pdf</td>
    <td class="dl" width="20%">Download ppt</td>
  </tr>
  <tr>
    <th class="main" width="60%">Presentation October 2009</th>
    <td class="dl" width="20%">Download pdf</td>
    <td class="dl" width="20%">Download ppt</td>
  </tr>
  <tr>
    <th class="main" width="60%">Presentation October 2009</th>
    <td class="dl" width="20%">Download pdf</td>
    <td class="dl" width="20%">Download ppt</td>
  </tr>
</table>

You can also take out the class and width tags to keep the html simple, apply styles to the table and use CSS selectors to doing the styling eg:

#presentationsContainer table tr th {
    width: 60%;
}

#presentationsContainer table tr td {
    width: 20%;
}

Once again, this is a good example of content vs. style. Semantically, <th> should be used for the headers of table columns, while simple <td> tags should be used for table cells that aren't table headers.

This is also why you would usually just find one row <th> tags within a table compared to multiple <td> tags.

In your example, there simply is no use for <th> tags, since you don't have a row that serves as a header row, so your code would be good.