poyribn/html-template
1
1
Fork
You've already forked html-template
0
My personal HTML5 boilerplate
  • HTML 100%
poyribn 520929ad85 Update README 
I forgot to do that for a long Time
	— poppy ribbon (https://codeberg.org/poyribn)
2026年06月11日 04:26:38 +02:00
index.html Move meta charset to the Top of the metas 2026年06月11日 03:32:13 +02:00
LICENSE.txt first commit 2023年12月25日 18:49:16 +01:00
README.md Update README 2026年06月11日 04:26:38 +02:00

HTML Template

My personal HTML5 Boilerplate.

This Project assumes that you have basic Knowledge of HTML5.

There are more than 1 Ways to write a HTML Boilerplate, so i explain my decisions when writing this Boilerplate:

Formatting

  • Uses Indents to make the Structure clear
  • Every indent is a Tab
  • The major Sections (Header, Body) are separated by 2 blank Lines
  • Sections inside the major Sections (Header, Body) are separated by 1 blank Line

<html> Tag

  • The Language in the <html> tag is set to English
    because it’s the Language that Poppy writes most of his Websites in.

Header (<head>) Section

  • The Character Set (charset) is set to UTF-8, of Course.
  • The Charset is set before any other meta Tag, so that everything on the Page gets interpreted correctly.
  • The <meta name="robots"> Tag is set to disallow scraping by Machine Learning Bots.
    It is one of many Methods which rfm suggests to "bot-proofing your website",
    though i highly recommend reading the whole Article.
  • The Tab title is set to Tab Title, so that you can easily find where to change it.
  • The <link rel="stylesheet"> Tag links to a Stylesheet with the Filename index.css
    so that when you create a stylesheet with the filename index.css in the same Folder as the Webpage,
    it gets instantly applied (after reloading the Page, of course).
  • The <meta name="viewport"> Tag makes the Website as wide or as narrow as is appropriate for the Device,
    not limiting it to wide Desktop Widths.

Body (<body>) Section

  • I put a Heading (<h1>) and Paragraph (<p>) because most Websites start out with these Elements.
    These have Heading 1 and Paragraph as their default Text,
    so that they stand out as something you should change.
  • The <script> Tag references a JavaScript File named index.js,
    so that when you create it in the same folder as the Webpage,
    it instantly gets applied (after reloading the Page, of course).
    I put it at the very End of the Page so that the Script won't have Trouble with Elements that it references not having loaded yet.