本文屬于是語冰的直男翻譯了屬于是，僅供粉絲參考，英文原味版請臨幸 Your Website’s URLs Can and Should Be Beautiful。
圖片
制作優雅 URL 的關鍵是平衡簡潔和清晰。
可以肯定的是，沒有人會用“二階思維”思考 URL。頂多看過就過，僅此而已。我們點過一個又一個的鏈接，卻從不考慮瞄一眼瀏覽器的 URL 地址欄。我們只是假設 URL 是有效的，且會帶我們去詩和遠方。事實上，Chrome 和 Safari 等瀏覽器甚至已經完全隱藏 URL。這是一個錯誤，因為精心制作的 URL 有某些美麗且值得欣賞的東東。
雖然但是，在過去，URL 看起來像亂碼的情況屢見不鮮：
- domAIn.com/blog/archive.php?cat_id=25&page=4
- domain.com/products/view/?product_id=65847135468
- domain.com/forums/view_topic.phtml?topic_id=25874
這些“URL 丑八怪”的問題在于，它們是為 Web 服務器編寫的，而不是為 Web 沖浪者編寫的。無論您盯著這些 URL 看多久，您都找不到任何關于其動機或目的地的真正線索，比如哪個產品與 65847135468 的 ID 相關聯。找出答案的唯一方法是單擊鏈接并希望它是您要查找的內容，這可能會令人沮喪、頭大且耗時。
值得慶幸的是，您現在更有可能看到這樣的 URL：
- domain.com/blog/category/music/page/4
- domain.com/products/view/awesome-product-title
- domain.com/forums/topic/best-blues-albums-of-2023
像這樣的高顏值的 URL（這是 wordPress/ target=_blank class=infotextkey>WordPress 等 CMS 中的默認設置）可以提供有用的、人性化的上下文，讓您在去那里之前了解會發現什么。舉個栗子，根據該論壇主題的“slug” —— best-blues-albums-of-2023 可以合理地假設，如果您去那里，您會發現某些不錯的音樂推薦。
簡而言之，高顏值的 URL 使您的網站更易于訪問和用戶友好，同時還提供某些 seo 優勢。但是，即使您的 CMS 配置為創建高顏值的 URL，您仍然可以使它們變得更好、更漂亮。
簡潔 vs 清晰
設計高顏值 URL 的關鍵是平衡簡潔和清晰。換而言之，一個好的 URL 很短，但不會短到掩蓋它所指向的內容。換而言之，一個好的 URL 包含足夠多相關資源的信息以使其有用，但信息不會過載，以至于它會拖延并變得豬頭。（我只想說，這通常更像是藝術而不是科學。）
請瞄一眼 Derek Severs 的網站。與鮮明的設計相得益彰，它的 URL 幾乎短得滑稽可笑：
- sive.rs/u
- sive.rs/pnt
- sive.rs/shc
瞄一下第一個 URL，您可能永遠不會猜到它是為了 Useful Not True 這本書而設計的（因此其 slug 是 /u）。Sivers 為這種短 URL 提供若干原因，從實用（它們易于記憶和分享）到美觀（它們看起來更好）。雖然我尊重并贊同 Sivers 對效率和減少數字污染的渴望，但其網站的 URL 走得太遠了；它們當然很簡短，但除了本人之外，任何人都無法一目了然。（此外，隨著其網站與時俱進，我想知道它是否仍能夠記住其所有 URL。）
某些 URL 可能很短。在許多網站上看到這樣的 URL 是非常標準的：
- domain.com/about
- domain.com/contact
- domain.com/faq
您幾乎本能地看到 /about 或 /faq，且一目了然，它們分別用于網站的“關于我們”和“常見問題”頁面。它們不需要多余的解釋或上下文。事實上，看到這些 URL 的加長版幾乎可以秒懂是錯誤設計：
- domain.com/about-us
- domain.com/contact-us
- domain.com/frequently-asked-questions
從技術上講，這些加長版比精簡版不那么模棱兩可，但這是不必要的，而且它們現在看起來因為豬頭而豬頭 —— 尤其是如果它們還有其他子頁面。在這兩個 URL 中，哪個顏值更高呢？
- domain.com/about/team
- domain.com/about-us/our-team-members
我的個人心證是，優雅無須多言。
URL 的美化方式
那么，創建優雅的 URL 同時仍然牢記簡潔和清晰的平衡的最佳方法是什么？以下是我刻骨銘心的若干提示，適用于我正在處理的任何網站，無論是 Opus 還是其他地方。
1. URL 分段（URL Segments）要吝嗇
URL 中的每個 / 都表示一個分段，這有助于識別站點的結構。盡管許多站點在數據庫而不是文件系統上運行，但 URL 分段意味著類似于服務器上的文件夾和文件的層次結構。為了保持 URL 簡短，您自然希望將分段數量保持在最低限度。這樣做會迫使您真正考慮如何構建構建網站。可能需要像這樣需要大量分段的 URL：
- domain.com/about/locations/usa/nebraska/lincoln/havelock
- domain.com/clothing/movies/star-wars/shirts/short-sleeve
- domain.com/catalog/toys/robots/transformers/autobots/dinobots
但是，我敢打賭，您可以找到某些方法來簡化和縮短它們，使網站更易于瀏覽和理解。（注意：這涉及網站結構開發和內容組織，這可能是其自身的系列博客文章。）
當 URL 包含大量分段時，我經常發現生成的頁面內容非常單薄且分散，很難證明其合理性。這種方法可能有某些 SEO 福利，但作為用戶，遇到無聊的頁面很頭大，而如果將所有這些內容收集到一個頁面中會更方便。
回到上面的 URL，該組織真的在 Lincoln 有這么多地點，以至于 Havelock 需要專屬 URL 嗎？內布拉斯加州有這么多地方，Lincoln 需要自己的頁面嗎？您能用某些簡潔的東東來代替嗎，比如 domain.com/locations/havelock。
2. Slug 不需要匹配標題
我之前在解釋為什么 domain.com/about 比 domain.com/about-us 更優雅時簡單提到這點。可以假設，即使頁面的標題是“關于我們”，-us 也是多余的。在此基礎上，請瞄一下下列博客文章的 URL：
- domain.com/blog/this-is-my-very-first-blog-post
- domain.com/blog/i-finally-saw-the-shawshank-redemption-and-heres-my-review
- domain.com/blog/ive-been-reading-comic-books-recently-and-these-are-some-of-my-favorites
很有可能，這些 URL slugs 基本上是帖子標題，但經過了 URL 格式化（比如，轉換為小寫字母，去掉標點符號，用破折號替換空格）。如果您點擊了第一個 URL，那么可以肯定的是，該帖子的標題將是“這是我的第一篇博客文章”。但僅僅因為這是標題，并不意味著它也需要成為 slug。您可以縮短和簡化帖子的標題，同時仍能捕捉到其標題的含義：
- domain.com/blog/very-first-blog-post
- domain.com/blog/shawshank-redemption-review
- domain.com/blog/some-recent-comic-book-faves
有人可能會爭辯說，這些精簡版的 URL 缺乏加長版 URL 的個性，情況可能就是如此。如果您認為既臭又長的 URL 是您網站品牌的內在特征，那么請您務必繼續使用它們。如果 SEO 是一個問題，請確保您的 URL 仍然包含任何相關的關鍵字。
值得一提的是，我對我所有的 URL 都使用這種方法，尤其是那些用于我的評論的 URL。以我對 Slowdive 最新專輯的評論為例。頁面標題是“Everything Is Alive by Slowdive （Review）”，但這是評論的 URL：
- opuszine.us/reviews/everything-is-alive-slowdive-2023-dead-oceans
沒有必要在 slug 中重復 review，因為它已經是一個 URL 分段。因此，我的評論 slug 遵循這個慣例：發行標題、藝術家姓名、發行年份和出版商/唱片公司/工作室。這會導致 URL 如下所示：
- opuszine.us/reviews/winks-kisses-20th-anniversary-deluxe-edition-airiel-2023-feeltrip-records
- opuszine.us/reviews/ergo-proxy-shuko-murase-2006-manglobe
- opuszine.us/reviews/saviour-machine-1993-intense-records
雖然但是，也有若干注意事項。舉個栗子，自行發行的專輯中不會有任何標簽信息。如你所見，這種約定可能會導致冗長的 URL。但目標是確保用戶確切地知道正在審查的內容，如果 slug 較短或與帖子的標題完全匹配，這可能是不可能事件。
3. 停止使用“停頓詞”（偶爾）
“停頓詞" —— 包括“a”、“an”、“in”、“is”、“the”和“was” —— 是不會真正為 URL 增加任何價值的單詞，尤其從 SEO 的角度來考慮（盡管它們不是主要因素）。它們往往是冠詞、介詞、連詞和代詞。因此，通常可以刪除它們以簡化 URL，就像我在上面的若干示例中所做的那樣。
但請記住，優雅的 URL 會告知用戶并為它們提供有用的上下文。這意味著，有時刪除停頓詞可能會導致 URL 變得更糟，因為它們是荒謬的，甚至具有誤導性。比較：
- domain.com/blog/i-ate-my-family
- domain.com/blog/my-kid-annoying
- domain.com/blog/practicing-drums-hard
對應的仍然存在停頓詞的版本：
- domain.com/blog/i-ate-with-my-family
- domain.com/blog/my-kid-is-not-annoying
- domain.com/blog/practicing-drums-can-be-hard
這兩組博客文章一龍一豬。
我經常會從 slug 中刪除所有停頓詞，看看它是什么樣子的。如果它是荒謬的或誤導性的，那么我會添加一兩個停頓詞。或者我可能會重寫標題，這樣它就不會包含那么多的停頓詞，這通常會設計出一個更簡潔的 slug —— 甚至可能是一個更好的標題。
4. 不要糾結那個優雅的 URL
一旦您確定了一個優雅的 URL 并發布了您的博客文章、產品或頁面，那就別再管它了，即使那天晚上在夢中出現了一個好十倍的 URL。把時間留給其他事情。
它們被稱為永久鏈接（permalinks）是有原因的；它們應該是永久性的。網絡已經太短暫了，網站消失了，鏈接腐爛了。如果您絕對必須更改網站的某個 URL，請務必添加從舊 URL 到新 URL 的“301”重定向。（有幾種不同類型的重定向，但“301”重定向表示它是永久重定向，它會提醒搜索引擎更新其索引。）
您可能會認為這聽起來像是很多愚蠢、迂腐的工作。畢竟，如果您的 CMS 已經在生成高顏值的 URL，為什么還要為此徒增壓力呢？如果您的網站的 URL 不那么簡潔，那有什么大不了的？
從功能上講，這可能無關緊要。但這些建議都是創建一個精心制作的、精心設計的網站的一部分，為您發布到網絡上的內容感到自豪，并減少數字污染（用德里克·西弗斯的術語）。
優化圖像、使用語義 HTML 和避免深色模式都表明您關心用戶體驗，制作精美簡潔且上下文豐富的 URL 也是如此。用戶可能永遠不會（有意識地）注意到這些努力，但它們幾乎肯定會注意到它們的缺席，即使它們不能完全闡明怎么做或為什么。
我承認，我對漂亮 URL 的偏愛源于這樣一個事實，即我一直覺得 URL 非常神奇。您在瀏覽器的 URL 欄中輸入 https://，然后是一串字母、數字、破折號、下劃線、句點和斜杠，然后您就會被帶到另一個潛在的新聞、信息和資源寶庫。
URL 就像地圖軌跡、路標和咒語一樣，都合二為一。如果有可能在不犧牲任何效用或功能的情況下使它們更高效、更美觀，那么我真的想不出有什么理由不花點時間這樣做。
