Jens Oliver Meiert

Don't overcomplicate things:

- Have only one CSS-file, unless your project is huge.

- Never use IDs

- Avoid reset CSS (espescially if you can ignore IE6/7

- If you think you need variables (like in SASS), you are probably thinking about it the wrong way

- Give classes functional names, not presentational

- Linebreaks after declaration. (Makes your CSS-file easier to navigate)

- Remember that you can use you media queries inside your CSS-file

Web designer Jens Meiert has some good articles:

http://meiert.com/en/blog/20090401/why-css-needs-no-variables/

http://meiert.com/en/blog/20080515/css-organization-and-efficiency/

http://meiert.com/en/blog/20070321/css-practice-pseudo-namespaces-in-complex-projects/

http://meiert.com/en/blog/20090527/css-maintenance-issue-1/

There isn't even a need for the <head> and <body> tags at all. This is valid HTML 4.01 Strict:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html lang="en">
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>Here's our title</title>
<link rel="stylesheet" href="stylesheet">
<p>Here's our body

And this is valid HTML 5:

<!DOCTYPE html>
<html lang="en">
<meta charset="utf-8">
<title>Here's our title</title>
<link rel="stylesheet" href="stylesheet">
<p>Here's our body

(From http://meiert.com/en/blog/20080429/best-html-template/ )

Thanks to Aaron for posting this. Such a great reminder.

Anyone interested in this subject, check out a series of three very tiny books called “UPGRADE YOUR HTML” by Jens Oliver Meiert.

They give great step-by-step examples for eliminating optional tags and attributes, reducing HTML to its cleanest simplest valid form. The author is a super-expert in this specific subject, working with Google and W3C on this. His bio here: https://meiert.com/en/biography/

From LeanPub:
https://leanpub.com/b/upgrade-your-html-123

From Amazon:
https://www.amazon.com/gp/product/B08NP4GXY2/

Exactly what I was thinking, by omitting the <html> <head> and <body> HTML can be quite concise [1]. Additionally the closing </li> can be omitted from lists and <li> barely a step over using - for bullet points.

The worst part about HTML is the links, though. Anchor tags are awful. Having to repeatedly type <a href="..."> and closing with </a> is wayyy too boilerplate much for for something that is simply surrounded with [square](brackets) in markdown.

[1] I go to https://meiert.com/en/blog/optional-html/ for reference.