diff --git a/public/dates.html b/public/dates.html
index e5e7e3e5..66eebb42 100644
--- a/public/dates.html
+++ b/public/dates.html
@@ -32,6 +32,19 @@
   <nav>
     <a href="recapitulatif.html" class="btn">Continuer</a>
   </nav>
+
+  <script>
+    window.onload = () => {
+      console.log("truc");
+      var monStockage = localStorage;
+      console.log("key ? storage : ", localStorage.type_sondage);
+
+      document.querySelector('#type_sondage').addEventListener('change', function() {
+        localStorage.setItem('type_sondage', this.options[this.selectedIndex].text);
+      })
+    }
+  </script>
+
 </body>
 </html>
 
diff --git a/public/parametres.html b/public/parametres.html
index 17209ff3..a22d98be 100644
--- a/public/parametres.html
+++ b/public/parametres.html
@@ -18,12 +18,46 @@
 <body>
 
   <section>
-    <p>Je m'appelle <input name="nom" id="nom" /> et le titre de ce sondage /SPECIAL DATES/CLASSIQUE/ est /TITRE DU SONDAGE/.</p>
-    <p>Si je devais le décrire pour les autres personnes, je dirais /CHAMP DESCRIPTION *long*/</p>
+    <p>
+      Je m'appelle
+      <input name="nom" />
+      et le titre de ce sondage
+      <select id="type_sondage">
+        <option>classique</option>
+        <option>special dates</option>
+      </select>
+      est
+      <input name="titre" />.
+    </p>
+    <p>
+      Si je devais le décrire pour les autres personnes, je dirais
+      <textarea></textarea>
+    </p>
 
-    <a href="dates.html" class="btn">Continuer</a>
   </section>
 
+  <nav>
+    <a href="reponses.html" class="btn" id="next">Continuer</a>
+  </nav>
+
+  <script>
+    window.onload = () => {
+      var monStockage = localStorage;
+      localStorage.setItem('type_sondage', 'classique');
+
+      document.querySelector('#type_sondage').addEventListener('change', function() {
+        const selectedType = this.options[this.selectedIndex].text;
+        localStorage.setItem('type_sondage', type_sondage);
+        console.log(selectedType);
+        if(selectedType == "classique") {
+          document.querySelector('#next').href = "reponses.html";
+        } else {
+          document.querySelector('#next').href = "dates.html";
+        }
+        console.log(document.querySelector('#next'))
+      })
+    }
+  </script>
 </body>
 </html>
 
diff --git a/public/reponses.html b/public/reponses.html
new file mode 100644
index 00000000..763d6f55
--- /dev/null
+++ b/public/reponses.html
@@ -0,0 +1,50 @@
+<!doctype html>
+<html lang="fr">
+
+<head>
+  <meta charset="utf-8">
+  <meta name="referrer" content="same-origin">
+  <meta http-equiv="X-UA-Compatible" content="IE=edge">
+
+  <title>Framadate</title>
+
+  <meta name="description" content=" ">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+
+  <link crossorigin="anonymous" rel="stylesheet" href="https://rawgit.com/twbs/bootstrap/v4-dev/dist/css/bootstrap-reboot.css">
+  <link rel="stylesheet" href="style.css">
+</head>
+
+<body>
+
+  <section>
+    <h1>Choix des sujets</h1>
+    <p>
+      Je veux proposer des réponses avec
+      <select>
+        <option>du texte</option>
+        <option>des images</option>
+        <option>des liens</option>
+      </select>
+    </p>
+    <ul>
+      <li>
+        Image
+      </li>
+    </ul>
+
+  </section>
+
+  <nav>
+    <a href="recapitulatif.html" class="btn next">Continuer</a>
+  </nav>
+
+  <script>
+    window.onload = () => {
+      var monStockage = localStorage;
+    }
+  </script>
+</body>
+</html>
+
+
