Generatore di Slug
Lo slug è usato per costruire un URL parlanti, lo slug è facile da scrivere, facile da capire e soprattutto è descrittivo.
Lo slug è una porzione dell'URL che corrisponde ad una specifica risorsa, di solito viene generata da una stringa di testo (solitamente il titolo della pagina).
Lo slug ha la caratteristica di essere formato da parole divise da un separatore, solitamente il trattino (-).
Perchè utilizzare lo slug?
I passi per creare uno slug corretto:
- Tutti i caratteri convertiti in minuscolo.
- Sono convertite (translitterate) tutte le lettere che non possono essere utilizzate in un URL (https://en.wikipedia.org/wiki/Percent-encoding#Types_of_URI_characters),per esempio (è) diventa (e), o (Ù) diventa (u).
- Gli spazi vuoti vengono convertiti dal separatore (di solito viene utilizzato il trattino-).
- I caratteri che non possono essere convertiti vengono rimossi.
Ad esempio, il testo "Come stai? Sto bene, grazie!" diventa "come-stai-sto-bene-grazie".
Un URL con slug sarà quindi molto più facile da interpretare da un utente che fa clic su quel collegamento.
Ecco due URL a confronto, il primo senza l'uso di slug, il secondo con l'uso di slug:
https://example.com/index.php?page=125 https://example.com/contact-us
contact-us è lo slug, facile da ricordare, facile da vedere a quale pagina accederemo.
I siti che utilizzano lo slug vengono presi in considerazione anche dai motori di ricerca che sono in grado di classificare meglio le pagine.
Le pagine con slug sono quindi molto più seo friendly.
I framework moderni o cms come Wordpress o Symfony utilizzano i sistemi integrati di generazione dello slug, partendo solitamente dal titolo o dal nome della pagina.
Librerie
Php
Esistono diverse classi o funzioni per PHP.
Eccone alcune packages da Composer.
Questa la mia preferita: https://github.com/andyhu/transliteration
/** * Modifies a string to remove all non ASCII characters and spaces. */ static public function slugify($text) { // replace non letter or digits by - $text = preg_replace('~[^\\pL\d]+~u', ' -', $text); // trim $text = trim($text, '-'); // transliterate if (function_exists('iconv')) { $text = iconv('utf-8', 'us - ascii//TRANSLIT', $text); } // lowercase $text = strtolower($text); // remove unwanted characters $text = preg_replace('~[^-\w]+~', '', $text); if (empty($text)) { return 'n-a'; } return $text; }
Slugify function in Javascript
var slugifyText = function (text) { return text.toString().toLowerCase() .replace(/\s+/g, '-') .replace(/[^\w\-]+/g, '') .replace(/\-\-+/g, '-') .replace(/^-+/, '') .replace(/-+$/, ''); }
Slugify function in C#
private string ToSeoFriendly(string title, int maxLength) { var match = Regex.Match(title.ToLower(), "[\\w]+"); StringBuilder result = new StringBuilder(""); bool maxLengthHit = false; while (match.Success && !maxLengthHit) { if (result.Length + match.Value.LengthSlugify class in Java
package util; import java.text.Normalizer; import java.text.Normalizer.Form; import java.util.Locale; import java.util.regex.Pattern; public class Slug { private static final Pattern NONLATIN = Pattern.compile("[^\\w-]"); private static final Pattern WHITESPACE = Pattern.compile("[\\s]"); public String makeSlug(String input) { String nowhitespace = WHITESPACE.matcher(input).replaceAll("-"); String normalized = Normalizer.normalize(nowhitespace, Form.NFD); String slug = NONLATIN.matcher(normalized).replaceAll(""); return slug.toLowerCase(Locale.ENGLISH); } }Slugify class in Perl
my $input = 'In C#: How do I add "Quotes" around string in a comma delimited list of strings?'; my $length = 20; $input =~ s/[^a-z0-9]+/-/gi; $input =~ s/^(.{1,$length}).*/\L$1/; print "$input\n";Slugify class in Ruby
def seo_friendly(str) str.strip.downcase.gsub /\W+/, '-' end