Convertitore kebab case: da testo a kebab-case online

Cos’è il kebab-case

Il convertitore kebab case trasforma i nomi in kebab-case, lo stile che mette i trattini al posto degli spazi e tiene tutte le lettere in minuscolo:

My Blog Post Title diventa my-blog-post-title
backgroundColor diventa background-color
user_profile_card diventa user-profile-card

Come funziona il convertitore

Lo strumento trova le parole in ogni riga, le mette in minuscolo e le unisce con i trattini. Le parole possono essere separate da spazi, underscore, punti o barre, oppure dalle maiuscole come in camelCase e PascalCase. La punteggiatura viene rimossa. Ogni riga viene convertita separatamente, quindi puoi incollare un elenco di titoli o di nomi di classi e ricevere un elenco corrispondente.

Testo inserito	Risultato
My First Blog Post!	my-first-blog-post
backgroundColor	background-color
user_profile_card	user-profile-card
ProductListItem	product-list-item
10 Tips for Better Sleep	10-tips-for-better-sleep

Dove si usa il kebab-case

URL: example.com/blog/my-first-post
CSS: nomi di classi come .nav-item e proprietà come font-size
HTML: attributi come data-user-id e nomi di elementi personalizzati come <user-card>
Nomi di file e cartelle: soprattutto nei progetti web
Pacchetti npm: i nomi dei pacchetti devono essere in minuscolo e il separatore abituale è il trattino
Opzioni da riga di comando: --dry-run, --no-cache

kebab-case per gli slug degli URL

Lo slug è la parte leggibile di un indirizzo web che identifica una pagina. Un buon slug è breve, in minuscolo e con i trattini. Incolla qui il titolo della pagina per avere un punto di partenza, poi accorcialo:

Converti il titolo: “10 Tips for Better Sleep” diventa 10-tips-for-better-sleep.
Togli le parole superflue se lo slug è lungo: tips-better-sleep.
Tieni nello slug la parola chiave principale della pagina.

Con un titolo italiano funziona allo stesso modo: “Le città più belle d’Italia” diventa le-città-più-belle-d-italia. Gli accenti restano e la “d” elisa diventa una parola a sé, quindi ritocca lo slug a mano se ti serve una versione senza accenti, come citta-piu-belle-italia.

Il minuscolo conta perché molti server web trattano /My-Page e /my-page come due indirizzi diversi.

Confronto con altri stili

Stile	Esempio	Funziona nel codice?
kebab-case	user-first-name	No, il trattino significa meno
snake_case	user_first_name	Sì
camelCase	userFirstName	Sì

Ti serve uno degli altri? Prova il convertitore snake case o il convertitore camel case.

Convertitore kebab case: domande e risposte

Cos'è il kebab case?

Il kebab case scrive un nome di più parole in minuscolo, con un trattino tra una parola e l'altra, come in main-nav o my-first-post. Le parole sembrano pezzi di carne infilzati su uno spiedino. Si chiama anche dash case, hyphen case, lisp case o spinal case.

Perché negli URL i trattini sono meglio degli underscore?

Google consiglia i trattini per separare le parole negli URL perché vengono trattati come separatori di parola, e questo aiuta motori di ricerca e persone a leggere l'indirizzo. Gli underscore, invece, possono essere interpretati come se unissero due parole in una.

Posso usarlo per generare lo slug di un URL?

Sì. Incolla il titolo di una pagina e il convertitore lo mette in minuscolo, toglie la punteggiatura e unisce le parole con i trattini. "My First Blog Post!" diventa my-first-blog-post. Le lettere accentate restano come sono ("città" resta "città"), quindi sostituiscile a mano se il tuo sito vuole slug in puro ASCII.

Posso usare il kebab-case per i nomi delle variabili?

Nella maggior parte dei linguaggi no. JavaScript, Python, Java e molti altri leggono il trattino come un segno meno, quindi user-name significherebbe "user meno name". Nel codice usa camelCase o snake_case e tieni il kebab-case per URL, CSS, attributi HTML e nomi di file.

Convertitore kebab case

Converti in

Per il codice