如何減少GIF文件大小以獲得更好的網站性能

低端的GIF正在復蘇,因為隨著智能手機使用的不斷增加以及有限的帶寬用戶已經期待幾乎即時的加載時間。 您的網頁圖片越小,您的圖片加載速度就會越快,並且您的訪問者會越快樂。 另外,許多網站對廣告橫幅的大小有限制。

GIF圖像和網絡

GIF圖像不能被視為一種適合所有人的解決方案。 GIF圖像最多有256種顏色,這意味著如果您不小心,可能會出現嚴重的圖像和顏色退化。 GIF文件格式在很多方面都是傳統格式,可以追溯到網絡的早期版本。 在推出GIF格式之前,網頁圖像是黑白色的,並使用RLE格式壓縮。它們於1987年首次出現在Compuserve發布該格式作為網頁圖像解決方案時。 那時,桌面上出現了顏色,網絡被連接到電話線的調製解調器訪問。 這就需要一種圖像格式,使圖像足夠小,以便通過電話線傳送到網絡瀏覽器。

GIF圖像非常適合使用有限調色板(如徽標或線條圖)的銳邊圖形。 雖然它們可以用於照片,但縮小的調色板會將圖像引入到圖像中。 儘管如此,毛刺藝術運動和cinemagraph的興起也引發了對GIF格式的重新興趣。

如何減少GIF文件大小以獲得更好的網站性能

這些提示將幫助您盡可能縮小GIF。

  1. 裁剪圖像周圍的任何額外空間。 減少圖像的像素尺寸是減少文件大小的唯一最有效的方法。 如果您使用Photoshop,Trim命令適用於此。
  2. 準備gif圖像時,可能需要減小輸出尺寸。
  3. 減少圖像中的顏色數量。
  4. 對於動畫GIF,請減少圖像中的幀數。
  5. 如果您使用Photoshop CC 2017,則可以使用“導出為”菜單項創建GIF文件。 選擇“ 文件”>“導出為...”,然後在菜單打開時選擇GIF作為文件格式並減小圖像的物理尺寸(寬度和高度)。
  6. 如果您使用Adobe Photoshop Elements 14,請選擇文件>保存為網頁。 這將打開另存為對話框的對話框,該對話框也在Adobe Photoshop CC 2017的File> Export> Save for Web(Legacy)中找到 。 當它打開時,您可以應用抖動,減少圖像的顏色和物理尺寸。
  7. 避免抖動。 抖動可能會使某些圖像看起來更好,但會增加文件大小。 如果您的軟件允許,請使用較低級別的抖動來節省額外的字節。
  1. 某些軟件具有用於保存GIF的“有損”選項。 該選項可以顯著減小文件大小,但也會降低圖像質量。
  2. 不要使用隔行掃描。 交錯通常會增加文件的大小。
  3. Photoshop和Photoshop Elements都會顯示下載時間。 不要理會它。 它基於使用56k調製解調器。 如果您從彈出式菜單中選擇一個電纜調製解調器,則會顯示一個更有效的號碼。

提示:

  1. 避免無用的動畫。 過度的動畫不僅會增加網頁的下載時間,還會讓許多用戶感到分心。
  2. 具有純色和水平圖案的大塊GIF圖像比具有色階,柔和陰影和垂直圖案的圖像壓縮得更好。
  3. 在GIF中減少顏色時,如果將數字顏色設置為這些選項的最小可能值,則會獲得最佳壓縮:2,4,8,16,32,64,128或256。

由湯姆格林更新