Titel oder Text

Slug

Was ist der URL-Slug-Generator?

Du hast einen Blogartikel mit dem Titel "Wie man eine URL in JavaScript parst — Der Leitfaden eines Café-Besitzers (Ausgabe 2026)" geschrieben und brauchst jetzt einen URL-Pfad dafür. Du willst kein %E2%80%94 drin, keine Leerzeichen, keine Großschreibung, die auf Case-sensitiven Servern bricht. Du willst wie-man-eine-url-in-javascript-parst-der-leitfaden-eines-cafe-besitzers-ausgabe-2026. Genau das macht dieses Tool. Titel einfügen, Slug kopieren. Der Begriff selbst stammt aus dem Verlagswesen — siehe den Wikipedia-Eintrag zu sprechenden URLs für die Etymologie.

Der Algorithmus ist Standard. In Kleinbuchstaben umwandeln, dann String.prototype.normalize('NFD') ausführen, um Unicode-Zeichen in Basisbuchstabe plus kombinierende Zeichen zu zerlegen. Marken entfernen (so wird é zu e, ü zu u). Ein paar gängige Ligaturen werden manuell behandelt — æ wird zu ae, ø wird zu o, ß wird zu ss, ł wird zu l. So wird "Größe" zu groesse oder grosse, je nach Vorgehen. Ersetze jede Folge nicht-alphanumerischer Zeichen durch einen einzelnen Bindestrich. Führende und nachfolgende Bindestriche entfernen. Auf 80 Zeichen an einer Wortgrenze begrenzen, damit kein mitten im Wort abgeschnittener Slug entsteht.

Warum kebab-case? Weil Bindestriche die Konvention sind. Die Richtlinien für URL-Struktur von Google empfehlen Bindestriche statt Unterstriche zur Worttrennung in URLs — Suchmaschinen interpretieren Bindestriche als Wortgrenzen. RFC 3986 definiert die nicht reservierten Zeichen in einem URL-Pfad (Buchstaben, Ziffern, Bindestrich, Punkt, Unterstrich, Tilde) und die meisten Slug-Konventionen halten sich an eine Teilmenge davon. Snake_case (mein_post_titel) und Title-Case-Slug (Mein-Post-Titel) sind Alternativen, die man sieht, aber kebab-case in Kleinbuchstaben ist überall der Standard, von der Praxis sauberer URLs bis zu den meisten CMS-Defaults.

Wie du den Slug-Generator verwendest

Drei Schritte. Jeder entspricht einem Button auf dieser Seite.

Titel einfügen oder Beispiel laden

Wirf einen Titel, eine Überschrift, einen Produktnamen oder beliebigen Text in das linke Panel. Klicke auf Beispiel, um ein realistisches Beispiel mit Geviertstrichen, Akzenten und Klammern zu laden — die Art Titel, die naiven Slug-Code zerstört. Beispiel-Eingabe:

Wie man eine URL in JavaScript parst — Der Leitfaden eines Café-Besitzers (Ausgabe 2026)

Alles ist erlaubt — Emojis, Buchstaben mit Akzenten, typografische Anführungszeichen, Geviertstriche, doppelte Bindestriche, mehrere Leerzeichen. Der Slug kommt sauber raus.

Lies den Slug

Das rechte Panel zeigt den Slug, während du tippst. Kleinbuchstaben, mit Bindestrichen, nur ASCII, auf 80 Zeichen an einer Wortgrenze begrenzt. Wenn die Eingabe keine slug-fähigen Zeichen enthielt (z. B. nur Emojis oder nur Satzzeichen), siehst du einen freundlichen Hinweis statt eines verwirrenden leeren Ergebnisses.

Kopieren oder Herunterladen

Klicke auf Kopieren, um den Slug in die Zwischenablage zu schicken, oder auf Herunterladen, um ihn als .txt-Datei zu speichern. Mit Löschen im Eingabe-Panel fängst du mit einem neuen Titel von vorn an.

Wann du das wirklich brauchst

Blogartikel-URLs

Dein CMS generiert Slugs automatisch, aber sie sind hässlich — entfernt Akzente falsch, lässt Unterstriche stehen, kommt mit typografischen Anführungszeichen nicht klar. Du fügst den Titel hier ein, bekommst einen sauberen Slug, und fügst ihn wieder ins URL-Feld ein. Funktioniert für WordPress, Ghost, selbstgebaute Next.js-Blogs, alles, wo du den Slug überschreiben kannst.

Produkt- oder Kategorie-URLs im E-Commerce

Marco Rivera fügt ein neues Produkt namens "Crème Brûlée Set — 4er Pack (Limitierte Auflage)" hinzu. Die URL muss /produkte/creme-brulee-set-4er-pack-limitierte-auflage sein, nicht /produkte/Crème+Brûlée+Set+%E2%80%94+4er+Pack+%28Limitierte+Auflage%29. Sluggen, einsetzen.

Dateinamen aus von Menschen eingegebenen Titeln

Du speicherst hochgeladene Dokumente auf der Platte und der Kunde hat "Q4 Bericht — Final (v3).docx" als Titel eingegeben. Das willst du nicht als Dateiname. Slug aus dem Titel, .docx dranhängen, Datei schreiben. Funktioniert genauso für S3-Keys, GitHub-Branchnamen aus Issue-Titeln und Slack-Kanalnamen aus Projektnamen.

Inhalte von einem anderen CMS migrieren

Priya Patel migriert 800 Artikel von einem Legacy-CMS zu einem neuen, und die Quelltitel haben inkonsistentes Encoding — manche mit Akzenten, manche ohne, manche mit Emojis aus einem Redesign von 2018. Jeden Titel durch den Slugger jagen, deduplizieren, und du hast deine neue URL-Map fertig für die Redirect-Tabelle.

Häufige Fragen

Warum entfernt ihr Akzente, statt sie prozent-zu-codieren?

Weil der Slug für Menschen lesbar sein soll. café im Slug wird in der echten URL zu %C3%A9, was in der Browserleiste schrecklich aussieht, Copy-Paste in Chats kaputtmacht und nicht-technische Leser verwirrt. Auf ASCII reduzieren hält die URL lesbar und SEO-freundlich. NFD-Normalisierung ist der Standardweg für diese Zerlegung.

Was ist mit nicht-lateinischen Schriften — Chinesisch, Arabisch, Hindi?

NFD zerlegt keine Ideogramme oder Schriften, die keine Basis+kombinierende-Marke-Struktur haben. Ein Titel auf Chinesisch produziert hier also einen leeren Slug, und du siehst die Meldung "keine slug-fähigen Zeichen". Für nicht-lateinische Schriften hast du zwei Optionen: erst transliterieren (mit einer Lib wie ICU oder unidecode), oder die Originalschrift in der URL verwenden — moderne Browser und Google kommen mit Unicode in URLs problemlos klar, nur weniger hübsch.

Warum bei 80 Zeichen abschneiden?

Keine harte Regel, aber URLs, die im Pfad-Segment ~80 Zeichen überschreiten, brechen in E-Mails, Social-Vorschauen und Druckmedien unschön um. Die Empfehlung von Google nennt keine Zahl, empfiehlt aber "einfache, beschreibende" URLs — lange sind weder noch. Das Limit findet den letzten Bindestrich vor 80 Zeichen, um einen Schnitt mitten im Wort zu vermeiden.

Verarbeitet es Emojis?

Ja. Emojis werden zusammen mit anderen nicht-alphanumerischen Zeichen entfernt. Aus "🎉 Neuer Launch! 🚀" wird also neuer-launch. Wenn dein Slug leer ausfällt (Eingabe nur mit Emojis), bekommst du den freundlichen Leer-Slug-Hinweis statt einer kaputten URL.

Was ist der Unterschied zwischen dem hier und URL-Encoding des Titels?

URL-Encoding behält jedes Zeichen, escaped aber die unsicheren — Leerzeichen werden zu %20, Akzente zu prozent-escapten UTF-8-Bytes. Das Ergebnis ist eine gültige URL, aber unlesbar. Ein Slug ist etwas anderes: ein menschenfreundliches Pfad-Segment, das Zeichen wegwirft, die nicht dazugehören. URL-Encoding für Query-Parameter, Slugs für Pfad-Segmente. Der WHATWG URL Standard hat die genauen Definitionen für beides.

Soll ich kebab-case oder snake_case verwenden?

Kebab-case (mein-post-titel) für URLs — das ist die Konvention und das, was Suchmaschinen als Worttrenner behandeln. Snake_case (mein_post_titel) ist okay für Variablennamen und Datenbank-IDs, aber in URLs werden Unterstriche oft als Teil des Wortes behandelt, was dem SEO schadet. Dieses Tool nutzt standardmäßig kebab. Wenn du snake brauchst, mach Find-and-Replace der Bindestriche im Output.

Andere URL- und Text-Tools

Ein Slug ist ein Teil einer URL. Hier ist, was sonst noch dazupasst: