|
|
Line 1: |
Line 1: |
| HTML Coding Standards | | <center> |
| | <table border="1"> |
| | <tr><th colspan="3"> [[Dark Brotherhood]] Coding Standards |
| | </th></tr> |
| | <tr><td colspan="3" align="center"> [[Coding Standards and Practices]] |
| | </td></tr> |
| | <tr> |
| | <td> [[ASP Coding Standards]] |
| | </td> |
| | <td> [[CSS Coding Standards]] |
| | </td> |
| | <td> [[Database Standards]] |
| | </td> |
| | </tr> |
| | <tr> |
| | <td> [[HTML Coding Standards]] |
| | </td> |
| | <td> [[JavaScript Coding Standards]] |
| | </td> |
| | <td> [[PHP Coding Standards]] |
| | </td> |
| | </tr> |
| | </table> |
| | </center> |
| | |
| | == General Info == |
| | All applications should follow the following: |
| | |
| | |
| | * HTML code should follow the W3C’s recommendation for capitalization. In short this means all elements and attributes should be in all lowercase. |
| | * All HTML should be written as close to the W3C HTML5 standards as possible. |
| | * Semantic markup must be used. |
| | |
| | == Markup Guidelines == |
| | |
| | === Tables === |
| | * All tables should use the <thead> and <tbody> tags (as well as <tfoot> if applicable). |
| | * <th>'s scope attribute should be used. |
| | <pre> |
| | <table> |
| | <thead> |
| | <tr> |
| | <th scope="col">Header 1</th> |
| | <th scope="col">Header 2</th> |
| | </tr> |
| | </thead> |
| | <tbody> |
| | <tr> |
| | <th scope="row">1</th> |
| | <td>2</td> |
| | </tr> |
| | <tr> |
| | <th scope="row">3</th> |
| | <td>4</td> |
| | </tr> |
| | </tbody> |
| | <tfoot> |
| | <tr> |
| | <th scope="col">Footer 1</th> |
| | <th scope="col">Footer 2</th> |
| | </tr> |
| | </tfoot> |
| | </table> |
| | </pre> |
| | |
| | == If DJBTemplate is not being used... == |
| | Even though this isn't recommended, sometimes it is required. If you go down this road, here are a few tips and requirements. |
| | |
| | |
| | |
| | === Doctype === |
| | You need a doctype declared. As we are really pushing HTML5, please use the following as the first line of your HTML document (before the <html>) tag. |
| | |
| | |
| | <pre class="lang-html"> |
| | <!DOCTYPE html> |
| | </pre> |
| | |
| | === Set the Charset === |
| | Make sure you set the charset to UTF-8. |
| | |
| | |
| | <pre> |
| | <meta charset="utf-8"> |
| | </pre> |
| | |
| | == HTML5 Resources == |
| | |
| | [[DJBTemplate]] has some HTML5 functionality provided for us, so check out what [[DJBTemplate|it has to offer]]. Here are some handy HTML5 resources: |
|
| |
|
| [[Category: DJB Info]]
| |
| [[Category:Coding Standards]] | | [[Category:Coding Standards]] |
General Info
All applications should follow the following:
- HTML code should follow the W3C’s recommendation for capitalization. In short this means all elements and attributes should be in all lowercase.
- All HTML should be written as close to the W3C HTML5 standards as possible.
- Semantic markup must be used.
Markup Guidelines
Tables
- All tables should use the <thead> and <tbody> tags (as well as <tfoot> if applicable).
- <th>'s scope attribute should be used.
<table>
<thead>
<tr>
<th scope="col">Header 1</th>
<th scope="col">Header 2</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">1</th>
<td>2</td>
</tr>
<tr>
<th scope="row">3</th>
<td>4</td>
</tr>
</tbody>
<tfoot>
<tr>
<th scope="col">Footer 1</th>
<th scope="col">Footer 2</th>
</tr>
</tfoot>
</table>
If DJBTemplate is not being used...
Even though this isn't recommended, sometimes it is required. If you go down this road, here are a few tips and requirements.
Doctype
You need a doctype declared. As we are really pushing HTML5, please use the following as the first line of your HTML document (before the <html>) tag.
<!DOCTYPE html>
Set the Charset
Make sure you set the charset to UTF-8.
<meta charset="utf-8">
HTML5 Resources
DJBTemplate has some HTML5 functionality provided for us, so check out what it has to offer. Here are some handy HTML5 resources: