HTML Coding Standards: Difference between revisions

Latest revision as of 00:43, 21 April 2024

You must unlearn what you have learned.

This article contains obsolete data. It reflects a Dark Brotherhood policy, position, or object that has been removed or replaced. It is preserved here for historical purposes only and should not be used/referenced.

Dark Brotherhood Coding Standards
Coding Standards and Practices
ASP Coding Standards	CSS Coding Standards	Database Standards
HTML Coding Standards	JavaScript Coding Standards	PHP 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:

@@ Line 1: / Line 1: @@
-HTML Coding Standards
+{{Obsolete}}
+<center>
+{| border="1"
+|-
+! colspan="3" |  [[Dark Brotherhood]] Coding Standards
+|-
+| colspan="3" align="center" |  [[Coding Standards and Practices]]
+|-
+|  [[ASP Coding Standards]]
+|  [[CSS Coding Standards]]
+|  [[Database Standards]]
+|-
+|  [[HTML Coding Standards]]
+|  [[JavaScript Coding Standards]]
+|  [[PHP Coding Standards]]
+|}
+</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 &lt;thead&gt; and &lt;tbody&gt; tags (as well as &lt;tfoot&gt; if applicable).
+* &lt;th&gt;'s scope attribute should be used.
+<pre>
+&lt;table&gt;
+  &lt;thead&gt;
+    &lt;tr&gt;
+      &lt;th scope="col"&gt;Header 1&lt;/th&gt;
+      &lt;th scope="col"&gt;Header 2&lt;/th&gt;
+    &lt;/tr&gt;
+  &lt;/thead&gt;
+  &lt;tbody&gt;
+    &lt;tr&gt;
+      &lt;th scope="row"&gt;1&lt;/th&gt;
+      &lt;td&gt;2&lt;/td&gt;
+    &lt;/tr&gt;
+    &lt;tr&gt;
+      &lt;th scope="row"&gt;3&lt;/th&gt;
+      &lt;td&gt;4&lt;/td&gt;
+    &lt;/tr&gt;
+  &lt;/tbody&gt;
+  &lt;tfoot&gt;
+    &lt;tr&gt;
+      &lt;th scope="col"&gt;Footer 1&lt;/th&gt;
+      &lt;th scope="col"&gt;Footer 2&lt;/th&gt;
+    &lt;/tr&gt;
+  &lt;/tfoot&gt;
+&lt;/table&gt;
+</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 &lt;html&gt;) tag.
+<pre class="lang-html">
+&lt;!DOCTYPE html&gt;
+</pre>
+===  Set the Charset  ===
+Make sure you set the charset to UTF-8.
+<pre>
+&lt;meta charset="utf-8"&gt;
+</pre>
+==  HTML5 Resources  ==
+DJBTemplate has some HTML5 functionality provided for us, so check out what it has to offer. Here are some handy HTML5 resources:
-[[Category: DJB Info]]
 [[Category:Coding Standards]]