An interesting list of coding errors

HTML

Never put HTML content (e.g. paragraphs, headings, lists) in the head. Only links to stylesheets or metadata belong there.
It’s best to copy and paste doctypes or metadata tags as the content in them can be complex to type in, and it’s important there are no errors.
There should be no content or tags between the closing </head> and the opening <body> tags - things should be in one or the other.
Check you haven’t added any stray characters to your code.

Attributes

Attributes are name="value", not name+"value" or name "value" or name:"value" or name-"value". Check you are using the right attribute name - href is different to ref or rel. It’s very unusual to need to have an attribute with no value in it, e.g. href=”” - there should always be something inside the quotes.
For languages (e.g. <html lang="en">) you need to use the official abbreviation, not one you create.
You can’t misspell attribute names or values - computers aren’t smart enough to know what you mean.

Working with tags

Close your tags - always check there is a starting tag <tag> and an ending tag </tag>. Any and all of these:
- <tag/>
- <t/ag>
- </tag/>
- </tag
- </tag>> won’t work.
- Using an ending tag </ul> as the start tag won’t work.
If you have a self-closing tag like <img> you don’t necessarily need the ending <img /> slash - for tags that contain content you always need the ending tag, e.g. <p></p>. So whenever you start a tag, check you’ve finished it. That includes the '<' and the '>'.
Make sure your tags are opened and closed in the correct sequence: <strong><span>text</span></strong> would be OK, but <strong><span>test</strong></span> is not.
Don’t repeat tags, just make sure that each one you open you eventually close. Don’t mix block level elements with in-line elements - e.g. <p><div></div></p> won’t work, neither will <strong><div></div></strong>
This is especially true for <a> tags - you need <a href="[web address]">[link text]</a>. Always close your tags.

Specific tags

Watch the ‘nesting’ of a <ul> inside a <dl> tag:

<dl>
    <dt>Term</dt>
    <dd>
    <p>Some text</p>
        <ul>
        <li>Item</li>
        <li>Item</li>
        </ul>
    </dd>
</dl>

and make sure you have <dt>s and <dd>s inside your <dl>. Make sure you have a <dl> before you start doing <dt>s and <dd>s.

It’s very unusual to have a <dl> inside a <ul>.
If you start a <ul> all the content should be inside <li>s until you close the </ul>
Make sure you write the sequence of table rows and columns correctly - always

<tr><td>Item</td><td>Item</td></tr>

Start with the row, then the column or header tag.

CSS

Never put HTML in a CSS file (or vice versa) or save a HTML document as .css.
You can apply classes to style content with CSS to pretty much most HTML elements - you don’t need to just apply them to e.g. p tags or div tags. So you don’t need to do ```

content

you can just do

content

* The pattern is:

selector { property: value; } p { color: red;} ``` So missing out the : or the ; will cause problems. Forgetting both or one of the curly brackets will cause problems.

You always need a selector before the curly brackets.
Always close one css declaration before you open another one.
You will need to spell some of the selectors in the american way - color rather than colour. CSS isn’t set up to understand both.
Properties and values should always be in lower case. p {Font-Size: 1em; Color:red} should be p {font-size: 1em; color: red;}
It’s not wrong to end your last line inside the curly brackets without a ; but it will probably cause you issues at some point - it’s a good habit to get into:
- p {font-size: 1em; color:red} is OK but
- p {font-size: 1em; color: red;} is better if you need to add another rule
Don’t start your stylesheet with a tab: start from the left margin.