Course Coding Standards

Warning

This page may update prior to when your first assignment is handed out. Expect there to be some changes.

In this course, please follow the following basic coding standards to ensure consistency.

HTML

1. Use Proper Doctype Declaration

Always start each HTML file with <!DOCTYPE html>.

2. Use Specific Elements Over Generic Elements

Where it makes sense, use appropriate tags such as <header> rather than a more generic <div> tag.

3. Indent Nested Elements

All nested elements should be indented.

<!-- Correct-->
<div>
    <p>This paragraph is properly indented.</p>
</div>

<!-- Incorrect -->
<div>
<p>This paragraph is not indented at all.</p>
</div>

4. Use Lowercase Element and Attribute Names

All element and attribute names should be lowercase.

<!-- Correct-->
<img src="image.jpg" alt="A descriptive text">

<!-- Incorrect -->
<IMG SRC="image.jpg" ALT="A descriptive text">

5. When using images, always provide an alt attribute for accessibility.

<!-- Correct -->
<img src="cat.jpg" alt="A playful cat">

<!-- Incorrect -->
<img src="cat.jpg">

CSS

1. Use External Stylesheets

Avoid inline styling for maintainability, and prefer instead external stylesheets.

<link rel="stylesheet" href="styles.css">

2. Use Hex, RGB, or Named Colours Consistently

You may use any valid color definition, but you should use them consistently. Hexadecimal is recommended.

color: #ff6600; /* Hexadecimal */

3. Use Hyphenated Class and ID Names

Use hyphens for separating words in class or ID names.

.main-content { }