diff --git a/templates/base.html b/templates/base.html
new file mode 100644
index 0000000..8234860
--- /dev/null
+++ b/templates/base.html
@@ -0,0 +1,26 @@
+<!doctype html>
+<html lang="it">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <title>{% block title %}{% endblock %}</title>
+    <link
+      href="https://cdn.jsdelivr.net/npm/@picocss/pico@2/css/pico.min.css"
+      rel="stylesheet"
+    />
+    {% block head %}{% endblock %}
+  </head>
+  <body>
+    <main class="container">{% block content %}{% endblock %}</main>
+    <footer class="container">
+      <p>
+        Codice rilasciato sotto licenza
+        <a
+          href="https://git.riefolo.me/mariano/orario-scolastico-itet/src/branch/master/LICENSE"
+          target="_blank"
+          >MPL 2.0</a
+        >
+      </p>
+    </footer>
+  </body>
+</html>
diff --git a/templates/index.html b/templates/index.html
index 98dda6c..a464aeb 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -1,130 +1,94 @@
-<!doctype html>
-<html lang="it">
-  <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1" />
-    <title>Orario scolastico</title>
-    <link
-      href="https://cdn.jsdelivr.net/npm/@picocss/pico@2/css/pico.min.css"
-      rel="stylesheet"
-    />
-    <script src="https://cdn.jsdelivr.net/npm/js-cookie@3.0.5/dist/js.cookie.min.js"></script>
-    <script src="/static/index.js" defer></script>
-    <style>
-      @media (max-width: 1279px) {
-        table thead tr {
-          display: none;
-        }
+{% extends "base.html" %} {% block title %}Orario Scolastico{% endblock %} {%
+block head %}
+<script src="https://cdn.jsdelivr.net/npm/js-cookie@3.0.5/dist/js.cookie.min.js"></script>
+<script src="/static/index.js" defer></script>
+<style>
+  @media (max-width: 1279px) {
+    table thead tr {
+      display: none;
+    }
 
-        table td {
-          display: block;
-        }
+    table td {
+      display: block;
+    }
 
-        table tr {
-          counter-set: column;
-        }
+    table tr {
+      counter-set: column;
+    }
 
-        table tr td {
-          counter-increment: column;
-        }
+    table tr td {
+      counter-increment: column;
+    }
 
-        table td::before {
-          content: counter(column) " ora: ";
-        }
-      }
+    table td::before {
+      content: counter(column) " ora: ";
+    }
+  }
 
-      #table-title {
-        text-align: center;
-      }
-    </style>
-  </head>
-  <body>
-    <main class="container">
-      <noscript>
-        <h1>
-          Per utilizzare questa applicazione è necessario abilitare JavaScript.
-        </h1>
-      </noscript>
-      <div id="forms" hidden>
-        <form id="form-pdf">
-          <fieldset>
-            <label id="pdf-label" aria-busy="true"
-              >Seleziona il calendario</label
-            >
-            <select id="pdf" onchange="select_pdf()" required>
-              <option selected disabled value="none">
-                Seleziona un'opzione
-              </option>
-            </select>
-          </fieldset>
-        </form>
-        <form id="form-type" hidden>
-          <formfield>
-            <label>Seleziona cosa visualizzare</label>
-            <select id="type" onchange="select_type()">
-              <option selected disabled value="none">
-                Seleziona un'opzione
-              </option>
-              <option value="teacher">Orario docente</option>
-              <option value="student">Orario classe</option>
-            </select>
-          </formfield>
-        </form>
-        <form id="form-teacher" onsubmit="return select_teacher()" hidden>
-          <formfield>
-            <label id="teacher-label" aria-busy="true">Seleziona docente</label>
-            <input
-              id="teacher"
-              type="text"
-              oninput="filter_teachers()"
-              placeholder="Filtra"
-            />
-            <select id="teachers"></select>
-          </formfield>
-          <input type="submit" value="Continua" />
-        </form>
-        <form id="form-classes" hidden>
-          <formfield>
-            <label id="class-label" aria-busy="true"
-              >Seleziona la tua classe</label
-            >
-            <select id="year" onchange="load_section()">
-              <option selected disabled value="none">Seleziona l'anno</option>
-            </select>
-            <select id="section" onchange="load_major()">
-              <option selected disabled value="none">
-                Seleziona la sezione
-              </option>
-            </select>
-            <select id="major" onchange="select_class()">
-              <option selected disabled value="none">
-                Seleziona l'indirizzo
-              </option>
-            </select>
-            <input type="submit" value="Continua" />
-          </formfield>
-        </form>
-      </div>
-      <div id="dashboard" hidden>
-        <h1 id="table-title"></h1>
-        <table id="table" class="striped" aria-busy="true"></table>
-        <form>
-          <input type="submit" onclick="delete_cookies()" value="Reimposta" />
-        </form>
-      </div>
-      <dialog id="error-dialog">
-        <p id="error">Errore: non è stato possibile caricare l'orario.</p>
-      </dialog>
-    </main>
-    <footer class="container">
-      <p>
-        Codice rilasciato sotto licenza
-        <a
-          href="https://git.riefolo.me/mariano/orario-scolastico-itet/src/branch/master/LICENSE"
-          target="_blank"
-          >MPL 2.0</a
-        >
-      </p>
-    </footer>
-  </body>
-</html>
+  #table-title {
+    text-align: center;
+  }
+</style>
+{% endblock %} {%block content %}
+<noscript>
+  <h1>Per utilizzare questa applicazione è necessario abilitare JavaScript.</h1>
+</noscript>
+<div id="forms" hidden>
+  <form id="form-pdf">
+    <fieldset>
+      <label id="pdf-label" aria-busy="true">Seleziona il calendario</label>
+      <select id="pdf" onchange="select_pdf()" required>
+        <option selected disabled value="none">Seleziona un'opzione</option>
+      </select>
+    </fieldset>
+  </form>
+  <form id="form-type" hidden>
+    <formfield>
+      <label>Seleziona cosa visualizzare</label>
+      <select id="type" onchange="select_type()">
+        <option selected disabled value="none">Seleziona un'opzione</option>
+        <option value="teacher">Orario docente</option>
+        <option value="student">Orario classe</option>
+      </select>
+    </formfield>
+  </form>
+  <form id="form-teacher" onsubmit="return select_teacher()" hidden>
+    <formfield>
+      <label id="teacher-label" aria-busy="true">Seleziona docente</label>
+      <input
+        id="teacher"
+        type="text"
+        oninput="filter_teachers()"
+        placeholder="Filtra"
+      />
+      <select id="teachers"></select>
+    </formfield>
+    <input type="submit" value="Continua" />
+  </form>
+  <form id="form-classes" hidden>
+    <formfield>
+      <label id="class-label" aria-busy="true">Seleziona la tua classe</label>
+      <select id="year" onchange="load_section()">
+        <option selected disabled value="none">Seleziona l'anno</option>
+      </select>
+      <select id="section" onchange="load_major()">
+        <option selected disabled value="none">Seleziona la sezione</option>
+      </select>
+      <select id="major" onchange="select_class()">
+        <option selected disabled value="none">Seleziona l'indirizzo</option>
+      </select>
+      <input type="submit" value="Continua" />
+    </formfield>
+  </form>
+</div>
+<div id="dashboard" hidden>
+  <h1 id="table-title"></h1>
+  <table id="table" class="striped" aria-busy="true"></table>
+  <form>
+    <input type="submit" onclick="delete_cookies()" value="Reimposta" />
+  </form>
+</div>
+<dialog id="error-dialog">
+  <p id="error">Errore: non è stato possibile caricare l'orario.</p>
+</dialog>
+{% endblock %}
