優化你的圖片使用
0 H' j, E- Q3 r6 Q
% }# \' j: K' K# n7 P X* `' i圖片就像你網站很直觀的零件,但是你依然可以優化它們。所有的圖片你都可以有一個很直接的文件名和一個「alt」屬性,這兩者你都可以好好地加以利用。$ g P5 l1 Q1 d0 Q
) _2 E+ S* d+ _& u: S9 R
如果你的圖片出於某種原因無法顯示,」alt」屬性允許你為它添加一個替代文字。% b( D f! P: _8 q2 w
9 [% J/ U8 R7 X: p 8 S& |' z& D7 `8 X& g
Q5 c" m4 c& L0 e, t
在我們這張圖片的」alt」屬性給出了一個簡練卻精確的描述。
: T) I' j4 |& s
7 D6 A; t9 ?. I+ P& m/ B! H: E為什麼使用這個屬性呢?如果你的用戶瀏覽你的站點使用的是不支持圖片的設備,或者其它某種技術,比如說屏幕閱讀器,」alt」屬性在這時就大有用處了,它可以為你的圖片可以一些信息。
% c5 x& A7 h6 M3 p! i2 a( A) \# y9 |8 r; l

6 N6 l% V& i) Z8 J8 b, g3 x6 B
. W( ]5 g+ n* M- j* S出於某種原因我們這張圖片就沒有顯示出來,但至少替代文字顯示出來了。( m4 `; _# g! P7 t) y
) a# l+ ~+ r6 @6 j. r
使用」alt」屬性的另一個原因便是你把圖片作為鏈接時,圖片的替代文字將會被當作一個鏈接的錨文本處理。然而,當文本鏈接可以勝任相同功能時,我們並不推薦為你的網站導航使用太多的圖片鏈接。最後,可以試著優化一下圖片的文件名和替代文本,使得像Google圖片搜索這樣的搜索服務能夠更輕鬆地讀懂你的圖片。
! U4 e7 W, F3 t+ V% |8 l- M. o
7 n6 U" e- I# Y2 s圖片優化實戰經驗+ @" L9 M2 h8 ^0 E$ @+ z0 z
7 v- k; |: h! x4 U' F5 J3 v 1. 為圖片的文件名和替代文本使用簡練但很具描述性的文字——就像網頁其它優化目標一樣,文件名和替代文本在短小精練時最好。只是需要避免:
; I( k' |5 u. b8 `0 {6 h * 使用像」image1.jpg」,」pic.gif」,」1.jpg」這類自動生成的文件名。(一些含有成千上萬圖片的網站可能就會考慮使用這種命名方式。); k1 X; S6 c( q& j: d( H7 i
* 把文件名寫得極其冗長。& h- s! z6 b. w4 C/ Y- t3 C
* 在替代文本裡大量堆砌關鍵詞或者直接複製粘貼一整個句子。
1 _* m7 n9 F6 \+ M 2. 把圖片作為鏈接時為它們添加替代文本——如果你決定把一張圖片作為一個鏈接,替代文本可以使Google很容易地明白你將指向網頁的內容。試著想像一相你在為文本鏈接添加錨文本時的情景就明白了。但下面的情況你可能需要避免:
7 ?. s: u: V) O! A8 R * 把替代文本寫得太長,以至於被當成垃圾處理。' k0 s& ?8 i9 r: X8 j$ a
* 為你的整個網站導航都使用圖片來表現。
* m' I3 z' m; Y" S. u9 U 3. 為圖片專門劃分一個存儲目錄——拋棄那些交叉整個域名的目錄或者子目錄來存儲圖片的方式,考慮使得一個單一的目錄來存儲它們(比如說brandonsbaseballcards.com/images/).這是對你圖片路徑的簡化。
# I* j% ]* W) n+ |/ Z 4. 使用常用地且被支持的文件格式——大部分瀏覽器都支持JEPG,GIF,PNG和BMP格式的圖片。讓你的文件擴展名和圖片格式匹配也是很重要的。 |
|