Japanese titles that give an empty URL slug
A slug function that keeps only a–z and 0–9 turns 日本語タイトル (“Japanese title”) into an empty string. Japanese posts then share one URL, a required slug fails, or every Japanese heading gets the same anchor. Keep letters and digits from every script:
const SEP = /[^\p{L}\p{N}\p{M}]+/gu;
function slugify(text) {
return text
.normalize("NFKC")
.toLowerCase()
.replace(SEP, "-")
.replace(/^-+|-+$/g, "");
}
const slug = slugify(post.title) ||
String(post.id);
\p{L}, \p{N} and \p{M} are Unicode's letters, numbers and marks, and the u flag turns them on. NFKC makes full-width ＡＢＣ１２３ into ABC123, which toLowerCase() then makes abc123, and half-width ｶﾀｶﾅ into カタカナ, so one title typed two ways gives one slug. A title of only emoji or punctuation still comes out empty, so fall back to the ID. What the two ways gave in Node.js 24:
| Title | Only a–z, 0–9 | slugify() |
|---|---|---|
| 日本語タイトル | (empty) | 日本語タイトル |
| 東京 2026！ | 2026 | 東京-2026 |
| ＡＢＣ ｶﾅ | (empty) | abc-カナ |
| ラーメン・つけ麺 | (empty) | ラーメン-つけ麺 |
| 「はじめに」 | (empty) | はじめに |
| 🎉🎉 | (empty) | (empty → ID) |
In the URL, each Japanese character goes out as nine characters of percent-encoding: /blog/日本語タイトル is sent as /blog/%E6%97%A5…, 63 characters for the seven. new URL() encodes it for you, and decodeURIComponent() gave every slug above back exactly. Compare slugs decoded, not as they appear in the raw path.
What went wrong in real apps
- altimate-code #370:
slugify("日本語スタイルガイド")(“Japanese style guide”) returned an empty string, which broke training import for teams with Japanese, Chinese or Korean style guides. - koya #47: the slug kept only
[a-z0-9], so 日本語タイトル gave an empty slug, and saving failed with “slug: required” and no hint why. - mulmoclaude #161: a Japanese column label such as レビュー (“review”) fell back to the ID
column, and the next Japanese columns becamecolumn_2,column_3. - graphite-md #34: heading anchors were built by deleting everything outside
[a-z0-9], so## 日本語got#section.
Romaji from a Chinese table isn't a fix
Turning kanji into Latin letters looks like a way to keep slugs ASCII, but libraries that transliterate, such as python-slugify, read kanji with Chinese readings. spotDL #2827 found that python-slugify made 祈り、終われば into qi ri, zhong wareha and the singer 中島美嘉 into zhong-dao-jia-mei, and the downloader matched the wrong song. Japanese readings need a Japanese dictionary, and one kanji can have several. Keeping the kanji in the slug is simpler and reads correctly.
Heading anchors
Use the same slugify() for heading IDs. The browser decodes the fragment for you: on a page with a heading whose id is 日本語タイトル, going to #%E6%97%A5… scrolled to that heading in Chromium 152, and so did the unencoded #日本語タイトル.
The rest of a Japanese check
A post whose URL is just /blog/ can't be shared. The same pass catches Enter while typing Japanese (the fix), yen charged 100 times over (the fix), kanji drawn in their Chinese shapes (the fix), headings that break in the middle of a word (the fix), postal codes rejected when typed in Japanese (the fix), dates saved one day early in Japan (the fix), address forms in the American order (the fix), phone numbers sent to +81 with the 0 still in (the fix), PDFs with the Japanese missing (the fix), search that finds nothing in Japanese (the fix), previews cut down to “...” in Japanese (the fix), lists sorted in the wrong order (the fix), email subjects that arrive garbled (the fix), CSV files that open garbled in Excel (the fix), file names garbled on upload and download (the fix), dates in the Japanese era that come out wrong (the fix), full-width spaces that get past your checks (the fix), public holidays your app gets wrong (the fix), and vertical text that comes out sideways or upside down (the fix).
Lesstep translates web apps into Japanese and delivers them as one pull request. In Complete (US$249), we check every screen in Japanese, and make sure a Japanese title gets a URL and a heading anchor of its own. The first step is a free sample.
Node.js is a trademark of the OpenJS Foundation; Chromium is a trademark of Google LLC. This page is not affiliated with or endorsed by either of them.
More: Enter sends the message while typing Japanese · Stripe charges 100 times too much in yen · Kanji in their Chinese shapes · Japanese headings that break in the middle of a word · Forms that reject numbers typed in Japanese · Dates that come out wrong for Japanese users · Address forms in the Japanese order · Japanese phone numbers in forms · Japanese text missing from your PDFs · Search that finds nothing in Japanese · Length limits that break in Japanese · Japanese lists sorted in the wrong order · Japanese email subjects that arrive garbled · Japanese CSV files that open garbled in Excel · Japanese file names garbled on upload and download · Japanese era dates that come out wrong · Full-width spaces that get past your checks · Japanese public holidays your app gets wrong · Japanese vertical text that comes out sideways or upside down · Japanese localization checklist · Japanese localization for your web app