免費參與·100+跨境活動 
免費下載·4000+跨境資料 
免費學習·2000+直播課程 
免費加入·15萬+賣家交流群 
2018-01-18 16:44
已收藏，可在
我的資料庫 中查看
外貿(mào)自建站中的圖片通常會起到吸引瀏覽者的目光，也能夠提高用戶的體驗，在搜索結(jié)果中也會出現(xiàn)在較為靠前的位置，更容易被點擊到，為網(wǎng)站帶來更多的流量，因此圖片優(yōu)化也是網(wǎng)站SEO的重要一環(huán)。
搜索引擎看不懂圖片，但是人看得懂啊，如果你的圖片有個性、或者好看，肯定會讓你的網(wǎng)站片名突飛猛進，并能為你帶來更多的點擊和流量。
想像一下當你的圖片與其他眾多茫茫大海圖片一起出現(xiàn)在搜尋結(jié)果中，瀏覽者第一個點擊的一定是最吸引人的圖片(最吸引人的圖片類似是搜尋排名第一的概念)，也會為你的網(wǎng)站帶來更多的瀏覽訪客。
一張圖片里蘊藏的信息是你難以想象的，很多人保存圖片時僅只會用無意義的數(shù)字字母作為名字，比如01、02…等等，樣也許在圖片命名的時候很輕松愉快，只要照著編號一直列表下去即。
不過現(xiàn)在Google的搜尋引擎功能非常強大，雖然目前還無法讀取出圖片內(nèi)的文字內(nèi)容(以后或許可以)，不過當搜尋引擎無法了解圖片內(nèi)容時，將會參考周圍文字內(nèi)容或是圖片檔案名稱作為圖片的搜尋結(jié)果。
所以一個好的圖片檔案名稱建議應該使用具有相關(guān)意義的名稱，會讓搜尋引擎更了解圖片所代表的意義有所幫助。
這里的大小并不只是指尺寸，還有圖片本身的容量，如果上傳到網(wǎng)站上每一張圖片都是2M、3M的話，同時都會影響到Google和用戶的訪問速度。
網(wǎng)站速度現(xiàn)在也是影響搜尋引擎排名的因素之一，而往往影響網(wǎng)站速度最大的原因就在于圖片的讀取，所以我們應該針對圖片做優(yōu)化，以幫助我們提升網(wǎng)站瀏覽速度及使用者體驗。而通常一般會透過下列兩種方法優(yōu)化圖片檔案大小:
a.圖片尺寸縮小為最適當?shù)拇笮?/strong>
網(wǎng)站常會有一種情況發(fā)生，例如網(wǎng)頁呈現(xiàn)圖片大小也許只要200px * 200px，不過常常卻使用遠大于這個需求的圖片尺寸，而再使用CSS去縮小圖片，這樣也許是可以減少一道縮小圖片的動作，不過對于網(wǎng)站讀取速度卻是一種負荷。
b.壓縮圖片大小
將圖片在不失真和影響品質(zhì)的情況下，壓縮至最小的檔案大小
可以到Google PageSpeed Insights幫你測試網(wǎng)站速度分數(shù)，它還會列表出網(wǎng)站頁面目前有哪些圖片需要做壓縮，并且提供下載壓縮過的圖片
網(wǎng)站的圖片如果使用Potoshop ，建議在檔案存檔時(儲存為Web用)，并將其壓縮至適合的品質(zhì)。
當然如果電腦沒有Potoshop的話，這邊也提供一些線上壓縮的網(wǎng)站連結(jié)
https://tinypng.com
https://compressor.io
Alt 對于圖片的優(yōu)化是非常重要，圖片的Alt 不只是圖片替代文字，更可以讓搜尋引擎在抓取圖片的時候了解圖片的主題內(nèi)容。
圖片Alt的設置并不應該堆疊關(guān)鍵字，也不建議過長，應該針對圖片的代表意思來準確的撰寫Alt，畢竟堆疊不相關(guān)的字就算使用者搜索到也不會點擊不相關(guān)的內(nèi)容，反而可能會被使用者檢舉，導致影響圖片收錄。
圖片的Alt 在Html 中的使用方式為:
<img src=”/web/20160719201100im_/http://www.awoo.com.tw:80/blog/2015/09/images-optimization/圖片網(wǎng)址” alt=”圖片標題”/>
搜索引引擎在判定圖片的主題內(nèi)容時，除了從圖片的檔名、圖片的Alt標簽還會從圖片附近的內(nèi)容做為參考，所以在圖片附近加上一段標題敘述，可以讓搜尋引擎更確定圖片的主題性。
當然為圖片加上一小段標題敘述，有助于搜索引擎判定圖片主題，建議在圖片標題敘述時應該是自然的，如果過度的使用來堆砌關(guān)鍵字，也有可能造成被判定為作弊行為，其中的掌握拿捏是很重要的。
而html 有一組新標籤元素專門用于圖片以及圖片標題，可提供大家參考
使用方法如下:
<figure>
<img src=”/web/20160719201100im_/http://www.awoo.com.tw:80/blog/2015/09/images-optimization/圖片網(wǎng)址” alt=”圖片標題”/>
<figcaption>圖片標題敘述文字</figcaption>
</figure>
