﻿# 網頁開發人員應對 URL 的大小寫「有感覺」！

我以前混 Linux 的時候就對檔名的大小寫很注意，因為一個英文字母的大小寫搞錯就會都找不到網頁，之後雖然改混 Windows 也沒丟掉之前的習慣，雖然 NTFS 檔案系統或 IIS 在處理 URL 時預設不會特別區分大小寫，打錯大小寫依然找的到網頁，但不管是網址還是檔名，我對大小寫還是很龜毛，看到別人亂取檔名或 URL 大小寫與檔案大小寫不同時也多少也會唸一下，我還曾經被譏笑太無聊，不過今天我就要證明我的堅持是對的！

Windows 領域的開發人員大多對大小寫「沒感覺」或覺得「沒差」，但如果你打算建構一個超高流量的網站，就必須注意任何微小細節，包括 URL 的大小寫也不例外。

我們都知道透過 Browser Cache 機制可有效加速網頁下載速度，被快取過的 URL 會直接從本機取得網路資源 ( 圖片, JavaScript, CSS, … )，我之前也寫過【[簡易克服 CSS 被瀏覽器快取(Cache)的問題](/post/2008/02/03/Avoid-browser-cache-problem-on-css-or-javascript-file)】文章可有效克服 **用戶端快取** (Client-side Cache) 的問題，但各位可能不會想到當 URL 完全不變僅將大小寫修改後，就可以避免該 URL 不被用戶端快取。

舉個簡單的例子證明，例如我的部落格有張圖片有設定用戶端快取，網址是：

> [http://blog.miniasp.com/themes/TheWillWillWeb/images/img06.jpg](/themes/TheWillWillWeb/images/img06.jpg "http://blog.miniasp.com/themes/TheWillWillWeb/images/img06.jpg")

我總共抓三次此圖片：

1.  當用戶端第一次取得該圖片時，由於尚未快取，所以會抓取完成的內容 ( HTTP 200 )
2.  由於該圖片已經快取至瀏覽器，所以第二次再要求一次該圖片，瀏覽器就不會再次下載，直接取得本機快取的內容!
3.  第三次我刻意修改圖片的副檔名，由於瀏覽器會視為完全不同的網址，因此會再次從 Server 下載圖片！

請參照以下圖示：

![](https://stwillblogassets.blob.core.windows.net/files/images/external/stwillblogassets.blob.core.windows.net/83e833217101e3fc7e4a-image.png)

依據這個特性，在規劃大型網站時就必須注意，如果你已經將網站回應速度與下載速度都最佳化，結果卻因為網頁 HTML 內的圖片、CSS、JavaScript 檔案的大小寫問題而導致內容重複下載，一來佔用頻寬、二來也拉長網頁下載的時間，或許這超級小技巧對大部分情況來說無關痛癢，但專業來自對細節的堅持，當網站需要這些小細節來支援時，就很好用了！

其實我今天講的這個小技巧並沒有說「好」與「壞」，而是希望你「有感覺」而已，當你想有效提升全站的網頁效能，你應該注意所有 URL 都能注意使用統一的大小寫；如果你想讓該網頁立即重整，避免部分檔案被用戶端快取且不想加上[奇怪的尾巴](/post/2008/02/03/Avoid-browser-cache-problem-on-css-or-javascript-file)的話，就可以稍稍修改檔名大小寫，讓使用者就算開啟網頁原始碼察看也完全沒感覺。
