From 98ec4143cdcf740c2042ea3e0f62a5e34fbdbc3f Mon Sep 17 00:00:00 2001
From: Shinigami <chrissi92@hotmail.de>
Date: Tue, 30 Jun 2020 15:40:31 +0200
Subject: [PATCH] docs: documentation for new configuration structure (#447)

* docs: new configuration structure for alt-require

* docs: new configuration structure for attr-lowercase

* docs: new configuration structure for attr-no-duplication

* docs: new configuration structure for attr-no-unnecessary-whitespace

* docs: update getting started

* docs: add missing rules

* docs: fix broken links

* docs: new configuration structure for attr-sorted

* docs: remove unnecessary prettier-ignore

* docs: new configuration structure for attr-unsafe-chars

* docs: new configuration structure for attr-value-double-quotes

* docs: new configuration structure for attr-value-not-empty

* docs: use texts from rules

* docs: new configuration structure for attr-value-single-quotes

* docs: new configuration structure for attr-whitespace

* docs: new configuration structure for doctype-first

* docs: new configuration structure for doctype-html5

* docs: remove empty-tag-not-self-closed

* docs: new configuration structure for head-script-disabled

* docs: new configuration structure for href-abs-or-rel

* docs: new configuration structure for id-class-ad-disabled

* docs: new configuration structure for id-class-value

* docs: new configuration structure for id-unique

* docs: new configuration structure for inline-script-disabled

* docs: new configuration structure for inline-style-disabled

* docs: new configuration structure for input-requires-label

* docs: new configuration structure

* docs: update doc attr-whitespace

* docs: update doc tags-check

* docs: update doc tagname-specialchars

* docs: update doc
---
 docs/user-guide/getting-started.mdx           |  4 +-
 docs/user-guide/list-rules.md                 |  7 +-
 docs/user-guide/rules/alt-require.md          | 42 +++++++--
 docs/user-guide/rules/attr-lowercase.md       | 49 ++++++++--
 docs/user-guide/rules/attr-no-duplication.md  | 42 +++++++--
 .../rules/attr-no-unnecessary-whitespace.md   | 45 +++++++--
 docs/user-guide/rules/attr-sorted.md          | 51 ++++++++++
 docs/user-guide/rules/attr-unsafe-chars.md    | 50 +++++++---
 .../rules/attr-value-double-quotes.md         | 43 +++++++--
 docs/user-guide/rules/attr-value-not-empty.md | 42 +++++++--
 .../rules/attr-value-single-quotes.md         | 52 +++++++++++
 docs/user-guide/rules/attr-whitespace.md      | 61 ++++++++++++
 docs/user-guide/rules/doctype-first.md        | 45 ++++++---
 docs/user-guide/rules/doctype-html5.md        | 49 ++++++++--
 .../rules/empty-tag-not-self-closed.md        | 27 ------
 docs/user-guide/rules/head-script-disabled.md | 42 +++++++--
 docs/user-guide/rules/href-abs-or-rel.md      | 60 ++++++++++--
 docs/user-guide/rules/id-class-ad-disabled.md | 42 +++++++--
 docs/user-guide/rules/id-class-value.md       | 71 +++++++++++---
 docs/user-guide/rules/id-unique.md            | 48 +++++++---
 .../rules/inline-script-disabled.md           | 43 +++++++--
 .../user-guide/rules/inline-style-disabled.md | 39 ++++++--
 docs/user-guide/rules/input-requires-label.md | 53 +++++++++++
 docs/user-guide/rules/script-disabled.md      | 47 ++++++++++
 .../rules/space-tab-mixed-disabled.md         | 52 +++++++++--
 docs/user-guide/rules/spec-char-escape.md     | 40 ++++++--
 docs/user-guide/rules/src-not-empty.md        | 40 ++++++--
 docs/user-guide/rules/style-disabled.md       | 47 ++++++++--
 docs/user-guide/rules/tag-pair.md             | 43 +++++++--
 docs/user-guide/rules/tag-self-close.md       | 52 +++++++++++
 docs/user-guide/rules/tagname-lowercase.md    | 47 ++++++++--
 docs/user-guide/rules/tagname-specialchars.md | 51 ++++++++++
 docs/user-guide/rules/tags-check.md           | 92 ++++++++++++++++++-
 docs/user-guide/rules/title-require.md        | 63 ++++++++++---
 website/sidebars.js                           | 13 ++-
 35 files changed, 1340 insertions(+), 254 deletions(-)
 create mode 100644 docs/user-guide/rules/attr-sorted.md
 create mode 100644 docs/user-guide/rules/attr-value-single-quotes.md
 create mode 100644 docs/user-guide/rules/attr-whitespace.md
 delete mode 100644 docs/user-guide/rules/empty-tag-not-self-closed.md
 create mode 100644 docs/user-guide/rules/input-requires-label.md
 create mode 100644 docs/user-guide/rules/script-disabled.md
 create mode 100644 docs/user-guide/rules/tagname-specialchars.md

diff --git a/docs/user-guide/getting-started.mdx b/docs/user-guide/getting-started.mdx
index dee1d3f6f..c8616d440 100644
--- a/docs/user-guide/getting-started.mdx
+++ b/docs/user-guide/getting-started.mdx
@@ -38,11 +38,11 @@ yarn add --dev htmlhint
 
 ```shell
 {
-  "attr-value-not-empty": false
+  "attr-value-not-empty": "off"
 }
 ```
 
-3\. Run HTMLHint on, for example, all the CSS files in your project:
+3\. Run HTMLHint on, for example, all the HTML files in your project:
 
 ```shell
 npx htmlhint "**/*.html"
diff --git a/docs/user-guide/list-rules.md b/docs/user-guide/list-rules.md
index c94f46f1c..70ae4a18e 100644
--- a/docs/user-guide/list-rules.md
+++ b/docs/user-guide/list-rules.md
@@ -17,19 +17,18 @@ title: List of rules
 
 - [`attr-lowercase`](/docs/user-guide/rules/attr-lowercase): All attribute names must be in lowercase.
 - [`attr-no-duplication`](/docs/user-guide/rules/attr-no-duplication): Elements cannot have duplicate attributes.
-- [`attr-no-unnecessary-whitespace`](/docs/user-guide/rules/attr-no-unnecessary-whitespace.md): No spaces between attribute names and values.
+- [`attr-no-unnecessary-whitespace`](/docs/user-guide/rules/attr-no-unnecessary-whitespace): No spaces between attribute names and values.
 - [`attr-unsafe-chars`](/docs/user-guide/rules/attr-unsafe-chars): Attribute values cannot contain unsafe chars.
 - [`attr-value-double-quotes`](/docs/user-guide/rules/attr-value-double-quotes): Attribute values must be in double quotes.
-- [`attr-value-not-empty`](/docs/user-guide/rules/attr-not-empty): All attributes must have values.
+- [`attr-value-not-empty`](/docs/user-guide/rules/attr-value-not-empty): All attributes must have values.
 - [`alt-require`](/docs/user-guide/rules/alt-require): The alt attribute of an element must be present and alt attribute of area[href] and input[type=image] must have a value.
 
 ### Tags
 
-- [`tags-check`](/docs/user-guide/rules/tags-check.md): Allowing specify rules for any tag and validate that
+- [`tags-check`](/docs/user-guide/rules/tags-check): Allowing specify rules for any tag and validate that
 - [`tag-pair`](/docs/user-guide/rules/tag-pair): Tag must be paired.
 - [`tag-self-close`](/docs/user-guide/rules/tag-self-close): Empty tags must be self closed.
 - [`tagname-lowercase`](/docs/user-guide/rules/tagname-lowercase): All html element names must be in lowercase.
-- [`empty-tag-not-self-closed`](/docs/user-guide/rules/empty-tag-not-self-closed): The empty tag should not be closed by self.
 - [`src-not-empty`](/docs/user-guide/rules/src-not-empty): The src attribute of an img(script,link) must have a value.
 - [`href-abs-or-rel`](/docs/user-guide/rules/href-abs-or-rel): An href attribute must be either absolute or relative.
 
diff --git a/docs/user-guide/rules/alt-require.md b/docs/user-guide/rules/alt-require.md
index eb45ab853..40d978699 100644
--- a/docs/user-guide/rules/alt-require.md
+++ b/docs/user-guide/rules/alt-require.md
@@ -7,29 +7,53 @@ keywords:
   - accessiblity
 ---
 
-Alt of img must be present and alt of area[href] and input[type=image] must be set value.
+The `alt` attribute of an `<img>` element must be present and `alt` attribute of `area[href]` and `input[type=image]` must have a value.
+
+## Possible Configuration Values
+
+```json
+{
+  "alt-require": "off",
+  "alt-require": "warn",
+  "alt-require": "error",
+  "alt-require": ["off"],
+  "alt-require": ["warn"],
+  "alt-require": ["error"]
+}
+```
 
-Level: warning
+## Default
 
-## Config value
+```json
+{ "alt-require": "off" }
+```
 
-1. true: enable rule
-2. false: disable rule
+---
 
-The following pattern are **not** considered violations:
+## Examples
+
+Examples of **correct** code for this rule:
 
-<!-- prettier-ignore -->
 ```html
 <img src="test.png" alt="test" />
 <input type="image" alt="test" />
 <area shape="circle" coords="180,139,14" href="test.html" alt="test" />
 ```
 
-The following pattern is considered violation:
+Examples of **incorrect** code for this rule:
 
-<!-- prettier-ignore -->
 ```html
 <img src="test.png" />
 <input type="image" />
 <area shape="circle" coords="180,139,14" href="test.html" />
 ```
+
+---
+
+## When Not To Use It
+
+If your project will not use `alt` on images.
+
+## Version
+
+This rule was introduced in HTMLHint `v0.9.1`.
diff --git a/docs/user-guide/rules/attr-lowercase.md b/docs/user-guide/rules/attr-lowercase.md
index 343b90f4a..e8b80075e 100644
--- a/docs/user-guide/rules/attr-lowercase.md
+++ b/docs/user-guide/rules/attr-lowercase.md
@@ -3,26 +3,55 @@ id: attr-lowercase
 title: attr-lowercase
 ---
 
-Attribute name must be lowercase.
+All attribute names must be in lowercase.
+
+## Possible Configuration Values
+
+```json
+{
+  "attr-lowercase": "off",
+  "attr-lowercase": "warn",
+  "attr-lowercase": "error",
+  "attr-lowercase": ["off"],
+  "attr-lowercase": ["warn", { "exceptions": ["viewBox", "test"] }],
+  "attr-lowercase": ["error", { "exceptions": ["viewBox", "test"] }]
+}
+```
+
+## Default
+
+```json
+{ "attr-lowercase": "error" }
+```
 
-Level: `error`
+## Options
 
-## Config value
+This rule has an object option:
+
+- `"exceptions": ["viewBox", "test"]` ignore attributes `viewBox` and `test`.
+
+---
 
-1. true: enable rule
-2. false: disable rule
-3. ['viewBox', 'test']: Ignore some attr name
+## Examples
 
-The following pattern are **not** considered violations:
+Examples of **correct** code for this rule:
 
-<!-- prettier-ignore -->
 ```html
 <img src="test.png" alt="test" />
 ```
 
-The following pattern is considered violation:
+Examples of **incorrect** code for this rule:
 
-<!-- prettier-ignore -->
 ```html
 <img src="test.png" alt="test" />
 ```
+
+---
+
+## When Not To Use It
+
+If your project will use `camelCase` attributes.
+
+## Version
+
+This rule was introduced in HTMLHint `v0.9.1`.
diff --git a/docs/user-guide/rules/attr-no-duplication.md b/docs/user-guide/rules/attr-no-duplication.md
index 239777839..f42f36009 100644
--- a/docs/user-guide/rules/attr-no-duplication.md
+++ b/docs/user-guide/rules/attr-no-duplication.md
@@ -3,25 +3,49 @@ id: attr-no-duplication
 title: attr-no-duplication
 ---
 
-The same attribute can't be specified twice.
+Elements cannot have duplicate attributes.
+
+## Possible Configuration Values
+
+```json
+{
+  "attr-no-duplication": "off",
+  "attr-no-duplication": "warn",
+  "attr-no-duplication": "error",
+  "attr-no-duplication": ["off"],
+  "attr-no-duplication": ["warn"],
+  "attr-no-duplication": ["error"]
+}
+```
 
-Level: `error`
+## Default
 
-## Config value
+```json
+{ "attr-no-duplication": "error" }
+```
 
-1. true: enable rule
-2. false: disable rule
+---
 
-The following pattern are **not** considered violations:
+## Examples
+
+Examples of **correct** code for this rule:
 
-<!-- prettier-ignore -->
 ```html
 <img src="a.png" />
 ```
 
-The following pattern is considered violation:
+Examples of **incorrect** code for this rule:
 
-<!-- prettier-ignore -->
 ```html
 <img src="a.png" src="b.png" />
 ```
+
+---
+
+## When Not To Use It
+
+You always want to use this rule.
+
+## Version
+
+This rule was introduced in HTMLHint `v0.9.6`.
diff --git a/docs/user-guide/rules/attr-no-unnecessary-whitespace.md b/docs/user-guide/rules/attr-no-unnecessary-whitespace.md
index 9af443849..bec4785ae 100644
--- a/docs/user-guide/rules/attr-no-unnecessary-whitespace.md
+++ b/docs/user-guide/rules/attr-no-unnecessary-whitespace.md
@@ -5,21 +5,42 @@ title: attr-no-unnecessary-whitespace
 
 No spaces between attribute names and values.
 
-Level: `error`
+## Possible Configuration Values
+
+```json
+{
+  "attr-no-unnecessary-whitespace": "off",
+  "attr-no-unnecessary-whitespace": "warn",
+  "attr-no-unnecessary-whitespace": "error",
+  "attr-no-unnecessary-whitespace": ["off"],
+  "attr-no-unnecessary-whitespace": ["warn", { "exceptions": ["test"] }],
+  "attr-no-unnecessary-whitespace": ["error", { "exceptions": ["test"] }]
+}
+```
+
+## Default
 
-## Config value
+```json
+{ "attr-no-unnecessary-whitespace": "error" }
+```
 
-1. true: enable rule
-2. false: disable rule
+## Options
 
-The following pattern are **not** considered violations:
+This rule has an object option:
+
+- `"exceptions": ['test']` ignore some attribute names.
+
+---
+
+## Examples
+
+Examples of **correct** code for this rule:
 
-<!-- prettier-ignore -->
 ```html
 <div title="a"></div>
 ```
 
-The following pattern is considered violation:
+Examples of **incorrect** code for this rule:
 
 <!-- prettier-ignore -->
 ```html
@@ -27,3 +48,13 @@ The following pattern is considered violation:
 <div title= "a"></div>
 <div title ="a"></div>
 ```
+
+---
+
+## When Not To Use It
+
+If your project will use spaces between attribute names and values.
+
+## Version
+
+This rule was introduced in HTMLHint `v0.13.0`.
diff --git a/docs/user-guide/rules/attr-sorted.md b/docs/user-guide/rules/attr-sorted.md
new file mode 100644
index 000000000..2f7d8c163
--- /dev/null
+++ b/docs/user-guide/rules/attr-sorted.md
@@ -0,0 +1,51 @@
+---
+id: attr-sorted
+title: attr-sorted
+---
+
+Attribute tags must be in proper order.
+
+## Possible Configuration Values
+
+```json
+{
+  "attr-sorted": "off",
+  "attr-sorted": "warn",
+  "attr-sorted": "error",
+  "attr-sorted": ["off"],
+  "attr-sorted": ["warn"],
+  "attr-sorted": ["error"]
+}
+```
+
+## Default
+
+```json
+{ "attr-sorted": "off" }
+```
+
+---
+
+## Examples
+
+Examples of **correct** code for this rule:
+
+```html
+<img alt="test" src="test.png" />
+```
+
+Examples of **incorrect** code for this rule:
+
+```html
+<img src="test.png" alt="test" />
+```
+
+---
+
+## When Not To Use It
+
+If your project will use attributes in an unsorted order.
+
+## Version
+
+This rule was introduced in HTMLHint `v0.11.0`.
diff --git a/docs/user-guide/rules/attr-unsafe-chars.md b/docs/user-guide/rules/attr-unsafe-chars.md
index 8def0dc0c..e7c916184 100644
--- a/docs/user-guide/rules/attr-unsafe-chars.md
+++ b/docs/user-guide/rules/attr-unsafe-chars.md
@@ -3,37 +3,61 @@ id: attr-unsafe-chars
 title: attr-unsafe-chars
 ---
 
-Attribute value cannot use unsafe chars.
+Attribute values cannot contain unsafe chars.
 
-regexp: `/[\u0000-\u0009\u000b\u000c\u000e-\u001f\u007f-\u009f\u00ad\u0600-\u0604\u070f\u17b4\u17b5\u200c-\u200f\u2028-\u202f\u2060-\u206f\ufeff\ufff0-\uffff]/`
+Checks against regexp pattern: `/[\u0000-\u0009\u000b\u000c\u000e-\u001f\u007f-\u009f\u00ad\u0600-\u0604\u070f\u17b4\u17b5\u200c-\u200f\u2028-\u202f\u2060-\u206f\ufeff\ufff0-\uffff]/`
 
-Level: `warning`
+## Possible Configuration Values
 
-## Config value
+```json
+{
+  "attr-unsafe-chars": "off",
+  "attr-unsafe-chars": "warn",
+  "attr-unsafe-chars": "error",
+  "attr-unsafe-chars": ["off"],
+  "attr-unsafe-chars": ["warn"],
+  "attr-unsafe-chars": ["error"]
+}
+```
+
+## Default
+
+```json
+{ "attr-unsafe-chars": "off" }
+```
+
+---
 
-1. true: enable rule
-2. false: disable rule
+## Examples
 
-The following pattern are **not** considered violations:
+Examples of **correct** code for this rule:
 
-<!-- prettier-ignore -->
 ```html
 <li>
   <a href="https://vimeo.com/album/1951235/video/56931059">Sud Web 2012</a>
 </li>
 ```
 
-The following pattern is considered violation:
+Examples of **incorrect** code for this rule:
 
-<!-- prettier-ignore -->
 ```html
 <li>
-  <a href="https://vimeo.com/album/1951235/video/56931059‎\u0009‎"
-    >Sud Web 2012</a
-  >
+  <a href="https://vimeo.com/album/1951235/video/56931059‎\u0009‎">
+    Sud Web 2012
+  </a>
 </li>
 ```
 
 :::tip
 The unsafe chars is in the tail of the href attribute.
 :::
+
+---
+
+## When Not To Use It
+
+If your project will use unsafe chars.
+
+## Version
+
+This rule was introduced in HTMLHint `v0.9.6`.
diff --git a/docs/user-guide/rules/attr-value-double-quotes.md b/docs/user-guide/rules/attr-value-double-quotes.md
index 4a99cb47e..5486d36b2 100644
--- a/docs/user-guide/rules/attr-value-double-quotes.md
+++ b/docs/user-guide/rules/attr-value-double-quotes.md
@@ -3,25 +3,50 @@ id: attr-value-double-quotes
 title: attr-value-double-quotes
 ---
 
-Attribute value must closed by double quotes.
+Attribute values must be in double quotes.
+
+## Possible Configuration Values
+
+```json
+{
+  "attr-value-double-quotes": "off",
+  "attr-value-double-quotes": "warn",
+  "attr-value-double-quotes": "error",
+  "attr-value-double-quotes": ["off"],
+  "attr-value-double-quotes": ["warn"],
+  "attr-value-double-quotes": ["error"]
+}
+```
+
+## Default
 
-Level: `error`
+```json
+{ "attr-value-double-quotes": "error" }
+```
 
-## Config value
+---
 
-1. true: enable rule
-2. false: disable rule
+## Examples
 
-The following pattern are **not** considered violations:
+Examples of **correct** code for this rule:
 
-<!-- prettier-ignore -->
 ```html
 <a href="" title="abc"></a>
 ```
 
-The following pattern is considered violation:
+Examples of **incorrect** code for this rule:
 
 <!-- prettier-ignore -->
 ```html
-<a href="" title="abc"></a>
+<a href='' title='abc'></a>
 ```
+
+---
+
+## When Not To Use It
+
+If your project will use single quotes for attribute values.
+
+## Version
+
+This rule was introduced in HTMLHint `v0.9.1`.
diff --git a/docs/user-guide/rules/attr-value-not-empty.md b/docs/user-guide/rules/attr-value-not-empty.md
index 203d46126..d0f7dfe47 100644
--- a/docs/user-guide/rules/attr-value-not-empty.md
+++ b/docs/user-guide/rules/attr-value-not-empty.md
@@ -3,25 +3,49 @@ id: attr-value-not-empty
 title: attr-value-not-empty
 ---
 
-Attribute must set value.
+All attributes must have values.
+
+## Possible Configuration Values
+
+```json
+{
+  "attr-value-not-empty": "off",
+  "attr-value-not-empty": "warn",
+  "attr-value-not-empty": "error",
+  "attr-value-not-empty": ["off"],
+  "attr-value-not-empty": ["warn"],
+  "attr-value-not-empty": ["error"]
+}
+```
 
-Level: `warning`
+## Default
 
-## Config value
+```json
+{ "attr-lowercase": "off" }
+```
 
-1. true: enable rule
-2. false: disable rule
+---
 
-The following pattern are **not** considered violations:
+## Examples
+
+Examples of **correct** code for this rule:
 
-<!-- prettier-ignore -->
 ```html
 <input type="button" disabled="disabled" />
 ```
 
-The following pattern is considered violation:
+Examples of **incorrect** code for this rule:
 
-<!-- prettier-ignore -->
 ```html
 <input type="button" disabled />
 ```
+
+---
+
+## When Not To Use It
+
+If your project will use attributes that doesn't need a value.
+
+## Version
+
+This rule was introduced in HTMLHint `v0.9.1`.
diff --git a/docs/user-guide/rules/attr-value-single-quotes.md b/docs/user-guide/rules/attr-value-single-quotes.md
new file mode 100644
index 000000000..26aae62e8
--- /dev/null
+++ b/docs/user-guide/rules/attr-value-single-quotes.md
@@ -0,0 +1,52 @@
+---
+id: attr-value-single-quotes
+title: attr-value-single-quotes
+---
+
+Attribute values must be in single quotes.
+
+## Possible Configuration Values
+
+```json
+{
+  "attr-value-single-quotes": "off",
+  "attr-value-single-quotes": "warn",
+  "attr-value-single-quotes": "error",
+  "attr-value-single-quotes": ["off"],
+  "attr-value-single-quotes": ["warn"],
+  "attr-value-single-quotes": ["error"]
+}
+```
+
+## Default
+
+```json
+{ "attr-value-single-quotes": "off" }
+```
+
+---
+
+## Examples
+
+Examples of **correct** code for this rule:
+
+```html
+<a href="" title="abc"></a>
+```
+
+Examples of **incorrect** code for this rule:
+
+<!-- prettier-ignore -->
+```html
+<a href="" title="abc"></a>
+```
+
+---
+
+## When Not To Use It
+
+If your project will use double quotes for attribute values.
+
+## Version
+
+This rule was introduced in HTMLHint `v0.9.1`.
diff --git a/docs/user-guide/rules/attr-whitespace.md b/docs/user-guide/rules/attr-whitespace.md
new file mode 100644
index 000000000..bbfa3ad98
--- /dev/null
+++ b/docs/user-guide/rules/attr-whitespace.md
@@ -0,0 +1,61 @@
+---
+id: attr-whitespace
+title: attr-whitespace
+---
+
+All attributes should be separated by only one space and not have leading/trailing whitespace.
+
+## Possible Configuration Values
+
+```json
+{
+  "attr-whitespace": "off",
+  "attr-whitespace": "warn",
+  "attr-whitespace": "error",
+  "attr-whitespace": ["off"],
+  "attr-whitespace": ["warn", { "exceptions": ["test"] }],
+  "attr-whitespace": ["error", { "exceptions": ["test"] }]
+}
+```
+
+## Default
+
+```json
+{ "attr-whitespace": ["off", { "exceptions": [] }] }
+```
+
+## Options
+
+This rule has an object option:
+
+- `"exceptions": ["test"]` ignore attribute `test`.
+
+---
+
+## Examples
+
+Examples of **correct** code for this rule:
+
+```html
+<p test="test test1"></p>
+<p test="testtest1"></p>
+<p test="test test1"></p>
+```
+
+Examples of **incorrect** code for this rule:
+
+```html
+<p test="test  test1"></p>
+<p test=" testtest1 "></p>
+<p test=" test  test1 "></p>
+```
+
+---
+
+## When Not To Use It
+
+If your project will use attributes with multiple whitespaces.
+
+## Version
+
+This rule was introduced in HTMLHint `v0.9.1`.
diff --git a/docs/user-guide/rules/doctype-first.md b/docs/user-guide/rules/doctype-first.md
index af4dc5fe1..47f497f96 100644
--- a/docs/user-guide/rules/doctype-first.md
+++ b/docs/user-guide/rules/doctype-first.md
@@ -3,33 +3,56 @@ id: doctype-first
 title: doctype-first
 ---
 
-Doctype must be first.
+Doctype must be declared first.
+
+## Possible Configuration Values
+
+```json
+{
+  "doctype-first": "off",
+  "doctype-first": "warn",
+  "doctype-first": "error",
+  "doctype-first": ["off"],
+  "doctype-first": ["warn"],
+  "doctype-first": ["error"]
+}
+```
+
+## Default
 
-Level: `error`
+```json
+{ "doctype-first": "error" }
+```
 
-## Config value
+---
 
-1. true: enable rule
-2. false: disable rule
+## Examples
 
-The following pattern are **not** considered violations:
+Examples of **correct** code for this rule:
 
-<!-- prettier-ignore -->
 ```html
 <!DOCTYPE html>
 <html></html>
 ```
 
-<!-- prettier-ignore -->
+Examples of **incorrect** code for this rule:
+
 ```html
 <!DOCTYPE html>
 <html></html>
 ```
 
-The following pattern is considered violation:
-
-<!-- prettier-ignore -->
 ```html
 <!--comment--><!DOCTYPE html>
 <html></html>
 ```
+
+---
+
+## When Not To Use It
+
+If your project will use a framework.
+
+## Version
+
+This rule was introduced in HTMLHint `v0.9.1`.
diff --git a/docs/user-guide/rules/doctype-html5.md b/docs/user-guide/rules/doctype-html5.md
index d7e1a3019..035628182 100644
--- a/docs/user-guide/rules/doctype-html5.md
+++ b/docs/user-guide/rules/doctype-html5.md
@@ -1,22 +1,51 @@
 ---
 id: doctype-html5
-title: Doctype HTML5
+title: doctype-html5
 ---
 
-Rule ID: `doctype-html5`
-
 Doctype must be html5.
 
-Level: `warning`
+```json
+{
+  "doctype-html5": "off",
+  "doctype-html5": "warn",
+  "doctype-html5": "error",
+  "doctype-html5": ["off"],
+  "doctype-html5": ["warn"],
+  "doctype-html5": ["error"]
+}
+```
+
+## Default
+
+```json
+{ "doctype-html5": "off" }
+```
+
+---
+
+## Examples
 
-## Config value
+Examples of **correct** code for this rule:
 
-1. true: enable rule
-2. false: disable rule
+```html
+<!DOCTYPE html>
+<html></html>
+```
 
-The following pattern are **not** considered violations:
+Examples of **incorrect** code for this rule:
 
-<!-- prettier-ignore -->
 ```html
-<!DOCTYPE HTML><html>
+<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "https://www.w3.org/TR/html4/strict.dtd">
+<html></html>
 ```
+
+---
+
+## When Not To Use It
+
+If your project will use `html4` or `xhtml`.
+
+## Version
+
+This rule was introduced in HTMLHint `v0.9.1`.
diff --git a/docs/user-guide/rules/empty-tag-not-self-closed.md b/docs/user-guide/rules/empty-tag-not-self-closed.md
deleted file mode 100644
index 4426b8ab8..000000000
--- a/docs/user-guide/rules/empty-tag-not-self-closed.md
+++ /dev/null
@@ -1,27 +0,0 @@
----
-id: empty-tag-not-self-closed
-title: empty-tag-not-self-closed
----
-
-The empty tag should not be closed by self.
-
-Level: `warning`
-
-## Config value
-
-1. true: enable rule
-2. false: disable rule
-
-The following pattern are **not** considered violations:
-
-<!-- prettier-ignore -->
-```html
-<br>
-```
-
-The following pattern is considered violation:
-
-<!-- prettier-ignore -->
-```html
-<br />
-```
diff --git a/docs/user-guide/rules/head-script-disabled.md b/docs/user-guide/rules/head-script-disabled.md
index 9324366b2..921abc5fa 100644
--- a/docs/user-guide/rules/head-script-disabled.md
+++ b/docs/user-guide/rules/head-script-disabled.md
@@ -3,29 +3,53 @@ id: head-script-disabled
 title: head-script-disabled
 ---
 
-The script tag can not be used in head.
+The `<script>` tag cannot be used in a `<head>` tag.
+
+## Possible Configuration Values
+
+```json
+{
+  "head-script-disabled": "off",
+  "head-script-disabled": "warn",
+  "head-script-disabled": "error",
+  "head-script-disabled": ["off"],
+  "head-script-disabled": ["warn"],
+  "head-script-disabled": ["error"]
+}
+```
 
-Level: `warning`
+## Default
 
-## Config value
+```json
+{ "head-script-disabled": "off" }
+```
 
-1. true: enable rule
-2. false: disable rule
+---
 
-The following pattern are **not** considered violations:
+## Examples
+
+Examples of **correct** code for this rule:
 
-<!-- prettier-ignore -->
 ```html
 <body>
   <script src="test.js"></script>
 </body>
 ```
 
-The following pattern is considered violation:
+Examples of **incorrect** code for this rule:
 
-<!-- prettier-ignore -->
 ```html
 <head>
   <script src="test.js"></script>
 </head>
 ```
+
+---
+
+## When Not To Use It
+
+If your project will use `script` tags in `head`.
+
+## Version
+
+This rule was introduced in HTMLHint `v0.9.1`.
diff --git a/docs/user-guide/rules/href-abs-or-rel.md b/docs/user-guide/rules/href-abs-or-rel.md
index dfb7c0f4a..a26cf48a6 100644
--- a/docs/user-guide/rules/href-abs-or-rel.md
+++ b/docs/user-guide/rules/href-abs-or-rel.md
@@ -3,21 +3,61 @@ id: href-abs-or-rel
 title: href-abs-or-rel
 ---
 
-Href must be absolute or relative.
+An href attribute must be either absolute or relative.
 
-Level: `warning`
+## Possible Configuration Values
 
-## Config value
+```json
+{
+  "href-abs-or-rel": "off",
+  "href-abs-or-rel": "warn",
+  "href-abs-or-rel": "error",
+  "href-abs-or-rel": ["off"],
+  "href-abs-or-rel": ["warn", { "mode": "absolute" }],
+  "href-abs-or-rel": ["warn", { "mode": "relative" }],
+  "href-abs-or-rel": ["error", { "mode": "absolute" }],
+  "href-abs-or-rel": ["error", { "mode": "relative" }]
+}
+```
 
-1. abs: absolute mode
-2. rel: relative mode
-3. false: disable rule
+## Default
 
-The following pattern are **not** considered violations:
+```json
+{ "attr-lowercase": ["off", { "mode": "absolute" }] }
+```
+
+## Options
+
+This rule has an object option:
+
+- `"mode": "absolute"` (default) only allow absolut urls.
+- `"mode": "relative"` only allow relative urls.
+
+---
+
+## Examples
+
+Examples of **correct** code for mode `absolut`:
 
-<!-- prettier-ignore -->
 ```html
-abs: <a href="http://www.alibaba.com/">test1</a> <a href="https://www.alipay.com/">test2</a>
-rel: <a href="test.html">test1</a> <a href="../test.html">test2</a>
+<a href="http://www.alibaba.com/">test1</a>
+<a href="https://www.alipay.com/">test2</a>
+```
+
+Examples of **correct** code for mode `relative`:
 
+<!-- prettier-ignore -->
+```html
+<a href="test.html">test1</a>
+<a href="../test.html">test2</a>
 ```
+
+---
+
+## When Not To Use It
+
+If your project will use both `relative` and `absolute`.
+
+## Version
+
+This rule was introduced in HTMLHint `v0.9.6`.
diff --git a/docs/user-guide/rules/id-class-ad-disabled.md b/docs/user-guide/rules/id-class-ad-disabled.md
index 707dee39d..16c94f61c 100644
--- a/docs/user-guide/rules/id-class-ad-disabled.md
+++ b/docs/user-guide/rules/id-class-ad-disabled.md
@@ -3,26 +3,50 @@ id: id-class-ad-disabled
 title: id-class-ad-disabled
 ---
 
-Id and class can not use ad keyword, it will blocked by adblock software.
+The `id` and `class` attributes cannot use the "ad" keyword, it will be blocked by adblock software.
+
+## Possible Configuration Values
+
+```json
+{
+  "id-class-ad-disabled": "off",
+  "id-class-ad-disabled": "warn",
+  "id-class-ad-disabled": "error",
+  "id-class-ad-disabled": ["off"],
+  "id-class-ad-disabled": ["warn"],
+  "id-class-ad-disabled": ["error"]
+}
+```
 
-Level: `warning`
+## Default
 
-## Config value
+```json
+{ "id-class-ad-disabled": "off" }
+```
 
-1. true: enable rule
-2. false: disable rule
+---
 
-The following pattern are **not** considered violations:
+## Examples
+
+Examples of **correct** code for this rule:
 
-<!-- prettier-ignore -->
 ```html
 <div id="adcontainer"></div>
 ```
 
-The following pattern is considered violation:
+Examples of **incorrect** code for this rule:
 
-<!-- prettier-ignore -->
 ```html
 <div id="ad-container"></div>
 <div id="ad_container"></div>
 ```
+
+---
+
+## When Not To Use It
+
+If your project will use ads.
+
+## Version
+
+This rule was introduced in HTMLHint `v0.9.6`.
diff --git a/docs/user-guide/rules/id-class-value.md b/docs/user-guide/rules/id-class-value.md
index 8733f5a34..fafa5091c 100644
--- a/docs/user-guide/rules/id-class-value.md
+++ b/docs/user-guide/rules/id-class-value.md
@@ -3,23 +3,70 @@ id: id-class-value
 title: id-class-value
 ---
 
-Id and class value must meet some rules: underline, dash, hump.
+The id and class attribute values must meet the specified rules.
 
-Level: `warning`
+## Possible Configuration Values
 
-## Config value
+```json
+{
+  "id-class-value": "off",
+  "id-class-value": "warn",
+  "id-class-value": "error",
+  "id-class-value": ["off"],
+  "id-class-value": ["warn", { "mode": "underline" }],
+  "id-class-value": ["warn", { "mode": "dash" }],
+  "id-class-value": ["warn", { "mode": "hump" }],
+  "id-class-value": ["warn", { "regId": RegExp, "message": "Message" }],
+  "id-class-value": ["error", { "mode": "underline" }],
+  "id-class-value": ["error", { "mode": "dash" }],
+  "id-class-value": ["error", { "mode": "hump" }],
+  "id-class-value": ["error", { "regId": RegExp, "message": "Message" }]
+}
+```
+
+## Default
+
+```json
+{ "id-class-value": "off" }
+```
+
+## Options
+
+This rule has an object option:
+
+- `"mode": "underline"` The id and class attribute values must be in lowercase and split by an underscore.
+- `"mode": "dash"` The id and class attribute values must be in lowercase and split by a dash.
+- `"mode": "hump"` The id and class attribute values must meet the camelCase style.
+- `"regId": RegExp` Custom message.
+
+---
+
+## Examples
+
+Examples of **correct** code for mode `underline`:
 
-1. underline: underline mode ( aaa_bb )
-2. dash: enable rule ( aaa-bbb )
-3. hump: enable rule ( aaaBbb )
-4. false: disable rule
+```html
+<div id="aaa_bbb"></div>
+```
 
-The following pattern are **not** considered violations:
+Examples of **correct** code for mode `dash`:
 
-<!-- prettier-ignore -->
 ```html
-underline: <div id="aaa_bbb">
-dash: <div id="aaa-bbb">
-hump: <div id="aaaBbb">
+<div id="aaa-bbb"></div>
+```
 
+Examples of **correct** code for mode `hump`:
+
+```html
+<div id="aaaBbb"></div>
 ```
+
+---
+
+## When Not To Use It
+
+If your project will use mixed cased `id` values.
+
+## Version
+
+This rule was introduced in HTMLHint `v0.9.1`.
diff --git a/docs/user-guide/rules/id-unique.md b/docs/user-guide/rules/id-unique.md
index 9f87d3e14..3c23975c2 100644
--- a/docs/user-guide/rules/id-unique.md
+++ b/docs/user-guide/rules/id-unique.md
@@ -3,25 +3,51 @@ id: id-unique
 title: id-unique
 ---
 
-ID attributes must be unique in the document.
+The value of id attributes must be unique.
+
+## Possible Configuration Values
+
+```json
+{
+  "id-unique": "off",
+  "id-unique": "warn",
+  "id-unique": "error",
+  "id-unique": ["off"],
+  "id-unique": ["warn"],
+  "id-unique": ["error"]
+}
+```
 
-Level: `error`
+## Default
 
-## Config value
+```json
+{ "id-unique": "error" }
+```
 
-1. true: enable rule
-2. false: disable rule
+---
 
-The following pattern are **not** considered violations:
+## Examples
+
+Examples of **correct** code for this rule:
 
-<!-- prettier-ignore -->
 ```html
-<div id="id1"></div><div id="id2"></div>
+<div id="id1"></div>
+<div id="id2"></div>
 ```
 
-The following pattern is considered violation:
+Examples of **incorrect** code for this rule:
 
-<!-- prettier-ignore -->
 ```html
-<div id="id1"></div><div id="id1"></div>
+<div id="id1"></div>
+<div id="id1"></div>
 ```
+
+---
+
+## When Not To Use It
+
+If your project will use the same `id` multiple times.
+
+## Version
+
+This rule was introduced in HTMLHint `v0.9.2`.
diff --git a/docs/user-guide/rules/inline-script-disabled.md b/docs/user-guide/rules/inline-script-disabled.md
index 7f34b6805..04cea8186 100644
--- a/docs/user-guide/rules/inline-script-disabled.md
+++ b/docs/user-guide/rules/inline-script-disabled.md
@@ -3,20 +3,45 @@ id: inline-script-disabled
 title: inline-script-disabled
 ---
 
-Inline script cannot be use.
+Inline script cannot be used.
 
-Level: `warning`
+## Possible Configuration Values
 
-## Config value
+```json
+{
+  "inline-script-disabled": "off",
+  "inline-script-disabled": "warn",
+  "inline-script-disabled": "error",
+  "inline-script-disabled": ["off"],
+  "inline-script-disabled": ["warn"],
+  "inline-script-disabled": ["error"]
+}
+```
+
+## Default
+
+```json
+{ "inline-script-disabled": "off" }
+```
+
+---
 
-1. true: enable rule
-2. false: disable rule
+## Examples
 
-The following pattern are considered violations:
+Examples of **incorrect** code for this rule:
 
-<!-- prettier-ignore -->
 ```html
-<img src="test.gif" onclick="alert(1);">
-<img src="javascript:alert(1)">
+<img src="test.gif" onclick="alert(1);" />
+<img src="javascript:alert(1)" />
 <a href="javascript:alert(1)">test1</a>
 ```
+
+---
+
+## When Not To Use It
+
+If your project will use inline scripts.
+
+## Version
+
+This rule was introduced in HTMLHint `v0.9.10`.
diff --git a/docs/user-guide/rules/inline-style-disabled.md b/docs/user-guide/rules/inline-style-disabled.md
index 0911221c5..34990d589 100644
--- a/docs/user-guide/rules/inline-style-disabled.md
+++ b/docs/user-guide/rules/inline-style-disabled.md
@@ -3,18 +3,43 @@ id: inline-style-disabled
 title: inline-style-disabled
 ---
 
-Inline style cannot be use.
+Inline style cannot be used.
 
-Level: `warning`
+## Possible Configuration Values
 
-## Config value
+```json
+{
+  "inline-style-disabled": "off",
+  "inline-style-disabled": "warn",
+  "inline-style-disabled": "error",
+  "inline-style-disabled": ["off"],
+  "inline-style-disabled": ["warn"],
+  "inline-style-disabled": ["error"]
+}
+```
+
+## Default
+
+```json
+{ "inline-style-disabled": "error" }
+```
+
+---
 
-1. true: enable rule
-2. false: disable rule
+## Examples
 
-The following pattern are considered violations:
+Examples of **incorrect** code for this rule:
 
-<!-- prettier-ignore -->
 ```html
 <div style="color:red"></div>
 ```
+
+---
+
+## When Not To Use It
+
+If your project will use inline styles.
+
+## Version
+
+This rule was introduced in HTMLHint `v0.9.10`.
diff --git a/docs/user-guide/rules/input-requires-label.md b/docs/user-guide/rules/input-requires-label.md
new file mode 100644
index 000000000..457d6a0d8
--- /dev/null
+++ b/docs/user-guide/rules/input-requires-label.md
@@ -0,0 +1,53 @@
+---
+id: input-requires-label
+title: input-requires-label
+---
+
+All `input` tags must have a corresponding `label` tag.
+
+## Possible Configuration Values
+
+```json
+{
+  "input-requires-label": "off",
+  "input-requires-label": "warn",
+  "input-requires-label": "error",
+  "input-requires-label": ["off"],
+  "input-requires-label": ["warn"],
+  "input-requires-label": ["error"]
+}
+```
+
+## Default
+
+```json
+{ "input-requires-label": "off" }
+```
+
+---
+
+## Examples
+
+Examples of **correct** code for this rule:
+
+<!-- prettier-ignore -->
+```html
+<label for="username">Username</label>
+<input type="text" id="username" />
+```
+
+Examples of **incorrect** code for this rule:
+
+```html
+<input type="text" id="username" />
+```
+
+---
+
+## When Not To Use It
+
+If your project will use not use labels.
+
+## Version
+
+This rule was introduced in HTMLHint `v0.13.0`.
diff --git a/docs/user-guide/rules/script-disabled.md b/docs/user-guide/rules/script-disabled.md
new file mode 100644
index 000000000..46c4111ea
--- /dev/null
+++ b/docs/user-guide/rules/script-disabled.md
@@ -0,0 +1,47 @@
+---
+id: script-disabled
+title: script-disabled
+---
+
+The `<script>` tag cannot be used.
+
+## Possible Configuration Values
+
+```json
+{
+  "script-disabled": "off",
+  "script-disabled": "warn",
+  "script-disabled": "error",
+  "script-disabled": ["off"],
+  "script-disabled": ["warn"],
+  "script-disabled": ["error"]
+}
+```
+
+## Default
+
+```json
+{ "script-disabled": "off" }
+```
+
+---
+
+## Examples
+
+Examples of **incorrect** code for this rule:
+
+```html
+<body>
+  <script src="index.js"></script>
+</body>
+```
+
+---
+
+## When Not To Use It
+
+If your project will use `script` tags.
+
+## Version
+
+This rule was introduced in HTMLHint `v0.9.1`.
diff --git a/docs/user-guide/rules/space-tab-mixed-disabled.md b/docs/user-guide/rules/space-tab-mixed-disabled.md
index 1cee5cde0..c8afff77c 100644
--- a/docs/user-guide/rules/space-tab-mixed-disabled.md
+++ b/docs/user-guide/rules/space-tab-mixed-disabled.md
@@ -3,18 +3,42 @@ id: space-tab-mixed-disabled
 title: space-tab-mixed-disabled
 ---
 
-Spaces and tabs can not mixed in front of line.
+Do not mix tabs and spaces for indentation.
 
-Level: `warning`
+## Possible Configuration Values
 
-## Config value
+```json
+{
+  "space-tab-mixed-disabled": "off",
+  "space-tab-mixed-disabled": "warn",
+  "space-tab-mixed-disabled": "error",
+  "space-tab-mixed-disabled": ["off"],
+  "space-tab-mixed-disabled": ["warn", { "mode": "tab" }],
+  "space-tab-mixed-disabled": ["warn", { "mode": "space", "size": 2 }],
+  "space-tab-mixed-disabled": ["error", { "mode": "tab" }],
+  "space-tab-mixed-disabled": ["error", { "mode": "space", "size": 2 }]
+}
+```
+
+## Default
+
+```json
+{ "space-tab-mixed-disabled": ["off", { "mode": "nomix", "space": 4 }] }
+```
 
-1. space: space mode (only space for indentation)
-2. space4: space mode and require length
-3. tab: tab mode (only tab for indentation)
-4. false: disable rule
+## Options
+
+This rule has an object option:
+
+- `"mode": "tab"` use tabs as indentation.
+- `"mode": "space"` use spaces as indentation.
+  - `"size": 0-8` count of spaces.
+
+---
 
-The following pattern are **not** considered violations:
+## Examples
+
+Examples of **correct** code for this rule:
 
 <!-- prettier-ignore -->
 ```html
@@ -22,7 +46,7 @@ The following pattern are **not** considered violations:
 ········<img src="space.png" />
 ```
 
-The following pattern is considered violation:
+Examples of **incorrect** code for this rule:
 
 <!-- prettier-ignore -->
 ```html
@@ -33,3 +57,13 @@ The following pattern is considered violation:
 :::note
 In the examples above, spaces and tabs are represented by `·` and `→`, respectively, to make the difference visible.
 :::
+
+---
+
+## When Not To Use It
+
+If your project will use mixed indentation.
+
+## Version
+
+This rule was introduced in HTMLHint `v0.9.6`.
diff --git a/docs/user-guide/rules/spec-char-escape.md b/docs/user-guide/rules/spec-char-escape.md
index b94658651..5db53f869 100644
--- a/docs/user-guide/rules/spec-char-escape.md
+++ b/docs/user-guide/rules/spec-char-escape.md
@@ -5,23 +5,47 @@ title: spec-char-escape
 
 Special characters must be escaped.
 
-Level: `error`
+## Possible Configuration Values
+
+```json
+{
+  "spec-char-escape": "off",
+  "spec-char-escape": "warn",
+  "spec-char-escape": "error",
+  "spec-char-escape": ["off"],
+  "spec-char-escape": ["warn"],
+  "spec-char-escape": ["error"]
+}
+```
+
+## Default
+
+```json
+{ "spec-char-escape": "error" }
+```
 
-## Config value
+---
 
-1. true: enable rule
-2. false: disable rule
+## Examples
 
-The following pattern are **not** considered violations:
+Examples of **correct** code for this rule:
 
-<!-- prettier-ignore -->
 ```html
 <span>aaa&gt;bbb&lt;ccc</span>
 ```
 
-The following pattern is considered violation:
+Examples of **incorrect** code for this rule:
 
-<!-- prettier-ignore -->
 ```html
 <span>aaa>bbb<ccc</span>
 ```
+
+---
+
+## When Not To Use It
+
+Always use this rule.
+
+## Version
+
+This rule was introduced in HTMLHint `v0.9.1`.
diff --git a/docs/user-guide/rules/src-not-empty.md b/docs/user-guide/rules/src-not-empty.md
index 87956d206..0aca04e7f 100644
--- a/docs/user-guide/rules/src-not-empty.md
+++ b/docs/user-guide/rules/src-not-empty.md
@@ -3,18 +3,32 @@ id: src-not-empty
 title: src-not-empty
 ---
 
-Src of img(script, link) must set value.
+The `src` attribute of an `img`, `script` or `link` must have a value.
 
-Emtpy of src will visit current page twice.
+## Possible Configuration Values
 
-Level: `error`
+```json
+{
+  "src-not-empty": "off",
+  "src-not-empty": "warn",
+  "src-not-empty": "error",
+  "src-not-empty": ["off"],
+  "src-not-empty": ["warn"],
+  "src-not-empty": ["error"]
+}
+```
+
+## Default
+
+```json
+{ "src-not-empty": "error" }
+```
 
-## Config value
+---
 
-1. true: enable rule
-2. false: disable rule
+## Examples
 
-The following pattern are **not** considered violations:
+Examples of **correct** code for this rule:
 
 <!-- prettier-ignore -->
 ```html
@@ -27,7 +41,7 @@ The following pattern are **not** considered violations:
 <object data="test.swf">
 ```
 
-The following patterns are considered violations:
+Examples of **incorrect** code for this rule:
 
 <!-- prettier-ignore -->
 ```html
@@ -45,3 +59,13 @@ The following patterns are considered violations:
 <object data="">
 <object data>
 ```
+
+---
+
+## When Not To Use It
+
+If your project will use tags without `src`.
+
+## Version
+
+This rule was introduced in HTMLHint `v0.9.4`.
diff --git a/docs/user-guide/rules/style-disabled.md b/docs/user-guide/rules/style-disabled.md
index 0cc2e70f9..717daab7e 100644
--- a/docs/user-guide/rules/style-disabled.md
+++ b/docs/user-guide/rules/style-disabled.md
@@ -3,19 +3,48 @@ id: style-disabled
 title: style-disabled
 ---
 
-Style tag can not be use.
+`<style>` tags cannot be used.
 
-Level: `warning`
+## Possible Configuration Values
 
-## Config value
+```json
+{
+  "style-disabled": "off",
+  "style-disabled": "warn",
+  "style-disabled": "error",
+  "style-disabled": ["off"],
+  "style-disabled": ["warn"],
+  "style-disabled": ["error"]
+}
+```
+
+## Default
+
+```json
+{ "style-disabled": "off" }
+```
+
+---
 
-1. true: enable rule
-2. false: disable rule
+## Examples
 
-The following pattern are considered violations:
+Examples of **incorrect** code for this rule:
 
-<!-- prettier-ignore -->
 ```html
-<head><style type="text/css"></style></head>
-<body><style type="text/css"></style></body>
+<head>
+  <style type="text/css"></style>
+</head>
+<body>
+  <style type="text/css"></style>
+</body>
 ```
+
+---
+
+## When Not To Use It
+
+If your project will use `style` tags.
+
+## Version
+
+This rule was introduced in HTMLHint `v0.9.1`.
diff --git a/docs/user-guide/rules/tag-pair.md b/docs/user-guide/rules/tag-pair.md
index e67116be6..78e4447a8 100644
--- a/docs/user-guide/rules/tag-pair.md
+++ b/docs/user-guide/rules/tag-pair.md
@@ -5,24 +5,51 @@ title: tag-pair
 
 Tag must be paired.
 
-Level: `error`
+## Possible Configuration Values
+
+```json
+{
+  "tag-pair": "off",
+  "tag-pair": "warn",
+  "tag-pair": "error",
+  "tag-pair": ["off"],
+  "tag-pair": ["warn"],
+  "tag-pair": ["error"]
+}
+```
+
+## Default
+
+```json
+{ "tag-pair": "error" }
+```
 
-## Config value
+---
 
-1. true: enable rule
-2. false: disable rule
+## Examples
 
-The following pattern are **not** considered violations:
+Examples of **correct** code for this rule:
 
-<!-- prettier-ignore -->
 ```html
-<ul><li></li></ul>
+<ul>
+  <li></li>
+</ul>
 ```
 
-The following pattern is considered violation:
+Examples of **incorrect** code for this rule:
 
 <!-- prettier-ignore -->
 ```html
 <ul><li></ul>
 <ul></li></ul>
 ```
+
+---
+
+## When Not To Use It
+
+Always use this rule.
+
+## Version
+
+This rule was introduced in HTMLHint `v0.9.1`.
diff --git a/docs/user-guide/rules/tag-self-close.md b/docs/user-guide/rules/tag-self-close.md
index e69de29bb..5306b3f72 100644
--- a/docs/user-guide/rules/tag-self-close.md
+++ b/docs/user-guide/rules/tag-self-close.md
@@ -0,0 +1,52 @@
+---
+id: tag-self-close
+title: tag-self-close
+---
+
+Empty tags must be self closed.
+
+## Possible Configuration Values
+
+```json
+{
+  "tag-self-close": "off",
+  "tag-self-close": "warn",
+  "tag-self-close": "error",
+  "tag-self-close": ["off"],
+  "tag-self-close": ["warn"],
+  "tag-self-close": ["error"]
+}
+```
+
+## Default
+
+```json
+{ "tag-self-close": "off" }
+```
+
+---
+
+## Examples
+
+Examples of **correct** code for this rule:
+
+```html
+<br />
+```
+
+Examples of **incorrect** code for this rule:
+
+<!-- prettier-ignore -->
+```html
+<br>
+```
+
+---
+
+## When Not To Use It
+
+If your project will use tags without self closing tags.
+
+## Version
+
+This rule was introduced in HTMLHint `v0.9.1`.
diff --git a/docs/user-guide/rules/tagname-lowercase.md b/docs/user-guide/rules/tagname-lowercase.md
index 0fa98cd54..09b7ba2ff 100644
--- a/docs/user-guide/rules/tagname-lowercase.md
+++ b/docs/user-guide/rules/tagname-lowercase.md
@@ -3,26 +3,57 @@ id: tagname-lowercase
 title: tagname-lowercase
 ---
 
-Tagname must be lowercase.
+All html element names must be in lowercase.
+
+## Possible Configuration Values
+
+```json
+{
+  "tagname-lowercase": "off",
+  "tagname-lowercase": "warn",
+  "tagname-lowercase": "error",
+  "tagname-lowercase": ["off"],
+  "tagname-lowercase": ["warn", { "exceptions": ["clipPath", "test"] }],
+  "tagname-lowercase": ["error", { "exceptions": ["clipPath", "test"] }]
+}
+```
+
+## Default
+
+```json
+{ "tagname-lowercase": "error" }
+```
 
-Level: `error`
+## Options
 
-## Config value
+This rule has an object option:
+
+- `"exceptions": ["clipPath", "test"]` ignore tagnames `clipPath` and `test`.
+
+---
 
-1. true: enable rule
-2. false: disable rule
-3. ['clipPath', 'test']: Ignore some tagname name
+## Examples
 
-The following pattern are **not** considered violations:
+Examples of **correct** code for this rule:
 
 <!-- prettier-ignore -->
 ```html
 <span><div>
 ```
 
-The following pattern is considered violation:
+Examples of **incorrect** code for this rule:
 
 <!-- prettier-ignore -->
 ```html
 <SPAN><BR>
 ```
+
+---
+
+## When Not To Use It
+
+If your project will not use lower case tagnames.
+
+## Version
+
+This rule was introduced in HTMLHint `v0.9.1`.
diff --git a/docs/user-guide/rules/tagname-specialchars.md b/docs/user-guide/rules/tagname-specialchars.md
new file mode 100644
index 000000000..ba86b9c3d
--- /dev/null
+++ b/docs/user-guide/rules/tagname-specialchars.md
@@ -0,0 +1,51 @@
+---
+id: tagname-specialchars
+title: tagname-specialchars
+---
+
+All html element names must be in lowercase.
+
+## Possible Configuration Values
+
+```json
+{
+  "tagname-specialchars": "off",
+  "tagname-specialchars": "warn",
+  "tagname-specialchars": "error",
+  "tagname-specialchars": ["off"],
+  "tagname-specialchars": ["warn"],
+  "tagname-specialchars": ["error"]
+}
+```
+
+## Default
+
+```json
+{ "tagname-specialchars": "off" }
+```
+
+---
+
+## Examples
+
+Examples of **correct** code for this rule:
+
+```html
+<a href=""></a><span>test</span>
+```
+
+Examples of **incorrect** code for this rule:
+
+```html
+<@ href="link"></@><$pan>aab</$pan>
+```
+
+---
+
+## When Not To Use It
+
+Always use this rule.
+
+## Version
+
+This rule was introduced in HTMLHint `v0.9.1`.
diff --git a/docs/user-guide/rules/tags-check.md b/docs/user-guide/rules/tags-check.md
index 8ca6ef827..294f80f14 100644
--- a/docs/user-guide/rules/tags-check.md
+++ b/docs/user-guide/rules/tags-check.md
@@ -3,9 +3,85 @@ id: tags-check
 title: tags-check
 ---
 
-Allowing specify rules for any tag and validate that
+Checks html tags.
 
-The following pattern are **not** considered violations:
+## Possible Configuration Values
+
+```json
+{
+  "tags-check": "off",
+  "tags-check": "warn",
+  "tags-check": "error",
+  "tags-check": ["off"],
+  "tags-check": [
+    "warn",
+    {
+      "img": {
+        "selfclosing": true,
+        "attrsRequired": ["src", "alt", "title"]
+      }
+    }
+  ],
+  "tags-check": [
+    "error",
+    {
+      "a": {
+        "selfclosing": false,
+        "attrsRequired": ["href", "title"],
+        "redundantAttrs": ["alt"]
+      }
+    }
+  ]
+}
+```
+
+## Default
+
+```json
+{
+  "tags-check": [
+    "off",
+    {
+      "a": {
+        "selfclosing": false,
+        "attrsRequired": ["href", "title"],
+        "redundantAttrs": ["alt"]
+      },
+      "div": {
+        "selfclosing": false
+      },
+      "main": {
+        "selfclosing": false,
+        "redundantAttrs": ["role"]
+      },
+      "nav": {
+        "selfclosing": false,
+        "redundantAttrs": ["role"]
+      },
+      "script": {
+        "attrsOptional": [
+          ["async", "async"],
+          ["defer", "defer"]
+        ]
+      },
+      "img": {
+        "selfclosing": true,
+        "attrsRequired": ["src", "alt", "title"]
+      }
+    }
+  ]
+}
+```
+
+## Options
+
+This rule has an object option.
+
+---
+
+## Examples
+
+Examples of **correct** code for this rule:
 
 <!-- prettier-ignore -->
 ```html
@@ -15,7 +91,7 @@ The following pattern are **not** considered violations:
 <img src="bbb" title="aaa" alt="asd" />
 ```
 
-The following pattern is considered violation:
+Examples of **incorrect** code for this rule:
 
 <!-- prettier-ignore -->
 ```html
@@ -24,3 +100,13 @@ The following pattern is considered violation:
 <a href="bbb" title="aaa" />
 <img src="bbb" title="aaa" alt="asd"></img>
 ```
+
+---
+
+## When Not To Use It
+
+If your project doesn't need custom checks for tags.
+
+## Version
+
+This rule was introduced in HTMLHint `v0.11.0`.
diff --git a/docs/user-guide/rules/title-require.md b/docs/user-guide/rules/title-require.md
index 7defb1f00..8a0fbecc3 100644
--- a/docs/user-guide/rules/title-require.md
+++ b/docs/user-guide/rules/title-require.md
@@ -5,25 +5,64 @@ title: title-require
 
 `<title>` must be present in `<head>` tag.
 
-Level: `error`
+## Possible Configuration Values
 
-## Config value
+```json
+{
+  "title-require": "off",
+  "title-require": "warn",
+  "title-require": "error",
+  "title-require": ["off"],
+  "title-require": ["warn"],
+  "title-require": ["error"]
+}
+```
+
+## Default
 
-1. true: enable rule
-2. false: disable rule
+```json
+{ "title-require": "error" }
+```
 
-The following pattern are **not** considered violations:
+---
+
+## Examples
+
+Examples of **correct** code for this rule:
 
-<!-- prettier-ignore -->
 ```html
-<html><head><title>test</title></head></html>
+<html>
+  <head>
+    <title>test</title>
+  </head>
+</html>
 ```
 
-The following pattern is considered violation:
+Examples of **incorrect** code for this rule:
 
-<!-- prettier-ignore -->
 ```html
-<html><head></head></html>
-<html><head><title></title></head></html>
-<html><title></title><head></head></html>
+<html>
+  <head></head>
+</html>
+
+<html>
+  <head>
+    <title></title>
+  </head>
+</html>
+
+<html>
+  <title></title>
+  <head></head>
+</html>
 ```
+
+---
+
+## When Not To Use It
+
+If your project will not use a `title` tag.
+
+## Version
+
+This rule was introduced in HTMLHint `v0.9.8`.
diff --git a/website/sidebars.js b/website/sidebars.js
index d82bdf703..a8937e429 100644
--- a/website/sidebars.js
+++ b/website/sidebars.js
@@ -9,13 +9,17 @@ module.exports = {
           {
             'Individual rules': [
               'user-guide/rules/alt-require',
-              'user-guide/rules/attr-no-duplication',
               'user-guide/rules/attr-lowercase',
+              'user-guide/rules/attr-no-duplication',
+              'user-guide/rules/attr-no-unnecessary-whitespace',
+              'user-guide/rules/attr-sorted',
               'user-guide/rules/attr-unsafe-chars',
               'user-guide/rules/attr-value-double-quotes',
               'user-guide/rules/attr-value-not-empty',
+              'user-guide/rules/attr-value-single-quotes',
+              'user-guide/rules/attr-whitespace',
               'user-guide/rules/doctype-first',
-              'user-guide/rules/empty-tag-not-self-closed',
+              'user-guide/rules/doctype-html5',
               'user-guide/rules/head-script-disabled',
               'user-guide/rules/href-abs-or-rel',
               'user-guide/rules/id-class-ad-disabled',
@@ -23,12 +27,17 @@ module.exports = {
               'user-guide/rules/id-unique',
               'user-guide/rules/inline-script-disabled',
               'user-guide/rules/inline-style-disabled',
+              'user-guide/rules/input-requires-label',
+              'user-guide/rules/script-disabled',
               'user-guide/rules/space-tab-mixed-disabled',
               'user-guide/rules/spec-char-escape',
               'user-guide/rules/src-not-empty',
               'user-guide/rules/style-disabled',
               'user-guide/rules/tag-pair',
+              'user-guide/rules/tag-self-close',
               'user-guide/rules/tagname-lowercase',
+              'user-guide/rules/tagname-specialchars',
+              'user-guide/rules/tags-check',
               'user-guide/rules/title-require',
             ],
           },