什么是 Slug?
Slug 是字符串的 URL 友好版本,通常从标题或名称派生,只使用小写字母、数字和连字符。它用于为网页、博客文章和其他内容创建人类可读且 SEO 友好的 URL。
快速了解
| 全称 | URL Slug |
|---|---|
| 创建时间 | Web 使用始于 2000 年代初 |
| 规范文档 | 官方规范 |
Slug 工作原理
术语「slug」起源于报纸出版业,指的是为文章提供的用于内部跟踪的简短名称。在 Web 开发中,slug 将「如何创建网站」这样的标题转换为「ru-he-chuang-jian-wang-zhan」。Slug 通过在 URL 中包含相关关键词来改善 SEO,并使链接更易于分享和记忆。好的 slug 是小写的,使用连字符而不是空格或下划线,删除特殊字符和停用词,并且简洁而具有描述性。
主要特点
- 仅使用小写字母和数字
- 连字符替换空格(不是下划线)
- 删除特殊字符和重音符号
- 简洁而具有描述性
- SEO 友好,包含相关关键词
- 在同一内容类型中唯一
常见用途
- 博客文章和文章 URL
- 电商产品页面 URL
- 分类和标签 URL
- 用户个人资料 URL
- 内容管理系统
示例
Slug 转换示例:
原始标题 Slug
"Hello World!" hello-world
"如何学习 JavaScript" ru-he-xue-xi-javascript
"十大最佳实践" shi-da-zui-jia-shi-jian
"什么是 URL?" shen-me-shi-url
"咖啡厅与餐厅指南" ka-fei-ting-yu-can-ting-zhi-nan
URL 示例:
https://example.com/blog/hello-world
https://example.com/products/blue-widget
https://example.com/users/john-doe
JavaScript Slug 函数:
function slugify(text) {
return text
.toLowerCase()
.trim()
.replace(/[^\w\s-]/g, '')
.replace(/[\s_-]+/g, '-')
.replace(/^-+|-+$/g, '');
}