diff --git a/src/components/LeftSidebar/LeftSidebar.astro b/src/components/LeftSidebar/LeftSidebar.astro
index a31ec54..ecc531b 100644
--- a/src/components/LeftSidebar/LeftSidebar.astro
+++ b/src/components/LeftSidebar/LeftSidebar.astro
@@ -1,11 +1,13 @@
 ---
 import { getLanguageFromURL } from '../../languages';
-import { SIDEBAR } from '../../config';
-const { currentPage } = Astro.props;
+import { SIDEBARS } from '../../config';
+const { currentPage, frontmatter } = Astro.props;
 const currentPageMatch = currentPage.slice(1);
 const langCode = getLanguageFromURL(currentPage);
+const sidebarType = frontmatter.sidebarType ?? 'default';
+
 // SIDEBAR is a flat array. Group it by sections to properly render.
-const sidebarSections = SIDEBAR[langCode].reduce((col, item, i) => {
+const sidebarSections = SIDEBARS[sidebarType][langCode].reduce((col, item, i) => {
 	// If the first item is not a section header, create a new container section.
 	if (i === 0) {
 		if (!item.header) {
diff --git a/src/config.ts b/src/config.ts
index 5c96c29..d4325cb 100644
--- a/src/config.ts
+++ b/src/config.ts
@@ -31,26 +31,40 @@ export const GITHUB_EDIT_URL = `https://github.com/${GITHUB_REPO}/blob/main/`;
 //   apiKey: 'XXXXXXXXXX',
 // }
 
-export const SIDEBAR = {
-	en: [
-		{ text: '', header: true },
-		{ text: 'Mission', link: 'en/docs/mission' },
-		{ text: 'Projects', link: 'en/projects' },
-		{ text: 'Roles', link: 'https://github.com/email-markup-consortium/email-markup-consortium/blob/main/roles-and-responsibilities.md' },
-		{ text: 'Code of Conduct', link: 'https://github.com/email-markup-consortium/email-markup-consortium/blob/main/code-of-conduct.md' },
-		
-		{ text: 'Help', header: true },
-		{ text: 'Contribute', link: 'en/how-to-help' },
-		{ text: 'Sponsor', link: 'en/sponsors' },
-
-		{ text: 'Docs', header: true },
-		{ text: 'Glossary', link: 'en/docs/glossary' },
-		{ text: 'Vision', link: 'en/docs/vision' },
-		{ text: 'Benefits', link: 'en/docs/benefits' },
-		{ text: 'Compliant Standards', link: 'en/docs/compliant-standards' },
-
-		{ text: 'Reports', header: true },
-		{ text: 'Accessibility', link: 'en/reports/accessibility' },
-		{ text: 'Email Clients', link: 'en/reports/email-clients' },
-	],
+export const SIDEBARS = {
+	default: {
+		en: [
+			{ text: '', header: true },
+			{ text: 'Mission', link: 'en/docs/mission' },
+			{ text: 'Projects', link: 'en/projects' },
+			{ text: 'Roles', link: 'https://github.com/email-markup-consortium/email-markup-consortium/blob/main/roles-and-responsibilities.md' },
+			{ text: 'Code of Conduct', link: 'https://github.com/email-markup-consortium/email-markup-consortium/blob/main/code-of-conduct.md' },
+			
+			{ text: 'Help', header: true },
+			{ text: 'Contribute', link: 'en/how-to-help' },
+			{ text: 'Sponsor', link: 'en/sponsors' },
+
+			{ text: 'Docs', header: true },
+			{ text: 'Glossary', link: 'en/docs/glossary' },
+			{ text: 'Vision', link: 'en/docs/vision' },
+			{ text: 'Benefits', link: 'en/docs/benefits' },
+			{ text: 'Compliant Standards', link: 'en/docs/compliant-standards' },
+
+			{ text: 'Reports', header: true },
+			{ text: 'Accessibility', link: 'en/reports/accessibility' },
+			{ text: 'Email Clients', link: 'en/reports/email-clients' }
+		],
+	},
+
+	sanitizer: {
+		en: [
+			{ text: '', header: true },
+			{ text: 'Back', link: 'en/docs/' },
+
+			{ text: 'Sanitizer', header: true },
+			{ text: 'Intro', link: 'en/docs/sanitizer' },
+			{ text: 'Handling', link: 'en/docs/sanitizer/handling' },
+			{ text: 'Features', link: 'en/docs/sanitizer/features' },
+		],
+	}
 };
diff --git a/src/content/sanitizer/features/css/at-rules/counter-style.md b/src/content/sanitizer/features/css/at-rules/counter-style.md
new file mode 100644
index 0000000..faaf30f
--- /dev/null
+++ b/src/content/sanitizer/features/css/at-rules/counter-style.md
@@ -0,0 +1,7 @@
+---
+title: "@counter-style"
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
diff --git a/src/content/sanitizer/features/css/at-rules/font-face.md b/src/content/sanitizer/features/css/at-rules/font-face.md
new file mode 100644
index 0000000..15eb01f
--- /dev/null
+++ b/src/content/sanitizer/features/css/at-rules/font-face.md
@@ -0,0 +1,7 @@
+---
+title: "@font-face"
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
diff --git a/src/content/sanitizer/features/css/at-rules/keyframes.md b/src/content/sanitizer/features/css/at-rules/keyframes.md
new file mode 100644
index 0000000..4cc3e93
--- /dev/null
+++ b/src/content/sanitizer/features/css/at-rules/keyframes.md
@@ -0,0 +1,7 @@
+---
+title: "@keyframes"
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
diff --git a/src/content/sanitizer/features/css/at-rules/layer.md b/src/content/sanitizer/features/css/at-rules/layer.md
new file mode 100644
index 0000000..f63a273
--- /dev/null
+++ b/src/content/sanitizer/features/css/at-rules/layer.md
@@ -0,0 +1,7 @@
+---
+title: "@layer"
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
diff --git a/src/content/sanitizer/features/css/at-rules/media.md b/src/content/sanitizer/features/css/at-rules/media.md
new file mode 100644
index 0000000..e40ce3e
--- /dev/null
+++ b/src/content/sanitizer/features/css/at-rules/media.md
@@ -0,0 +1,7 @@
+---
+title: "@media"
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
diff --git a/src/content/sanitizer/features/css/at-rules/property.md b/src/content/sanitizer/features/css/at-rules/property.md
new file mode 100644
index 0000000..f27e171
--- /dev/null
+++ b/src/content/sanitizer/features/css/at-rules/property.md
@@ -0,0 +1,7 @@
+---
+title: "@property"
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
diff --git a/src/content/sanitizer/features/css/at-rules/supports.md b/src/content/sanitizer/features/css/at-rules/supports.md
new file mode 100644
index 0000000..c0176c3
--- /dev/null
+++ b/src/content/sanitizer/features/css/at-rules/supports.md
@@ -0,0 +1,7 @@
+---
+title: "@supports"
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
diff --git a/src/content/sanitizer/features/css/properties/color.md b/src/content/sanitizer/features/css/properties/color.md
new file mode 100644
index 0000000..dea7b0f
--- /dev/null
+++ b/src/content/sanitizer/features/css/properties/color.md
@@ -0,0 +1,7 @@
+---
+title: color
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
diff --git a/src/content/sanitizer/features/css/values/calc.md b/src/content/sanitizer/features/css/values/calc.md
new file mode 100644
index 0000000..fa1bb9f
--- /dev/null
+++ b/src/content/sanitizer/features/css/values/calc.md
@@ -0,0 +1,7 @@
+---
+title: calc()
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
diff --git a/src/content/sanitizer/features/css/values/clamp.md b/src/content/sanitizer/features/css/values/clamp.md
new file mode 100644
index 0000000..d4f6d3d
--- /dev/null
+++ b/src/content/sanitizer/features/css/values/clamp.md
@@ -0,0 +1,7 @@
+---
+title: clamp()
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
diff --git a/src/content/sanitizer/features/css/values/counters.md b/src/content/sanitizer/features/css/values/counters.md
new file mode 100644
index 0000000..9653608
--- /dev/null
+++ b/src/content/sanitizer/features/css/values/counters.md
@@ -0,0 +1,7 @@
+---
+title: counters(), counter()
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
diff --git a/src/content/sanitizer/features/css/values/linear-gradient.md b/src/content/sanitizer/features/css/values/linear-gradient.md
new file mode 100644
index 0000000..40b0501
--- /dev/null
+++ b/src/content/sanitizer/features/css/values/linear-gradient.md
@@ -0,0 +1,7 @@
+---
+title: linear-gradient()
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
diff --git a/src/content/sanitizer/features/css/values/max.md b/src/content/sanitizer/features/css/values/max.md
new file mode 100644
index 0000000..85c2f7f
--- /dev/null
+++ b/src/content/sanitizer/features/css/values/max.md
@@ -0,0 +1,7 @@
+---
+title: max()
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
diff --git a/src/content/sanitizer/features/css/values/min.md b/src/content/sanitizer/features/css/values/min.md
new file mode 100644
index 0000000..2aebefe
--- /dev/null
+++ b/src/content/sanitizer/features/css/values/min.md
@@ -0,0 +1,7 @@
+---
+title: min()
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
diff --git a/src/content/sanitizer/features/css/values/radialgradient.md b/src/content/sanitizer/features/css/values/radialgradient.md
new file mode 100644
index 0000000..141d74b
--- /dev/null
+++ b/src/content/sanitizer/features/css/values/radialgradient.md
@@ -0,0 +1,7 @@
+---
+title: radial-gradient()
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
diff --git a/src/content/sanitizer/features/css/values/rgb.md b/src/content/sanitizer/features/css/values/rgb.md
new file mode 100644
index 0000000..08c5349
--- /dev/null
+++ b/src/content/sanitizer/features/css/values/rgb.md
@@ -0,0 +1,7 @@
+---
+title: rgb(), rgba()
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
diff --git a/src/content/sanitizer/features/css/values/var.md b/src/content/sanitizer/features/css/values/var.md
new file mode 100644
index 0000000..3a03902
--- /dev/null
+++ b/src/content/sanitizer/features/css/values/var.md
@@ -0,0 +1,7 @@
+---
+title: var()
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
diff --git a/src/content/sanitizer/features/html/elements/a.md b/src/content/sanitizer/features/html/elements/a.md
new file mode 100644
index 0000000..b53762d
--- /dev/null
+++ b/src/content/sanitizer/features/html/elements/a.md
@@ -0,0 +1,88 @@
+---
+title: "<a>: The Anchor element"
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
+The `<a>` element creates a hyperlink to anything a URL can address including web pages.
+
+
+## Attributes
+
+- `download`
+- `href`
+- `hreflang`
+- `ping`
+- `referrerpolicy`
+- `rel`
+- `target`
+
+
+## Recommendation
+
+It is highly recommended for an email client to support the `<a>` element. However, special care needs to be taken with the element's attributes and their values as it has direct impact on the users' security and privacy.
+
+### download
+
+The Email Markup Consortium does not have an official recommendation at this stage.
+
+
+### href
+
+The value of the `href` attribute represent a URL. This could be a HTTP-based URL, or a URI scheme supported by browsers such as `mailto:` and `tel:`.
+
+Some URI schemes are [officially registered with Internet Assigned Numbers Authority (IANA)](https://www.iana.org/assignments/uri-schemes/uri-schemes.xhtml). There are other unofficial, but common URI schemes such as `app:`.
+
+The fact that a URI scheme is registered with IANA is not enough to determine the scheme is safe to be fully supported by an email client. The `mailto:` URI scheme is a good example of [how fully supporting a registered URI scheme](https://www.zdnet.com/article/some-email-clients-are-vulnerable-to-attacks-via-mailto-links/) is not a wise approach as it can be abused by malicious attackers.
+
+While the `href` is needed to make the `<a>` useful, the Email Markup Consortium does not currently have an official stance on what URI schemes should be considered safe. It is out of this project's scope at this stage.
+
+
+### hreflang
+
+The `hreflang` attribute and its allowed values can be safely supported.
+
+
+### ping
+
+The use of the `ping` attribute, while safe, is a privacy concern as it can be used for tracking the user. In fact, this feature is disabled by default on Firefox for this reason.
+
+However, marketing emails heavily use "click tracker" links; a URL with the sole purpose of tracking clicks and redirecting to the actual desired URL. 
+
+If click trackers are deemed safe, the `ping` attribute should be too. If used in place of click trackers, it may even elevate the user experience as the user would not need to wait for the click tracker to redirect them to the page they intend to visit.
+
+
+### target
+
+It is not recommended to support the `target` attribute with all its values. The email client can determine how and where links are opened instead.
+
+
+### referrerpolicy
+
+The Email Markup Consortium does not have an official recommendation at this stage.
+
+
+### rel
+
+If `target="_blank"` is used, it is advised to have `rel="noreferrer"` and `rel="noopener"` to protect the user from `window.opener` API exploitation attacks. This applies regardless whether the sender or the email client is the one that sets the `target` attribute.
+
+Newer browser versions implicitly sets `rel="noopener"`.
+
+
+## Resources
+
+- [MDN: `<a>`: The Anchor element](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a)
+- [HTML Standard: The `a` element](https://html.spec.whatwg.org/multipage/text-level-semantics.html#the-a-element)
+- [Some email clients are vulnerable to attacks via 'mailto' links](https://www.zdnet.com/article/some-email-clients-are-vulnerable-to-attacks-via-mailto-links/)
+
+
+## Email client compatibility
+
+### Linking to an element on the same page
+
+<iframe title="Can I email… Local anchors" src="https://embed.caniemail.com/html-anchor-links/" width="640" height="420" style="width:100%; max-width:40rem; height:26.25rem; border:none;" loading="lazy"></iframe>
+
+### mailto URI scheme
+
+<iframe title="Can I email… mailto: links" src="https://embed.caniemail.com/html-mailto-links/" width="640" height="420" style="width:100%; max-width:40rem; height:26.25rem; border:none;" loading="lazy"></iframe>
\ No newline at end of file
diff --git a/src/content/sanitizer/features/html/elements/address.md b/src/content/sanitizer/features/html/elements/address.md
new file mode 100644
index 0000000..3dc3a21
--- /dev/null
+++ b/src/content/sanitizer/features/html/elements/address.md
@@ -0,0 +1,7 @@
+---
+title: "<address>"
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
diff --git a/src/content/sanitizer/features/html/elements/article.md b/src/content/sanitizer/features/html/elements/article.md
new file mode 100644
index 0000000..9a956d3
--- /dev/null
+++ b/src/content/sanitizer/features/html/elements/article.md
@@ -0,0 +1,7 @@
+---
+title: "<article>"
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
diff --git a/src/content/sanitizer/features/html/elements/aside.md b/src/content/sanitizer/features/html/elements/aside.md
new file mode 100644
index 0000000..2651e33
--- /dev/null
+++ b/src/content/sanitizer/features/html/elements/aside.md
@@ -0,0 +1,7 @@
+---
+title: "<aside>"
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
diff --git a/src/content/sanitizer/features/html/elements/body.md b/src/content/sanitizer/features/html/elements/body.md
new file mode 100644
index 0000000..a468fc4
--- /dev/null
+++ b/src/content/sanitizer/features/html/elements/body.md
@@ -0,0 +1,7 @@
+---
+title: "<body>"
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
diff --git a/src/content/sanitizer/features/html/elements/br.md b/src/content/sanitizer/features/html/elements/br.md
new file mode 100644
index 0000000..f7176d7
--- /dev/null
+++ b/src/content/sanitizer/features/html/elements/br.md
@@ -0,0 +1,7 @@
+---
+title: "<br>: the Line Break element"
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
diff --git a/src/content/sanitizer/features/html/elements/code.md b/src/content/sanitizer/features/html/elements/code.md
new file mode 100644
index 0000000..aa627cc
--- /dev/null
+++ b/src/content/sanitizer/features/html/elements/code.md
@@ -0,0 +1,7 @@
+---
+title: "<code>"
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
diff --git a/src/content/sanitizer/features/html/elements/div.md b/src/content/sanitizer/features/html/elements/div.md
new file mode 100644
index 0000000..54fe271
--- /dev/null
+++ b/src/content/sanitizer/features/html/elements/div.md
@@ -0,0 +1,34 @@
+---
+title: "<div>"
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
+The `<div>` element is a generic container with no special meaning.
+
+## Recommendation
+
+It is highly recommended for an email client to support the `<div>` element. 
+
+
+## Impacts
+
+### Progressive enhancement
+
+In the context of email in which some HTML elements are expected not to be supported by some email clients, supporting `<div>` may allow the developer to code the email with progressive enhancement in mind and implement an alternative more basic experience.
+
+### Accessibility
+
+While it does not have any semantic meaning on its own and is mainly used for styling, adding the `role` tag attribute can change the semantic meaning of a `<div>`. Supporting `<div>` allows the developer to group elements that semantically need to belong to the same parent.
+
+
+## Resources
+
+- [MDN: `<div>`: The Content Division element](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/div)
+- [HTML Standard: The `div` element](https://html.spec.whatwg.org/multipage/grouping-content.html#the-div-element)
+
+
+## Email client compatibility
+
+<iframe title="Can I email… &lt;div&gt; element" src="https://embed.caniemail.com/html-div/" width="640" height="420" style="width:100%; max-width:40rem; height:26.25rem; border:none;" loading="lazy"></iframe>
\ No newline at end of file
diff --git a/src/content/sanitizer/features/html/elements/em.md b/src/content/sanitizer/features/html/elements/em.md
new file mode 100644
index 0000000..604b26e
--- /dev/null
+++ b/src/content/sanitizer/features/html/elements/em.md
@@ -0,0 +1,21 @@
+---
+title: "<em>: The Emphasis element"
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
+The `<em>` HTML element is a semantic element whose content is meant to stress emphasis.
+
+## Recommendation
+
+It is highly recommended for an email client to support the `<em>` element given the semantic meaning it gives its contents.
+
+## Resources
+
+- [MDN: `<em>`: The Emphasis element](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/em)
+- [HTML Standard: The `em` element](https://html.spec.whatwg.org/multipage/text-level-semantics.html#the-em-element)
+
+## Email client compatibility
+
+No compatibility available.
\ No newline at end of file
diff --git a/src/content/sanitizer/features/html/elements/figcaption.md b/src/content/sanitizer/features/html/elements/figcaption.md
new file mode 100644
index 0000000..f92f39d
--- /dev/null
+++ b/src/content/sanitizer/features/html/elements/figcaption.md
@@ -0,0 +1,7 @@
+---
+title: "<figcaption>"
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
diff --git a/src/content/sanitizer/features/html/elements/figure.md b/src/content/sanitizer/features/html/elements/figure.md
new file mode 100644
index 0000000..9f86e04
--- /dev/null
+++ b/src/content/sanitizer/features/html/elements/figure.md
@@ -0,0 +1,7 @@
+---
+title: "<figure>"
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
diff --git a/src/content/sanitizer/features/html/elements/footer.md b/src/content/sanitizer/features/html/elements/footer.md
new file mode 100644
index 0000000..83056f2
--- /dev/null
+++ b/src/content/sanitizer/features/html/elements/footer.md
@@ -0,0 +1,7 @@
+---
+title: "<footer>"
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
diff --git a/src/content/sanitizer/features/html/elements/h1-h6.md b/src/content/sanitizer/features/html/elements/h1-h6.md
new file mode 100644
index 0000000..50a8ba5
--- /dev/null
+++ b/src/content/sanitizer/features/html/elements/h1-h6.md
@@ -0,0 +1,26 @@
+---
+title: "<h1>-<h6>"
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
+The `<h1>-<h6>` HTML elements represent six levels of section headings. They are some of the most common semantic HTML elements.
+
+## Recommendation
+
+It is highly recommended for an email client to support the `<h1>-<h6>` elements.
+
+## Impacts
+
+### Accessibility
+Assistive technology including screen-readers understand what the `<h1>-<h6>` represent and are known to make use of them for on-page navigation. Users can jump between headings to quickly scan and navigate the contents of a page.
+
+## Resources
+
+- [MDN: `<h1>–<h6>`: The HTML Section Heading elements](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/Heading_Elements)
+- [HTML Standard: The `h1`, `h2`, `h3`, `h4`, `h5`, and `h6` elements](https://html.spec.whatwg.org/multipage/sections.html#the-h1,-h2,-h3,-h4,-h5,-and-h6-elements)
+
+## Email client compatibility
+
+<iframe title="Can I email… &lt;h1&gt; to &lt;h6&gt; elements" src="https://embed.caniemail.com/html-h1-h6/" width="640" height="420" style="width:100%; max-width:40rem; height:26.25rem; border:none;" loading="lazy"></iframe>
\ No newline at end of file
diff --git a/src/content/sanitizer/features/html/elements/head.md b/src/content/sanitizer/features/html/elements/head.md
new file mode 100644
index 0000000..ff81c9f
--- /dev/null
+++ b/src/content/sanitizer/features/html/elements/head.md
@@ -0,0 +1,7 @@
+---
+title: "<head>"
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
diff --git a/src/content/sanitizer/features/html/elements/header.md b/src/content/sanitizer/features/html/elements/header.md
new file mode 100644
index 0000000..e5104a2
--- /dev/null
+++ b/src/content/sanitizer/features/html/elements/header.md
@@ -0,0 +1,7 @@
+---
+title: "<header>"
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
diff --git a/src/content/sanitizer/features/html/elements/hgroup.md b/src/content/sanitizer/features/html/elements/hgroup.md
new file mode 100644
index 0000000..4d8577c
--- /dev/null
+++ b/src/content/sanitizer/features/html/elements/hgroup.md
@@ -0,0 +1,7 @@
+---
+title: "<hgroup>"
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
diff --git a/src/content/sanitizer/features/html/elements/hr.md b/src/content/sanitizer/features/html/elements/hr.md
new file mode 100644
index 0000000..b4e60e1
--- /dev/null
+++ b/src/content/sanitizer/features/html/elements/hr.md
@@ -0,0 +1,7 @@
+---
+title: "<hr>"
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
diff --git a/src/content/sanitizer/features/html/elements/input.md b/src/content/sanitizer/features/html/elements/input.md
new file mode 100644
index 0000000..480ada0
--- /dev/null
+++ b/src/content/sanitizer/features/html/elements/input.md
@@ -0,0 +1,7 @@
+---
+title: "<input>"
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
diff --git a/src/content/sanitizer/features/html/elements/li.md b/src/content/sanitizer/features/html/elements/li.md
new file mode 100644
index 0000000..e8d1f0e
--- /dev/null
+++ b/src/content/sanitizer/features/html/elements/li.md
@@ -0,0 +1,35 @@
+---
+title: "<li>: The List Item element"
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
+The `<li>` element represents an ordered list of items.
+
+## Attributes
+
+- `value`
+- `type` - deprecated, no longer part of the HTML Standard
+
+
+## Recommendation
+
+It is highly recommended for an email client to support the `<li>` element and its attributes (excluding the deprecated `type` attribute).
+
+## Impacts
+
+### Accessibility
+
+The `<li>` element is a semantic element. It is vital for other semantic elements to be useful such as `<ul>` and `<ol>`.
+
+
+## Resources
+
+- [MDN: `<li>`: The List Item element](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/li)
+- [HTML Standard: The `li` element](https://html.spec.whatwg.org/multipage/grouping-content.html#the-li-element)
+
+
+## Email client compatibility
+
+<iframe title="Can I email… &lt;ul&gt;, &lt;ol&gt; and &lt;dl&gt;" src="https://embed.caniemail.com/html-lists/" width="640" height="420" style="width:100%; max-width:40rem; height:26.25rem; border:none;" loading="lazy"></iframe>
\ No newline at end of file
diff --git a/src/content/sanitizer/features/html/elements/link.md b/src/content/sanitizer/features/html/elements/link.md
new file mode 100644
index 0000000..5b5ff0b
--- /dev/null
+++ b/src/content/sanitizer/features/html/elements/link.md
@@ -0,0 +1,7 @@
+---
+title: "<link>"
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
diff --git a/src/content/sanitizer/features/html/elements/main.md b/src/content/sanitizer/features/html/elements/main.md
new file mode 100644
index 0000000..e821b81
--- /dev/null
+++ b/src/content/sanitizer/features/html/elements/main.md
@@ -0,0 +1,7 @@
+---
+title: "<main>"
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
diff --git a/src/content/sanitizer/features/html/elements/meta.md b/src/content/sanitizer/features/html/elements/meta.md
new file mode 100644
index 0000000..5cbbd08
--- /dev/null
+++ b/src/content/sanitizer/features/html/elements/meta.md
@@ -0,0 +1,7 @@
+---
+title: "<meta>"
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
diff --git a/src/content/sanitizer/features/html/elements/nav.md b/src/content/sanitizer/features/html/elements/nav.md
new file mode 100644
index 0000000..659fd1e
--- /dev/null
+++ b/src/content/sanitizer/features/html/elements/nav.md
@@ -0,0 +1,7 @@
+---
+title: "<nav>"
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
diff --git a/src/content/sanitizer/features/html/elements/ol.md b/src/content/sanitizer/features/html/elements/ol.md
new file mode 100644
index 0000000..856ea7e
--- /dev/null
+++ b/src/content/sanitizer/features/html/elements/ol.md
@@ -0,0 +1,35 @@
+---
+title: "<ol>: The Ordered List element"
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
+The `<ol>` element represents an ordered list of items.
+
+## Attributes
+
+- `reversed`
+- `start`
+- `type`
+
+
+## Recommendation
+
+It is highly recommended for an email client to support the `<ol>` element and its attributes.
+
+## Impacts
+
+### Accessibility
+
+The `<ol>` element is a semantic element. Assistive techology including screen-readers treat this differently to other pieces of text. This includes the `reversed` attributes as [screen-readers handle these appropriately](https://www.tempertemper.net/blog/reversing-an-ordered-list-in-html).
+
+## Resources
+
+- [MDN: `<ol>`: The Unordered List element](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/ol)
+- [HTML Standard: The `ol` element](https://html.spec.whatwg.org/multipage/grouping-content.html#the-ol-element)
+- [Reversing an ordered list in HTML](https://www.tempertemper.net/blog/reversing-an-ordered-list-in-html)
+
+## Email client compatibility
+
+<iframe title="Can I email… &lt;ul&gt;, &lt;ol&gt; and &lt;dl&gt;" src="https://embed.caniemail.com/html-lists/" width="640" height="420" style="width:100%; max-width:40rem; height:26.25rem; border:none;" loading="lazy"></iframe>
\ No newline at end of file
diff --git a/src/content/sanitizer/features/html/elements/p.md b/src/content/sanitizer/features/html/elements/p.md
new file mode 100644
index 0000000..068e9aa
--- /dev/null
+++ b/src/content/sanitizer/features/html/elements/p.md
@@ -0,0 +1,26 @@
+---
+title: "<p>: The Paragraph element"
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
+The `<p>` HTML element represents a paragraph. It is one of the most common semantic HTML elements.
+
+## Recommendation
+
+It is highly recommended for an email client to support the `<p>` element.
+
+## Impacts
+
+### Accessibility
+Assistive technology including screen-readers understand what the `<p>` is meant to represent which allows them to provide their users with a way to perform common reading tasks such as skipping a paragraph and navigating to the next/previous paragraph.
+
+## Resources
+
+- [MDN: `<p>`: The Paragraph element](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/p)
+- [HTML Standard: The `p` element](https://html.spec.whatwg.org/multipage/grouping-content.html#the-p-element)
+
+## Email client compatibility
+
+<iframe title="Can I email… &lt;p&gt; element" src="https://embed.caniemail.com/html-p/" width="640" height="420" style="width:100%; max-width:40rem; height:26.25rem; border:none;" loading="lazy"></iframe>
\ No newline at end of file
diff --git a/src/content/sanitizer/features/html/elements/pre.md b/src/content/sanitizer/features/html/elements/pre.md
new file mode 100644
index 0000000..bf7088c
--- /dev/null
+++ b/src/content/sanitizer/features/html/elements/pre.md
@@ -0,0 +1,7 @@
+---
+title: "<pre>"
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
diff --git a/src/content/sanitizer/features/html/elements/section.md b/src/content/sanitizer/features/html/elements/section.md
new file mode 100644
index 0000000..3cbfc01
--- /dev/null
+++ b/src/content/sanitizer/features/html/elements/section.md
@@ -0,0 +1,7 @@
+---
+title: "<section>"
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
diff --git a/src/content/sanitizer/features/html/elements/span.md b/src/content/sanitizer/features/html/elements/span.md
new file mode 100644
index 0000000..e746df8
--- /dev/null
+++ b/src/content/sanitizer/features/html/elements/span.md
@@ -0,0 +1,34 @@
+---
+title: "<span>"
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
+The `<span>` element is a generic container with no special meaning.
+
+## Recommendation
+
+It is highly recommended for an email client to support the `<span>` element. 
+
+
+## Impacts
+
+### Progressive enhancement
+
+In the context of email in which some HTML elements are expected not to be supported by some email clients, supporting `<span>` may allow the developer to code the email with progressive enhancement in mind and implement an alternative more basic experience.
+
+### Accessibility
+
+While it does not have any semantic meaning on its own and is mainly used for styling, adding the `role` tag attribute can change the semantic meaning of a `<span>`. Supporting `<span>` allows the developer to group elements that semantically need to belong to the same parent or wrap some content that needs to belong to an element with a specific role.
+
+
+## Resources
+
+- [MDN: `<span>`: The Content Span element](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/span)
+- [HTML Standard: The `span` element](https://html.spec.whatwg.org/multipage/text-level-semantics.html#the-span-element)
+
+
+## Email client compatibility
+
+<iframe title="Can I email… &lt;span&gt; element" src="https://embed.caniemail.com/html-span/" width="640" height="420" style="width:100%; max-width:40rem; height:26.25rem; border:none;" loading="lazy"></iframe>
\ No newline at end of file
diff --git a/src/content/sanitizer/features/html/elements/strong.md b/src/content/sanitizer/features/html/elements/strong.md
new file mode 100644
index 0000000..b744057
--- /dev/null
+++ b/src/content/sanitizer/features/html/elements/strong.md
@@ -0,0 +1,21 @@
+---
+title: "<strong>: The Strong Importance element"
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
+The `<strong>` HTML element is a semantic element whose content is considered of strong importance.
+
+## Recommendation
+
+It is highly recommended for an email client to support the `<strong>` element given the semantic meaning it gives its contents.
+
+## Resources
+
+- [MDN: `<strong>`: The Strong Importance element](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/strong)
+- [HTML Standard: The `strong` element](https://html.spec.whatwg.org/multipage/text-level-semantics.html#the-strong-element)
+
+## Email client compatibility
+
+<iframe title="Can I email… &lt;strong&gt; element" src="https://embed.caniemail.com/html-strong/" width="640" height="420" style="width:100%; max-width:40rem; height:26.25rem; border:none;" loading="lazy"></iframe>
\ No newline at end of file
diff --git a/src/content/sanitizer/features/html/elements/style.md b/src/content/sanitizer/features/html/elements/style.md
new file mode 100644
index 0000000..cdf43cc
--- /dev/null
+++ b/src/content/sanitizer/features/html/elements/style.md
@@ -0,0 +1,7 @@
+---
+title: "<style>"
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
diff --git a/src/content/sanitizer/features/html/elements/table.md b/src/content/sanitizer/features/html/elements/table.md
new file mode 100644
index 0000000..73b1231
--- /dev/null
+++ b/src/content/sanitizer/features/html/elements/table.md
@@ -0,0 +1,7 @@
+---
+title: "<table>"
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
diff --git a/src/content/sanitizer/features/html/elements/title.md b/src/content/sanitizer/features/html/elements/title.md
new file mode 100644
index 0000000..6277097
--- /dev/null
+++ b/src/content/sanitizer/features/html/elements/title.md
@@ -0,0 +1,7 @@
+---
+title: "<title>"
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
diff --git a/src/content/sanitizer/features/html/elements/ul.md b/src/content/sanitizer/features/html/elements/ul.md
new file mode 100644
index 0000000..e7788e9
--- /dev/null
+++ b/src/content/sanitizer/features/html/elements/ul.md
@@ -0,0 +1,28 @@
+---
+title: "<ul>: The Unordered List element"
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
+The `<ul>` element represents an unordered list of items.
+
+
+## Recommendation
+
+It is highly recommended for an email client to support the `<ul>` element.
+
+## Impacts
+
+### Accessibility
+
+The `<ul>` element is a semantic element. Assistive techology including screen-readers treat this differently to other pieces of text.
+
+## Resources
+
+- [MDN: `<ul>`: The Unordered List element](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/ul)
+- [HTML Standard: The `ul` element](https://html.spec.whatwg.org/multipage/grouping-content.html#the-ul-element)
+
+## Email client compatibility
+
+<iframe title="Can I email… &lt;ul&gt;, &lt;ol&gt; and &lt;dl&gt;" src="https://embed.caniemail.com/html-lists/" width="640" height="420" style="width:100%; max-width:40rem; height:26.25rem; border:none;" loading="lazy"></iframe>
\ No newline at end of file
diff --git a/src/content/sanitizer/features/html/global-attributes/aria-*.md b/src/content/sanitizer/features/html/global-attributes/aria-*.md
new file mode 100644
index 0000000..469a264
--- /dev/null
+++ b/src/content/sanitizer/features/html/global-attributes/aria-*.md
@@ -0,0 +1,31 @@
+---
+title: "aria-*"
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
+The WAI-ARIA (`aria-*`) attributes can be used to modify the accessibility tree of a document. This allows assistive technologies to interact differently with the document and present a different experience to users.
+
+## Recommendation
+
+It is highly recommended for an email client to support the `aria-*` attributes. When used correctly, they can significantly improve the accessibility of the document.
+
+## Resources
+
+- [MDN: Accessible Rich Internet Applications (ARIA)](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/)
+- [W3C: Accessible Rich Internet Applications (WAI-ARIA)](https://w3c.github.io/aria/)
+
+## Email client compatibility
+
+Full compatibility data is not available at this time.
+
+<iframe title="Can I email… aria-describedby attribute" src="https://embed.caniemail.com/html-aria-describedby/" width="640" height="420" style="width:100%; max-width:40rem; height:26.25rem; border:none;" loading="lazy"></iframe>
+
+<iframe title="Can I email… aria-hidden attribute" src="https://embed.caniemail.com/html-aria-hidden/" width="640" height="420" style="width:100%; max-width:40rem; height:26.25rem; border:none;" loading="lazy"></iframe>
+
+<iframe title="Can I email… aria-label attribute" src="https://embed.caniemail.com/html-aria-label/" width="640" height="420" style="width:100%; max-width:40rem; height:26.25rem; border:none;" loading="lazy"></iframe>
+
+<iframe title="Can I email… aria-labelledby attribute" src="https://embed.caniemail.com/html-aria-labelledby/" width="640" height="420" style="width:100%; max-width:40rem; height:26.25rem; border:none;" loading="lazy"></iframe>
+
+<iframe title="Can I email… aria-live attribute" src="https://embed.caniemail.com/html-aria-live/" width="640" height="420" style="width:100%; max-width:40rem; height:26.25rem; border:none;" loading="lazy"></iframe>
\ No newline at end of file
diff --git a/src/content/sanitizer/features/html/global-attributes/aria-role.md b/src/content/sanitizer/features/html/global-attributes/aria-role.md
new file mode 100644
index 0000000..ac2fab7
--- /dev/null
+++ b/src/content/sanitizer/features/html/global-attributes/aria-role.md
@@ -0,0 +1,22 @@
+---
+title: role
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
+The `role` ARIA attribute specifies the role type of an element.
+
+## Recommendation
+
+It is highly recommended for an email client to support the `role` attribute on all HTML tags. It allows authors to specify the appropriate semantic role of an element. This allows assistive technologies such as screen readers to interact with these elements in an expected and appropriate manner for users.
+
+## Resources
+
+- [MDN: Accessible Rich Internet Applications (ARIA)](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/)
+- [MDN: WAI-ARIA Roles](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles)
+- [HTML Standard: The `role` attribute](https://html.spec.whatwg.org/multipage/infrastructure.html#attr-aria-role)
+
+## Email client compatibility
+
+<iframe title="Can I email… role attribute" src="https://embed.caniemail.com/html-role/" width="640" height="420" style="width:100%; max-width:40rem; height:26.25rem; border:none;" loading="lazy"></iframe>
\ No newline at end of file
diff --git a/src/content/sanitizer/features/html/global-attributes/class.md b/src/content/sanitizer/features/html/global-attributes/class.md
new file mode 100644
index 0000000..c8165cc
--- /dev/null
+++ b/src/content/sanitizer/features/html/global-attributes/class.md
@@ -0,0 +1,7 @@
+---
+title: class
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
diff --git a/src/content/sanitizer/features/html/global-attributes/contenteditable.md b/src/content/sanitizer/features/html/global-attributes/contenteditable.md
new file mode 100644
index 0000000..c5f782a
--- /dev/null
+++ b/src/content/sanitizer/features/html/global-attributes/contenteditable.md
@@ -0,0 +1,21 @@
+---
+title: contenteditable
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
+The `contenteditable` global attribute specifies whether an element can be edited by the user.
+
+## Recommendation
+
+It is not recommended for an email client to support the `contenteditable` attribute.
+
+## Resources
+
+- [MDN: The `contenteditable` global attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/contenteditable)
+- [HTML Standard: The `contenteditable` attribute](https://html.spec.whatwg.org/multipage/interaction.html#attr-contenteditable)
+
+## Email client compatibility
+
+No compatibility data available.
\ No newline at end of file
diff --git a/src/content/sanitizer/features/html/global-attributes/data-*.md b/src/content/sanitizer/features/html/global-attributes/data-*.md
new file mode 100644
index 0000000..5bb5cf3
--- /dev/null
+++ b/src/content/sanitizer/features/html/global-attributes/data-*.md
@@ -0,0 +1,7 @@
+---
+title: "data-*"
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
diff --git a/src/content/sanitizer/features/html/global-attributes/dir.md b/src/content/sanitizer/features/html/global-attributes/dir.md
new file mode 100644
index 0000000..216e4df
--- /dev/null
+++ b/src/content/sanitizer/features/html/global-attributes/dir.md
@@ -0,0 +1,23 @@
+---
+title: dir
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
+The `dir` global attribute sets the direction of an element's text (left-to-right or right-to-left).
+
+## Recommendation
+
+It is highly recommended for an email client to support the `dir` attribute. It allows the author to set the direction of the text in the HTML message. 
+
+The direction of the text in the HTML message may not match the direction of the text in the email client UI. The HTML message may also have mixed directional text and the author would need in this case to specify the `dir` attribute on multiple elements.
+
+## Resources
+
+- [MDN: The `dir` global attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/dir)
+- [HTML Standard: The `dir` attribute](https://html.spec.whatwg.org/multipage/dom.html#the-dir-attribute)
+
+## Email client compatibility
+
+<iframe title="Can I email… dir attribute" src="https://embed.caniemail.com/html-dir/" width="640" height="420" style="width:100%; max-width:40rem; height:26.25rem; border:none;" loading="lazy"></iframe>
\ No newline at end of file
diff --git a/src/content/sanitizer/features/html/global-attributes/hidden.md b/src/content/sanitizer/features/html/global-attributes/hidden.md
new file mode 100644
index 0000000..ce12fd6
--- /dev/null
+++ b/src/content/sanitizer/features/html/global-attributes/hidden.md
@@ -0,0 +1,31 @@
+---
+title: hidden
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
+The `hidden` global attribute indicates to the browser that it should not render an element.
+
+## Values
+
+The `hidden` attribute is an enumerated attribute that only accepts the following values:
+
+- an empty string: sets the element in the hidden state
+- the keyword `hidden`: sets the element in the hidden state
+- the keyword `until-found`: sets the element in the hidden state until found
+
+## Recommendation
+
+The Email Markup Consortium does not have an official recommendation at this stage.
+
+It is worth noting that the user-agent default styles for `[hidden]` and `[hidden="until-found"]` are different and developers expect them to be different by default.
+
+## Resources
+
+- [MDN: The `hidden` global attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/hidden)
+- [HTML Standard: The `hidden` attribute](https://html.spec.whatwg.org/multipage/interaction.html#the-hidden-attribute)
+
+## Email client compatibility
+
+<iframe title="Can I email… hidden attribute" src="https://embed.caniemail.com/html-hidden/" width="640" height="420" style="width:100%; max-width:40rem; height:26.25rem; border:none;" loading="lazy"></iframe>
\ No newline at end of file
diff --git a/src/content/sanitizer/features/html/global-attributes/id.md b/src/content/sanitizer/features/html/global-attributes/id.md
new file mode 100644
index 0000000..a3b417e
--- /dev/null
+++ b/src/content/sanitizer/features/html/global-attributes/id.md
@@ -0,0 +1,28 @@
+---
+title: id
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
+The `id` global attribute defines a unqiue identifier on an element.
+
+## Recommendation
+
+It is highly recommended for an email client to support the `id` attribute.
+
+The value of the `id` attribute on an element may be referenced in the values of other attributes on other elements such as the `for` and `aria-labelledby` attributes. Removing the `id` attribute in such cases affects the semantics of the HTML document and has negative impact on accessibility.
+
+If a webmail client directly embeds HTML messages on the same webpage (see [embedding contexts](/en/docs/vision/#embedding-contexts)), then it is a good idea to prefix the values of `id` attributes within the HTML message to avoid clashes with values used by the email client elsewhere. However, all relevant references must also be prefixed such as:
+
+- CSS selectors
+- Values of attributes referencing the value of the `id` attribute (e.g. `for`, `aria-labelledby`)
+
+## Resources
+
+- [MDN: The `id` global attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/id)
+- [HTML Standard: The `id` global attribute](https://html.spec.whatwg.org/multipage/dom.html#global-attributes:the-id-attribute-2)
+
+## Email client compatibility
+
+No compatibility data available.
\ No newline at end of file
diff --git a/src/content/sanitizer/features/html/global-attributes/lang.md b/src/content/sanitizer/features/html/global-attributes/lang.md
new file mode 100644
index 0000000..413917e
--- /dev/null
+++ b/src/content/sanitizer/features/html/global-attributes/lang.md
@@ -0,0 +1,21 @@
+---
+title: lang
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
+The `lang` global attribute defines the language of an HTML element and its children (unless otherwise overwritten).
+
+## Recommendation
+
+It is highly recommended for an email client to support the `lang` attribute on all HTML tags as it provides key metadata to assistive technology such as screen readers and translation software.
+
+## Resources
+
+- [MDN: The `lang` global attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/lang)
+- [HTML Standard: The `lang` and `xml:lang` attributes](https://html.spec.whatwg.org/multipage/dom.html#attr-lang)
+
+## Email client compatibility
+
+<iframe title="Can I email… lang attribute" src="https://embed.caniemail.com/html-lang/" width="640" height="420" style="width:100%; max-width:40rem; height:26.25rem; border:none;" loading="lazy"></iframe>
\ No newline at end of file
diff --git a/src/content/sanitizer/features/html/other/comments.md b/src/content/sanitizer/features/html/other/comments.md
new file mode 100644
index 0000000..66d0069
--- /dev/null
+++ b/src/content/sanitizer/features/html/other/comments.md
@@ -0,0 +1,7 @@
+---
+title: comments
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
diff --git a/src/layouts/MainLayout.astro b/src/layouts/MainLayout.astro
index a417ff0..4ad3433 100644
--- a/src/layouts/MainLayout.astro
+++ b/src/layouts/MainLayout.astro
@@ -19,12 +19,16 @@ const canonicalURL = new URL(Astro.url.pathname, Astro.site);
 const currentPage = Astro.url.pathname;
 
 const filePath = frontmatter.file;
-const currentFile = filePath.slice(filePath.indexOf('src/pages/'));
-const githubEditUrl = CONFIG.GITHUB_EDIT_URL && CONFIG.GITHUB_EDIT_URL + currentFile;
+let currentFile, githubEditUrl, lastModifiedDate = null;
 
-const githubResponse = await fetch(`https://api.github.com/repos/${CONFIG.GITHUB_REPO}/commits?path=${encodeURIComponent(currentFile)}&page=1&per_page=1`);
-const githubData = await githubResponse.json();
-const lastModifiedDate = githubData.length ? new Date(githubData[0].commit.author.date) : null;
+if(filePath) {
+	currentFile = filePath.slice(filePath.indexOf('src/pages/'));
+	githubEditUrl = CONFIG.GITHUB_EDIT_URL && CONFIG.GITHUB_EDIT_URL + currentFile;
+	
+	const githubResponse = await fetch(`https://api.github.com/repos/${CONFIG.GITHUB_REPO}/commits?path=${encodeURIComponent(currentFile)}&page=1&per_page=1`);
+	const githubData = await githubResponse.json();
+	lastModifiedDate = githubData.length ? new Date(githubData[0].commit.author.date) : null;
+}
 
 import SponsorRandom from '@components/Sponsors/SponsorRandom';
 ---
@@ -122,7 +126,7 @@ import SponsorRandom from '@components/Sponsors/SponsorRandom';
 
 		<main class="layout">
 			<aside id="grid-left" class="grid-sidebar" title="Site Navigation">
-				<LeftSidebar {currentPage} />
+				<LeftSidebar {currentPage} {frontmatter} />
 			</aside>
 			<div id="grid-main">
 				<PageContent {frontmatter} headings={onThisPageHeadings} {githubEditUrl} {lastModifiedDate}>
diff --git a/src/pages/en/docs/sanitizer/[...slug].astro b/src/pages/en/docs/sanitizer/[...slug].astro
new file mode 100644
index 0000000..e7d482c
--- /dev/null
+++ b/src/pages/en/docs/sanitizer/[...slug].astro
@@ -0,0 +1,20 @@
+---
+import { CollectionEntry, getCollection } from 'astro:content';
+import MainLayout from '@layouts/MainLayout';
+
+export async function getStaticPaths() {
+	const posts = await getCollection('sanitizer');
+
+	return posts.map((post) => ({
+		params: { slug: post.slug },
+		props: post,
+	}));
+}
+
+type Props = CollectionEntry<'sanitizer'>;
+
+const post = Astro.props;
+const { Content } = await post.render();
+---
+
+<Content />
\ No newline at end of file
diff --git a/src/pages/en/docs/sanitizer/features/index.astro b/src/pages/en/docs/sanitizer/features/index.astro
new file mode 100644
index 0000000..e9844af
--- /dev/null
+++ b/src/pages/en/docs/sanitizer/features/index.astro
@@ -0,0 +1,118 @@
+---
+import MainLayout from '@layouts/MainLayout';
+import { getCollection } from 'astro:content';
+import FeaturedArticle from '@components/FeaturedArticle';
+import { listApiKeys } from '@algolia/client-search';
+
+const posts = (await getCollection('sanitizer'));
+const baseURL = `/en/docs/sanitizer`;
+
+const frontmatter = {
+	title: `HTML and CSS features`,
+	description: ``,
+	sidebarType: `sanitizer`,
+}
+---
+
+<MainLayout frontmatter={frontmatter}>
+	<p>
+		This part of the documentation provides insight to whether HTML and CSS features are safe and/or useful in the context of email, and whether the Email Markup Consortium recommends email clients to support these features.
+	</p>
+
+	<h2>HTML</h2>
+
+	<h3>Elements</h3>
+	<ul>
+	{
+		posts
+		.filter(post => post.slug.startsWith('features/html/elements'))
+		.map((post) => (
+			<li>
+				<a href={`${baseURL}/${post.slug}`}>
+					{post.data.title}
+				</a>
+			</li>
+		))
+	}
+	</ul>
+
+	<h3>Global Attributes</h3>
+	<ul>
+	{
+		posts
+		.filter(post => post.slug.startsWith('features/html/global-attributes'))
+		.map((post) => (
+			<li>
+				<a href={`${baseURL}/${post.slug}`}>
+					{post.data.title}
+				</a>
+			</li>
+		))
+	}
+	</ul>
+
+	<h3>Other</h3>
+	<ul>
+	{
+		posts
+		.filter(post => post.slug.startsWith('features/html/other'))
+		.map((post) => (
+			<li>
+				<a href={`${baseURL}/${post.slug}`}>
+					{post.data.title}
+				</a>
+			</li>
+		))
+	}
+	</ul>
+
+
+	<h2>CSS</h2>
+	
+	<h3>Properties</h3>
+	<ul>
+	{
+		posts
+		.filter(post => post.slug.startsWith('features/css/properties'))
+		.map((post) => (
+			<li>
+				<a href={`${baseURL}/${post.slug}`}>
+					{post.data.title}
+				</a>
+			</li>
+		))
+	}
+	</ul>
+
+	<h3>Values</h3>
+	<ul>
+	{
+		posts
+		.filter(post => post.slug.startsWith('features/css/values'))
+		.map((post) => (
+			<li>
+				<a href={`${baseURL}/${post.slug}`}>
+					{post.data.title}
+				</a>
+			</li>
+		))
+	}
+	</ul>
+
+
+	<h3>At-rules</h3>
+	<ul>
+	{
+		posts
+		.filter(post => post.slug.startsWith('features/css/at-rules'))
+		.map((post) => (
+			<li>
+				<a href={`${baseURL}/${post.slug}`}>
+					{post.data.title}
+				</a>
+			</li>
+		))
+	}
+	</ul>
+	
+</MainLayout>
\ No newline at end of file
diff --git a/src/pages/en/docs/sanitizer/handling.md b/src/pages/en/docs/sanitizer/handling.md
new file mode 100644
index 0000000..39e1492
--- /dev/null
+++ b/src/pages/en/docs/sanitizer/handling.md
@@ -0,0 +1,20 @@
+---
+title: Handling of supported and unsupported features
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
+TODO: intro
+
+## HTML Elements
+
+TODO
+
+## CSS Properties
+
+TODO
+
+## CSS Values
+
+TODO
\ No newline at end of file
diff --git a/src/pages/en/docs/sanitizer/index.md b/src/pages/en/docs/sanitizer/index.md
new file mode 100644
index 0000000..0d3c1fa
--- /dev/null
+++ b/src/pages/en/docs/sanitizer/index.md
@@ -0,0 +1,26 @@
+---
+title: Sanitizer
+description:
+layout: "@layouts/MainLayout"
+sidebarType: sanitizer
+---
+
+## Introduction
+
+TODO
+
+## Audience
+
+TODO
+
+## Background
+
+TODO
+
+## Solution
+
+TODO
+
+## Scope
+
+TODO