Generatore di Slug

Che cos'è uno slug URL?

Uno slug URL è la parte di un indirizzo web che identifica una pagina specifica in forma leggibile dall'utente. Nell'URL https://example.com/blog/my-first-post, lo slug è my-first-post. Un generatore di slug trasforma il titolo o la descrizione di una pagina in una stringa che contiene solo lettere minuscole, numeri e trattini (o un altro separatore scelto). Questo processo elimina gli spazi, rimuove accenti e diacritici, scarta i caratteri speciali e normalizza gli spazi bianchi in singoli separatori.

La generazione degli slug è una fase standard nei sistemi di gestione dei contenuti, nei generatori di siti statici, nelle piattaforme blog e in qualsiasi applicazione che ricava gli URL dall'input dell'utente. WordPress, Ghost, Hugo, Next.js e Django includono tutti una logica di generazione degli slug perché gli URL leggibili migliorano sia l'usabilità che l'ottimizzazione per i motori di ricerca. Uno slug ben formato comunica all'utente il contenuto di una pagina ancora prima di fare clic sul collegamento.

Il termine "slug" viene dal giornalismo cartaceo, dove indicava un'etichetta breve usata per identificare un articolo durante la produzione. Nello sviluppo web, lo slug svolge la stessa funzione: è un identificatore compatto, univoco e sicuro per gli URL, derivato da un titolo o nome più lungo. Poiché gli slug vengono generati in modo programmatico, un generatore affidabile garantisce coerenza su ogni pagina e in ogni locale.

Perché usare questo generatore di slug?

Creare slug URL manualmente è soggetto a errori. Dimenticare di rimuovere un accento, lasciare un trattino doppio o non gestire un caso limite con input Unicode può produrre URL non funzionanti o poco leggibili. Questo strumento gestisce automaticamente questi problemi.

Casi d'uso del generatore di slug

Regole di generazione degli slug e gestione dei caratteri

La generazione degli slug segue una sequenza prevedibile di trasformazioni. Capire ogni passaggio ti aiuta a fare il debug di output inattesi o a costruire la tua funzione slugify.

1. 1. Normalizzazione Unicode (NFD)

   Scomponi i caratteri combinati in carattere base + segno diacritico. Ad esempio, é (U+00E9) diventa e + accento acuto combinante (U+0301). Questo rende i diacritici rimovibili nel passaggio successivo.
2. 2. Rimozione dei diacritici

   Rimuovi tutti i caratteri nel blocco Unicode Combining Diacritical Marks (U+0300–U+036F). Dopo questo passaggio, café diventa cafe e Ñ diventa N.
3. 3. Rimozione dei caratteri speciali

   Sostituisci con uno spazio qualsiasi carattere che non sia una lettera, una cifra, uno spazio bianco o un trattino. Questo elimina la punteggiatura, i simboli e i caratteri privi di equivalente ASCII.
4. 4. Eliminazione e compressione degli spazi bianchi

   Rimuovi gli spazi bianchi iniziali e finali, poi comprimi tutte le sequenze consecutive di spazi, underscore o trattini in un singolo separatore scelto.
5. 5. Applicazione di maiuscole e separatore

   Converti in minuscolo (facoltativo) e unisci le parole con il carattere separatore scelto: trattino (-), underscore (_) o punto (.).

Riferimento per la trasformazione dei caratteri

La tabella seguente mostra come vengono gestiti i caratteri comuni durante la generazione degli slug:

Esempi di codice

Generazione degli slug nei linguaggi e framework più diffusi. Ogni esempio gestisce la normalizzazione Unicode, la rimozione dei diacritici e l'inserimento del separatore.

function slugify(text, separator = '-') {
  return text
    .normalize('NFD')                   // decompose accented chars
    .replace(/[\u0300-\u036f]/g, '')    // strip diacritics
    .toLowerCase()
    .replace(/[^\w\s-]/g, ' ')          // drop special chars
    .trim()
    .replace(/[\s_-]+/g, separator)     // collapse whitespace → separator

  // slugify('Café au Lait')      → "cafe-au-lait"
  // slugify('Hello World', '_')  → "hello_world"
}

// Node.js alternative using the `slugify` npm package:
// npm install slugify
// const slugify = require('slugify')
// slugify('Hello World', { lower: true, strict: true }) → "hello-world"

import re
import unicodedata

def slugify(text: str, separator: str = '-') -> str:
    """Convert text to a URL-safe slug."""
    text = unicodedata.normalize('NFD', text)
    text = text.encode('ascii', 'ignore').decode('ascii')  # strip non-ASCII
    text = text.lower()
    text = re.sub(r'[^\w\s-]', ' ', text)
    text = text.strip()
    text = re.sub(r'[\s_-]+', separator, text)
    return text

# slugify('Café au Lait')      → "cafe-au-lait"
# slugify('Hello World', '_')  → "hello_world"

# Alternative: python-slugify (pip install python-slugify)
# from slugify import slugify
# slugify('Café au Lait')  → "cafe-au-lait"

package main

import (
	"regexp"
	"strings"
	"unicode"

	"golang.org/x/text/unicode/norm"
	"golang.org/x/text/transform"
	"golang.org/x/text/runes"
)

func slugify(text string) string {
	// NFD normalize and strip diacritics
	t := transform.Chain(norm.NFD, runes.Remove(runes.In(unicode.Mn)), norm.NFC)
	result, _, _ := transform.String(t, text)

	result = strings.ToLower(result)
	re := regexp.MustCompile(`[^\w\s-]+`)
	result = re.ReplaceAllString(result, " ")
	result = strings.TrimSpace(result)
	re = regexp.MustCompile(`[\s_-]+`)
	result = re.ReplaceAllString(result, "-")
	return result
}

// slugify("Café au Lait") → "cafe-au-lait"
// slugify("Hello World")  → "hello-world"

function slugify(string $text, string $separator = '-'): string {
    // Transliterate non-ASCII characters
    $text = transliterator_transliterate(
        'Any-Latin; Latin-ASCII; Lower()', $text
    );
    // Remove anything that is not a word char, space, or hyphen
    $text = preg_replace('/[^\w\s-]/', ' ', $text);
    $text = trim($text);
    $text = preg_replace('/[\s_-]+/', $separator, $text);
    return $text;
}

// slugify('Café au Lait')      → "cafe-au-lait"
// slugify('Hello World', '_')  → "hello_world"

Domande frequenti