URL-slug Generator
Zet een titel om in een schoon, URL-veilig pad — kebab-case, kleine letters, geen accenten
Titel of tekst
Slug
Wat is de URL-slug Generator?
Je hebt een blogpost geschreven met de titel "Hoe Parse je een URL in JavaScript — De Gids van een Café-eigenaar (Editie 2026)" en nu heb je een URL-pad nodig. Je wilt geen %E2%80%94 erin, geen spaties, geen hoofdletters die breken op case-sensitive servers. Je wilt hoe-parse-je-een-url-in-javascript-de-gids-van-een-cafe-eigenaar-editie-2026. Dat is wat dit doet. Plak de titel, kopieer de slug. De term komt uit de uitgeverij — zie het Wikipedia-lemma over slugs voor de etymologie.
Het algoritme is het standaard. Naar kleine letters, dan String.prototype.normalize('NFD') draaien om Unicode-tekens te ontleden in basisletter plus combinerende tekens. Verwijder de tekens (zo wordt é dus e, ë wordt e). Behandel een paar veelvoorkomende ligaturen handmatig — æ wordt ae, ø wordt o, ß wordt ss, ł wordt l, ij wordt ij. Vervang elke reeks niet-alfanumerieke tekens door één enkel koppelteken. Knip leidende en volgende koppeltekens af. Begrens op 80 tekens op een woordgrens, zodat je niet eindigt met een slug die midden in een woord is afgeknipt.
Waarom kebab-case? Omdat koppeltekens de conventie zijn. Google's richtlijnen voor URL-structuur bevelen koppeltekens aan boven underscores voor woordscheiding in URL's — zoekmachines lezen koppeltekens als woordgrenzen. RFC 3986 definieert de niet-gereserveerde tekens in een URL-pad (letters, cijfers, koppelteken, punt, underscore, tilde) en de meeste slug-conventies houden zich aan een subset daarvan. Snake_case (mijn_post_titel) en Title-Case-Slug (Mijn-Post-Titel) zijn alternatieven die je tegenkomt, maar kebab-case in kleine letters is overal de standaard, van de praktijk van schone URL's tot de meeste CMS-defaults.
Hoe gebruik je de slug-generator
Drie stappen. Elke past bij een knop op deze pagina.
Plak een titel of laad het voorbeeld
Gooi een titel, kop, productnaam of willekeurige tekst in het linkerpaneel. Klik op Voorbeeld om een realistisch voorbeeld te laden met em-streepjes, accenten en haakjes — het soort titel dat naïeve slug-code breekt. Voorbeeld-invoer:
Hoe Parse je een URL in JavaScript — De Gids van een Café-eigenaar (Editie 2026)Alles mag — emoji, geaccentueerde letters, smart quotes, em-streepjes, dubbele koppeltekens, meerdere spaties. De slug komt schoon eruit.
Lees de slug
Het rechterpaneel toont de slug terwijl je typt. Kleine letters, met koppeltekens, alleen ASCII, begrensd op 80 tekens op een woordgrens. Als de invoer geen slug-bare tekens bevatte (bijv. alleen emoji of alleen leestekens), zie je een vriendelijke notitie in plaats van een verwarrend leeg resultaat.
Kopieer of download
Klik op Kopiëren om de slug naar je klembord te sturen, of op Downloaden om hem op te slaan als .txt-bestand. Gebruik Wissen op het invoerpaneel om opnieuw te beginnen met een nieuwe titel.
Wanneer je dit echt zou gebruiken
Blogpost-URL's
Je CMS genereert automatisch slugs maar ze zijn lelijk — strijkt accenten verkeerd, laat underscores staan, behandelt smart quotes niet. Je plakt de titel hier, krijgt een schone slug, plakt hem terug in het URL-veld. Werkt voor WordPress, Ghost, zelfgebouwde Next.js-blogs, alles waarmee je de slug kunt overschrijven.
Product- of categorie-URL's in e-commerce
Marco Rivera voegt een nieuw product toe genaamd "Crème Brûlée Set — 4-pack (Beperkte Editie)". De URL moet zijn /producten/creme-brulee-set-4-pack-beperkte-editie, niet /producten/Crème+Brûlée+Set+%E2%80%94+4-pack+%28Beperkte+Editie%29. Sluggen, plakken.
Bestandsnamen uit door mensen ingevoerde titels
Je slaat geüploade documenten op schijf op en de klant heeft "Q4 Rapport — Definitief (v3).docx" als titel getypt. Dat wil je niet als bestandsnaam. Slug de titel, plak .docx erachter, schrijf het bestand. Werkt op dezelfde manier voor S3-keys, GitHub-branchnamen uit issue-titels, en Slack-kanaalnamen uit projectnamen.
Content migreren van een ander CMS
Priya Patel verhuist 800 artikelen van een legacy CMS naar een nieuwe en de bron-titels hebben inconsistente encoding — sommige met accenten, sommige niet, sommige met emoji uit een redesign van 2018. Stuur elke titel door de slugger, ontdubbel, en je hebt je nieuwe URL-map klaar voor de redirect-tabel.
Veelgestelde Vragen
Waarom strippen jullie accenten in plaats van ze percent-encoded?
Omdat de slug bedoeld is om door mensen leesbaar te zijn. café in de slug wordt %C3%A9 in de echte URL, wat er afschuwelijk uitziet in een browserbalk, copy-paste in chats breekt, en niet-technische lezers in de war brengt. Strippen naar ASCII houdt de URL leesbaar en SEO-vriendelijk. NFD-normalisatie is de standaardmanier om die ontleding te doen.
Hoe zit het met niet-Latijnse schriften — Chinees, Arabisch, Hindi?
NFD ontleedt geen ideogrammen of schriften die geen basis+combinerende-teken-structuur hebben. Dus een titel in het Chinees produceert hier een lege slug, en je ziet de melding "geen slug-bare tekens". Voor niet-Latijnse schriften heb je twee opties: eerst translitereren (met een library als ICU of unidecode), of het oorspronkelijke schrift in de URL gebruiken — moderne browsers en Google verwerken Unicode in URL's prima, alleen minder mooi.
Waarom afkappen op 80 tekens?
Geen harde regel, maar URL's die de ~80 tekens overschrijden in het pad-segment beginnen lelijk te wrappen in e-mails, social previews en gedrukte media. Google's richtlijnen noemen geen aantal maar bevelen "eenvoudige, beschrijvende" URL's aan — lange zijn geen van beide. De cap zoekt het laatste koppelteken vóór 80 tekens om een afsnijding midden in een woord te vermijden.
Kan het emoji aan?
Ja. Emoji worden gestript samen met andere niet-alfanumerieke tekens. Dus "🎉 Nieuwe Launch! 🚀" wordt nieuwe-launch. Als je slug leeg uitkomt (alleen emoji-invoer), krijg je de vriendelijke lege-slug-notitie in plaats van een kapotte URL.
Wat is het verschil tussen dit en URL-encoding van de titel?
URL-encoding behoudt elk teken maar escape't de onveilige — dus spaties worden %20, accenten worden percent-escaped UTF-8 bytes. Het resultaat is een geldige URL maar onleesbaar. Een slug is iets anders: een mens-vriendelijk pad-segment dat de tekens weggooit die er niet thuishoren. Gebruik URL-encoding voor query-parameters, slugs voor pad-segmenten. De WHATWG URL Standard heeft de precieze definities voor beide.
Moet ik kebab-case of snake_case gebruiken?
Kebab-case (mijn-post-titel) voor URL's — dat is de conventie en dat is wat zoekmachines als woordscheiders behandelen. Snake_case (mijn_post_titel) is prima voor variabelenamen en database-identifiers, maar in URL's worden underscores vaak als deel van het woord behandeld, wat SEO schaadt. Deze tool gebruikt kebab als default. Als je snake nodig hebt, doe find-and-replace van de koppeltekens in de output.
Andere URL- en Tekst-tools
Een slug is één onderdeel van een URL. Hier is wat er nog meer bij past: