網站圖片怎樣優化

20150313-8

照片的優化一直是部落客們最頭大的問題,要有好的解析度就得把照片做得大張一點,那就得犧牲網站的速度,要有比較快的瀏覽速度,就得犧牲照片的解析度,是否有什麼方法可以魚與熊掌都兼得呢?阿腸就來分享一下小撇步讓各位照片擁有清晰的解析度又有不會太差的瀏覽速度。

挑選對的軟體編修照片

網路上有許多免費的照片處理軟體,部落客只要按幾個按鈕就可以完成自己想要的特效或者縮好尺寸,但是不同的軟體對於照片的處理方法還是有差異的,如果真要阿腸推薦的話,Adobe的影像處理軟體還真是盛名之下無虛士,一樣的照片尺寸Adobe的處理過的照片就是比較清楚,如果你有預算限制的話,阿腸推薦PC版的GIMP、MAC版的Pixelmator,或是PC跟MAC都有支援的Krita也是不錯的選擇。

照片尺寸並非越大越好

網頁上的照片最清楚的尺寸其實是1比1的尺寸,例如你的照片呈現是960*500,那你在縮放照片時請記得縮小到剛剛好960*500,有許多人會故意把大於960*500的照片上傳上到網站上再讓網頁自動縮小照片,這其實不會讓照片變得更清楚。

不要使用優化外掛或服務

網路上有許多教學推薦照片上傳時可以使用一些網路上的照片優化服務,或者利用一些外掛來優化部落格上的圖片,這些其實都是比較偷懶的方法,雖然在DEMO上似乎都看不出什麼差異,但是在好一點的螢幕上還是可以分辨出品質變差的差異,如果妳真的很在意照片的品質,阿腸建議千萬不要使用這一類軟體或外掛。

選擇正確的圖片格式

不知道從什麼時候開始,有越來越多部落客喜歡把照片儲存成PNG格式,其實這個格式並不會真的讓圖片變得更加清楚,反而會讓圖片變得更加肥大並拖慢網頁的瀏覽速度,JPG才是目前照片儲存的王道格式(寫這篇文章時還沒有被取代的可能,所有什麼媒體號稱的未來格式都還沒完全成熟),在儲存時請不要選擇100%的清晰度,只要選擇80%的清晰度即可,因為這最後20%的差異已經差異到微乎其微了。

挑選正確的圖片儲存空間

最後這一點大家一定要非常注意,不然就算上述的步驟你都注意到了也是前功盡棄,一般把照片上傳到自己的網路空間的人比較不會發生這一類的事情,但是還是要注意你使用的網站版型或外掛是否有自動裁切生產圖片或自動優化圖片的功能(例如痞客邦),或者有的CDN也會有把圖片重新優化的功能,如果有上述問題的話建議關閉相關功能。

如果你的圖片是自己選擇網路相簿的空間,有些空間也會有自動優化圖片的功能,如果要阿腸推薦佛心來著的網路相簿空間,Flickr是唯一真心推薦的,畢竟它是以高解度攝影聚集地起家的空間,絕對適合儲存和展示高解析度的照片。

創用 CC 授權條款
WordPress架站百寶箱阿腸製作,以創用CC 姓名標示-非商業性-禁止改作 4.0 國際 授權條款釋出。

發表迴響