📦 Pragmatic but rigorous templates to kick off your next web project: HTML5, CSS3, JS, metadata, microformats…
The table below summarises the features of each template. The templates in the table go from simplest to most complex: the first one is the smallest possible valid HTML5 page, while the last one adds lots of additional features and files.
Review the table, 👓 visiting the respective pages or 📂 browsing the files until you find a template that suits your needs.
Then, ⬇️ download the chosen template.
There are placeholders in the files you just downloaded; they are marked @@LIKE_THIS@@.
Make sure you find all placeholders, and replace them with actual values.
You are done!
| HTML 1 | CSS 2 | JS 3 | Metadata | Libraries | Responsive | ||
|---|---|---|---|---|---|---|---|
| #1 Minimal markup | ✔️ | 👓 📂 ⬇️ | |||||
| #2 Functional page | ✔️ | 👓 📂 ⬇️ | |||||
| #3 Embedded CSS & JS | ✔️ | ✔️ | ✔️ | 👓 📂 ⬇️ | |||
| #4 Separate CSS & JS | ✔️ | ✔️ | ✔️ | 👓 📂 ⬇️ | |||
| #5 Additional files | ✔️ | ✔️ | ✔️ | ✔️ | 👓 📂 ⬇️ | ||
| #6 Common libraries | ✔️ | ✔️ | ✔️ | ✔️ | ✔️ | coming soon | |
| #7 Responsive | ✔️ | ✔️ | ✔️ | ✔️ | ✔️ | ✔️ | coming soon |
All versions are polyglot markup.
1 All markup is valid HTML5, according to the W3C markup checker
2 All stylesheets are valid CSS level 3, according to the W3C CSS checker
3 All code is valid JavaScript (ECMAScript 2015) in strict mode, according to ESLint