diff --git a/addons/website/static/src/components/dialog/seo.js b/addons/website/static/src/components/dialog/seo.js
index f57ced6713c..6b25893e693 100644
--- a/addons/website/static/src/components/dialog/seo.js
+++ b/addons/website/static/src/components/dialog/seo.js
@@ -280,6 +280,10 @@ class TitleDescription extends Component {
         }, () => []);
     }
 
+    //--------------------------------------------------------------------------
+    // Getters
+    //--------------------------------------------------------------------------
+
     get seoNameUrl() {
         return this.previousSeoName || this.props.seoNameDefault;
     }
@@ -322,6 +326,24 @@ class TitleDescription extends Component {
         }
         return false;
     }
+
+    //--------------------------------------------------------------------------
+    // Handlers
+    //--------------------------------------------------------------------------
+
+    /**
+     * @private
+     * @param {InputEvent} ev
+     */
+    _updateInputValue(ev) {
+        // `NFKD` as in `http_routing` python `slugify()`
+        ev.target.value = ev.target.value.trim().normalize('NFKD').toLowerCase()
+            .replace(/\s+/g, '-') // Replace spaces with -
+            .replace(/[^\w-]+/g, '') // Remove all non-word chars
+            .replace(/-$/g, '') // Remove trailing -
+            .replace(/--+/g, '-'); // Replace multiple - with single -
+        this.seoContext.seoName = ev.target.value;
+    }
 }
 TitleDescription.template = 'website.TitleDescription';
 TitleDescription.props = {
diff --git a/addons/website/static/src/components/dialog/seo.xml b/addons/website/static/src/components/dialog/seo.xml
index d384512c5d9..4a526e3d087 100644
--- a/addons/website/static/src/components/dialog/seo.xml
+++ b/addons/website/static/src/components/dialog/seo.xml
@@ -143,7 +143,8 @@
                         <div class="input-group-prepend">
                             <span class="input-group-text seo_name_pre" t-esc="seoNamePre"/>
                         </div>
-                        <input type="text" t-model="seoContext.seoName" class="form-control" t-att-placeholder="props.seoNameDefault" />
+                        <input type="text" class="form-control" t-att-placeholder="props.seoNameDefault"
+                               t-on-input="_updateInputValue" t-att-value="seoContext.seoName"/>
                         <div class="input-group-append" title="Unalterable unique identifier">
                             <span class="input-group-text seo_name_post" t-esc="seoNamePost"/>
                         </div>