<code id="6mcsu"></code>
<li id="6mcsu"></li>
<li id="6mcsu"><dl id="6mcsu"></dl></li>
  • <code id="6mcsu"><tr id="6mcsu"></tr></code>
    或者

    圖片優化做的好也能給我們帶來不菲的流量

    作者:數風流人物 瀏覽:141 發布時間:2017-05-24
    分享 評論 0

    圖文并茂可以說是所有站長默認的創作方式,然而圖片過大對頁面的打開速度影響是很大的,由此才需要我們也給圖片做優化。

    圖片優化不僅僅是為了吸引潛在消費者,另一個目的就是增加圖片搜索所帶來的流量,又或是提升網站加載速度,圖片優化圖片優化起著至關重要的作用。說到圖片優化,最常用的就是給圖片加alt屬性,圖片壓縮等,這些只是比較粗線條的優化,想要做好圖片優化只是這樣是不夠的,遠遠沒有這么簡單,這只是開始。

    要做圖片優化,首先我們需要先給圖片減減肥。

    我們先來看看這些數據,大部分PC用戶不會等待超過3秒的網站加載速度,而在移動設備上則不會等待超過5秒鐘,5秒還沒有加載出來,結果就是用戶關掉頁面,還會給用戶留下不好的印象。

    亞馬遜發現如果他們的網站加載速度慢了1秒鐘,他們一年將損失16億美元。

    搜索引擎已經將網站加載速度列入了排名算法之中,如果你網站有大量的圖片致使網站非常臃腫,將嚴重影響網站加載速度,如果超過10秒鐘,那你等著和你的客戶說拜拜吧。

    有些理論說圖片的大小應該保持在70kb以下,這個到沒有明確的規格,有的時候為了保證圖片的清晰度,圖片稍微大點是在所難免的。個人覺得,不要用一個標準去限制每一張圖片的大小,我們的最終目的只是保證在不影響清晰度的情況下,盡可能的降低圖片大小來保證頁面的打開速度。

    不同的圖片格式對圖片優化也是有影響的。

    目前最流行的三種圖片格式就是:JPEG、GIF、PNG。

    JPEG (或者說 .jpg) 是最常用的圖片壓縮格式,支持最高級別的壓縮。通常,對于顯示要求比較高的圖片來說,JPEG格式展示的圖片效果較GIF和PNG有明顯的優勢。

    GIF (.gif) 的圖片顯示質量要比JPEG遜色很多,通常用作非常簡單的圖片展示,比如素材或者裝飾性圖案,gif也可以用來制作動畫。gif不適合用作高顯示質量的圖片。

    PNG(.png)圖片是比GIF更好的選擇,因為PNG圖片支持的色彩要比GIF多。和JPEG一樣,PNG反復保存也不會影響圖片質量,而且對于小圖來說,PNG占用的體積極小,PNG完美支持透明背景,一般logo或一般裝飾性圖案都會選擇PNG格式。注意PNG-24圖片體積是PNG-8版本的3倍,對待PNG你要十分小心,看仔細了。

    如下是一個例子,通過對比相同體積下(都是24kb)不同格式的圖片

    可以很清楚的看到,JPEG顯然是獲勝者,在同樣的體積下,GIF和PNG必須以犧牲圖片質量為代價。不過話又說回來,對于非常小的圖片來說(比如小于5K),PNG是比較好的選擇,相比GIF,PNG可以在體積很小的情況下依然不會讓圖片失真。

    對于那些對圖片質量要求極高的站長來說,JPEG毫無疑問是首選,絕對不要用GIF來當做產品大圖。不然的話文件尺寸會非常大不說,也沒有很好的辦法去壓縮它(一壓縮就失真)。可以用GIFs做動畫或是裝飾性小圖。

    PNG可以作為JPEG和GIF的替代,如果你想把產品圖片做成PNG格式,盡量用PNG-8而非PNG-24。PNG同時也擅長處理簡單地裝飾圖而只需很小的體積,PNG將會變得越來越流行。當然了,大部分的圖片編輯軟件可以轉換以上三種形式的圖片格式。

    如果你希望提供更大的圖片讓用戶欣賞,不建議將大圖直接放在網頁上然后用css將圖片縮小,雖然看上去圖片變小了,但是圖片的真實尺寸還是沒有變的,這會嚴重影響頁面加載速度。相反,你可以先放一張較小的圖片,然后提供查看大圖的功能,不管是點擊彈出大圖還是另外新頁面顯示,都是極好的。

    還有一些人會把一張大圖切成一張張的小圖做拼接,這樣做雖然可以讓圖片快速顯示,但這樣做會增加服務器的請求數,從而會影響網頁加載速度。所以,如果對圖片的要求非常高的話,建議為圖片專門配置專門的服務器。

    首頁顯示縮略圖是個不錯的選擇。

    盡可能壓縮縮略圖體積,縮略圖的圖片不要過分追求顯示質量,當用戶點擊到下一層詳情頁面的時候再給他一張高質量的圖片。

    不要為縮略圖設置alt標簽,我們并不希望搜索引擎索引的是縮略圖而應是詳情頁的高質量原圖。

    背景圖、按鈕圖,邊框圖等都可算作裝飾圖,作為一名SEOer,你需要仔細去檢查這些圖片的體積是否過大,是否會影響網站載入速度。

    如果只是一些邊框類的、或是簡單的樣式圖片,使用PNG-8或者GIF,可以創建非常好看的圖片并且只占幾百byte的體積。如果可能的話,盡量使用css來創建一些特殊效果,而非圖片。

    不建議為網站設置背景圖片,如果一定要有的話,在保證清晰度的前提下最大程度去壓縮體積。你還可以把背景圖當中鏤空或保持透明來壓縮體積。


    国模无码人体一区二区| 日韩人妻无码精品久久免费一| 无码中文字幕日韩专区视频| 人妻无码αv中文字幕久久琪琪布 人妻无码中文久久久久专区 | 国产成人精品一区二区三区无码 | 中文字幕乱偷无码AV先锋| 佐藤遥希在线播放一二区| 免费无码VA一区二区三区 | 日日麻批免费40分钟无码| 亚洲精品无码专区久久同性男| 亚洲国产一二三精品无码| 日韩亚洲欧美中文高清在线| 中文精品无码中文字幕无码专区| 乱色精品无码一区二区国产盗| 狠狠精品久久久无码中文字幕 | 亚洲精品无码永久中文字幕| 国产精品99无码一区二区| 亚洲精品无码av人在线观看| 无码人妻丰满熟妇区BBBBXXXX | 中文字幕一区二区三区在线不卡 | 7国产欧美日韩综合天堂中文久久久久| 国产亚洲精品无码拍拍拍色欲 | 超清纯白嫩大学生无码网站| 黄桃AV无码免费一区二区三区| 最近中文字幕视频在线资源| 中文有码vs无码人妻| 本免费AV无码专区一区| 日韩亚洲AV无码一区二区不卡 | 亚洲国产中文v高清在线观看 | 熟妇无码乱子成人精品| 亚洲日韩精品A∨片无码| 无码精品国产dvd在线观看9久| 久久亚洲中文字幕精品一区四 | 亚洲乱码中文字幕综合234 | 亚洲AV永久无码精品网站在线观看| 国产麻豆天美果冻无码视频| 国内精品无码一区二区三区 | 久久国产亚洲精品无码| 人妻丰满AV无码久久不卡| 国产Av激情久久无码天堂| 精品久久久无码中文字幕|