同一網站中不同尺寸的圖片應如何命名?
同一張圖片有不同尺寸時,可用共同主檔名加上尺寸標記來區分:需要辨識實際大小,就把寬高寫進檔名;只有小圖、大圖兩個版本,則可採用 _s、_b 後綴。提供的公開討論支持這兩種做法,但它們是使用者的命名經驗,不是網站或圖片平台的通用規定。若原本檔名已有 thumbs,不必為小圖再疊加一次;先決定主檔名與尺寸標記各自負責什麼,會比不斷增加描述字更清楚。
只有小圖與大圖:用同一主檔名配對
針對提問中「BBCode 無法指定圖片尺寸,因此用小圖連到大圖」的情境,命名重點是讓兩個 JPG 看得出來屬於同一張圖片,又能區分版本。一名回覆者表示,只有兩種尺寸時,會直接使用 _s.jpg 與 _b.jpg 後綴。套用這個方式,可整理成:
- apple_s.jpg:作為顯示用的小圖。
- apple_b.jpg:作為點擊後開啟的大圖。
以上是依討論做法延伸的命名示例,不是平台要求。檔名負責辨識版本;小圖是否連到大圖,仍是另一個設定問題,不能只靠後綴表示已完成連結。
需要知道實際尺寸:直接寫出寬高
另一種做法是把尺寸寫進檔名。回覆者提供的例子是 apple_thumb_640x480.jpg,並說明自己的程式處理圖片時會直接帶入寬高。相較於只標示大小的 s、b,這種名稱直接保留尺寸資訊,適合希望從檔名辨識寬高的安排。
發文者也提到網站 favicon 使用 favicon-16、favicon-32、favicon-48、favicon-64 等名稱。這可作為「用數字區分尺寸版本」的例子,但材料沒有說明它是所有 favicon 都必須遵守的格式,也不能因此把它當作 JPG 的命名標準。
已有 thumbs:避免讓同一標記重複負責相同意思
若 thumbs 原本就是用來表示縮圖,編輯上的建議是先整理共同主檔名,再選擇一套版本標記,而不是讓小圖名稱反覆出現 thumbs。可以採用不含尺寸意思的主檔名搭配 _s、_b;若保留 thumb,也可參考討論中的寫法,在後面附上寬高。
另有回覆者建議參考 Flickr,使用英文、包含關鍵字且不要太長。不過,材料未附 Flickr 的具體命名規格,因此只能保留為該回覆者的建議。就這次問題而言,優先選定「兩種版本用後綴」或「尺寸直接入檔名」,比追求一套未經確認的平台規則更切題。
主題的網路各方意見
檔名應該標示實際寬高,還是只標示大小?
取決於要辨識的是實際尺寸,還是兩個版本的相對大小。一名使用者表示,處理圖片時會把寬高帶入檔名;如果只有兩種尺寸,則用 _s 和 _b 後綴。前者可從名稱讀出尺寸,後者較簡短;這是個人做法,不是通用規定。
檔名已有 thumbs,還需要再加一次縮圖標記嗎?
如果原有的 thumbs 已經表示縮圖,可以考慮不再重複加入相同意思的字,再選擇用寬高或其他標記區分版本。討論中有使用者的範例把 thumb 與寬高放在同一檔名,但材料沒有規定 thumbs 必須保留或刪除;重點是自己能清楚辨識各版本。
圖片檔名一定要用英文並包含關鍵字嗎?
不一定。一名回覆者建議參考 Flickr,使用英文、包含關鍵字,並避免檔名過長;這可作為安排名稱時的參考,但材料沒有提供 Flickr 的具體命名規格,也不足以證明英文或關鍵字是平台要求。是否採用,仍可依網站的辨識需求決定。
參考資料
- 網站圖片不同size的jpg圖檔的命名規則www.mobile01.com — 本文論述的參考來源。
- 網站圖片不同size的jpg圖檔的命名規則www.mobile01.com — 討論:圖片檔名一定要用英文並包含關鍵字嗎?
- 網站圖片不同size的jpg圖檔的命名規則www.mobile01.com — 討論:檔名應該標示實際寬高,還是只標示大小?;檔名已有 thumbs,還需要再加一次縮圖標記嗎?


一起討論 0 則留言
你遇到什麼狀況?留下問題或實作經驗,一起找到下一步。
目前還沒有留言,歡迎開始第一個討論。