優化你的圖片使用
, O. _, G8 _3 C# v. t+ q4 K" C# M* z8 G g
圖片就像你網站很直觀的零件,但是你依然可以優化它們。所有的圖片你都可以有一個很直接的文件名和一個「alt」屬性,這兩者你都可以好好地加以利用。
) |. B, Z1 }; k1 V g ~
- ]( Y0 F- h8 X7 c5 U) g如果你的圖片出於某種原因無法顯示,」alt」屬性允許你為它添加一個替代文字。
; d# S% y; }0 A4 b5 L% N s/ V4 v2 K% Q- o7 \ g
" G$ D8 F& |. d( g! K
4 ?6 K: H; q; Z
在我們這張圖片的」alt」屬性給出了一個簡練卻精確的描述。
& A: x; P$ \, G. P3 t& B& Y! L
- [2 M: k3 H3 ^4 D為什麼使用這個屬性呢?如果你的用戶瀏覽你的站點使用的是不支持圖片的設備,或者其它某種技術,比如說屏幕閱讀器,」alt」屬性在這時就大有用處了,它可以為你的圖片可以一些信息。6 A, k) p7 y2 i3 h
: s! o+ I w+ p' t( B
5 z5 ~) @! U/ n% a8 L* e( K0 w+ g
/ A9 g* h. l1 [" X* O出於某種原因我們這張圖片就沒有顯示出來,但至少替代文字顯示出來了。
( L3 s- l: X4 Q( a5 E1 G
: `. z2 N: a+ p& b) C) J, x! _使用」alt」屬性的另一個原因便是你把圖片作為鏈接時,圖片的替代文字將會被當作一個鏈接的錨文本處理。然而,當文本鏈接可以勝任相同功能時,我們並不推薦為你的網站導航使用太多的圖片鏈接。最後,可以試著優化一下圖片的文件名和替代文本,使得像Google圖片搜索這樣的搜索服務能夠更輕鬆地讀懂你的圖片。0 z$ e7 K8 D4 A9 @
" E6 L" e. K) S8 a* T4 J
圖片優化實戰經驗5 I) d& l% X5 Q3 n( N& J
3 N1 t @, q2 A/ ? 1. 為圖片的文件名和替代文本使用簡練但很具描述性的文字——就像網頁其它優化目標一樣,文件名和替代文本在短小精練時最好。只是需要避免:8 ~& Q% Y4 P' d& S2 E5 z1 W
* 使用像」image1.jpg」,」pic.gif」,」1.jpg」這類自動生成的文件名。(一些含有成千上萬圖片的網站可能就會考慮使用這種命名方式。)
7 }. V& j- f6 W6 l6 f * 把文件名寫得極其冗長。& J) X- R3 N; `* ]
* 在替代文本裡大量堆砌關鍵詞或者直接複製粘貼一整個句子。
" ^2 j; Y# |3 D# Z. U 2. 把圖片作為鏈接時為它們添加替代文本——如果你決定把一張圖片作為一個鏈接,替代文本可以使Google很容易地明白你將指向網頁的內容。試著想像一相你在為文本鏈接添加錨文本時的情景就明白了。但下面的情況你可能需要避免:3 c/ X5 g& ]. {* n/ D% W
* 把替代文本寫得太長,以至於被當成垃圾處理。4 K& M' @) J% M8 G& U. U
* 為你的整個網站導航都使用圖片來表現。' d7 b5 c% |- @
3. 為圖片專門劃分一個存儲目錄——拋棄那些交叉整個域名的目錄或者子目錄來存儲圖片的方式,考慮使得一個單一的目錄來存儲它們(比如說brandonsbaseballcards.com/images/).這是對你圖片路徑的簡化。" n* p q5 @) Q4 ~$ ^" c) l" `
4. 使用常用地且被支持的文件格式——大部分瀏覽器都支持JEPG,GIF,PNG和BMP格式的圖片。讓你的文件擴展名和圖片格式匹配也是很重要的。 |
|