|
|
代码设置不妥不仅延长网页加载时间,也严重影响蜘蛛程序对网页内容的抓取.通过对网页代码进行清减去掉臃肿杂乱的代码,减小网页文件大小,能够加快网页加载速度,让蜘蛛快速索引到重要内容.整个网页最好不要超过 30K,文字内容最好5K-10K 之间,Google 只对内容的前5000 个字进行索引.
8 t! c. ^0 E4 N$ Y2 A/ }1 X) ?- I; A& ^
网页减肥重点涉及以下几个要点:$ E7 e9 d! z" E( O$ E7 v
6 }8 n( t1 E3 X5 B7 ^
1.CSS 样式
4 U2 m' U5 I3 I! x# J {
" u. q: t8 U5 b' r z3 g6 k) ` 网页制作应通过 CSS(层叠样式表单)来统一定制字体风格.例如:
' @2 p; G9 H5 w0 _: K ]" D% n6 w4 x3 X5 ~0 O; q& m
<b style="color:red;font-size:16px;">测试</b>
H3 X$ y) O/ ]6 l+ g: L* \! D* m9 i! M* Z) ?
<div id="divmain" style="font-size:12px;">DIV</b>$ p4 v$ f$ E e1 p5 t
+ ?. |' s( e& o <div style="color:red;"> 红色 <b style="color:green;">绿色</b> </div>, q8 P! Q: i' z& M( A; M
$ l* F8 Y) D# h+ A% o7 Y ----------------------7 j, J3 }" u; r& a+ l* Z" P0 G
! h/ l8 i/ p( \1 m0 ] <style type="text/css">
$ c0 c& l8 ~! d* w
: E# ^5 C' D, k; A3 r b { color:red;font-size:16px; } /*通用对象*/
7 G8 l1 j+ v: h1 I h" v
9 y |) l4 U$ r- k( z5 u+ W #divmain {font-size:12px;} /* ID 对象 */ b% _( T g/ Y+ j- k2 y
3 j/ m/ V ^" B h$ ]8 I .red {color:red;}/* 定制类别 */
. p B k" @. I
1 p$ I! _$ ?* j: e; z; V .red b {color:green;}/* 定制类别下的 通用对象*/' L( K' y' Y& P8 h
; Y+ H+ J$ I7 {" N
</style>
& E8 S5 |4 W& [, H
) M; ~: w4 F) T4 o <b>测试</b>! m I3 C7 Z i3 O; ]2 f
/ Q S, z3 X% E+ x# P; b% m/ G9 Q <div id="divmain">DIV</b>: B% E. R3 Q4 z4 u# y
# X; U: p U9 [ C4 ` |
<div class="red"> 红色 <b>绿色</b> </div>
4 S6 E- T4 f- C/ P6 ^1 b: m5 |" P9 L& X/ T: p
CSS 减肥示例文件 把文字的字体、字号、颜色、背景色等统一起来,不用对每段文字单独进行格式定义,从而减少大量重复性标签.注意把所有css文件单独存放在命名为css的外部文件中. c" z6 I1 i! ?* \) \7 _$ |& F' |/ L
. G( h& u3 D3 } 语法:<link rel="stylesheet" type="text/css" href="/common/client.css">
8 [# \7 w) Z& |) @- e! \ K/ E, U( W: y! r: J
作用的优先级:自身的style属性> 页面的内部style对象> 页面外部css文件.6 [1 i0 k+ K8 R; X% b1 k; R+ E
/ R, i2 s. y1 |
下载:css帮助
2 A, g) G4 G' G4 Z0 z5 S( t
" a J2 s& l% l' } 2.JavaScript :
) K1 U" \5 q- C7 v/ v% D8 U$ b
# I# N1 i% ^6 D$ J8 G8 ? 1. 简化js 中的函数名称和变量.; v' W1 D$ v( R9 V4 q8 |" [7 p
& M7 p* f1 d" {1 m5 A8 L! S 例如:Google,里面的函数名称只有 1 个或者 2 个字符.* u; K6 t S6 i" }
& b; w1 N- `. K/ J8 \ 2. 将网页的公共部分转换为脚本并存于js 文件里.这样可以减少文件大小,加快下载速度,同
$ `5 q( S9 l( H7 V; D$ T5 _) e$ z/ W
6 c a- R% F: g! S 时也方便管理.不过不能将导航等等优化的关键代码转换成js ,否则搜索引擎搜索不到.0 v: G/ P: ^# k4 U
& [- u2 I) I, d2 s8 a( b 转换方式:" i2 h- P' }. J# j4 U
/ G$ U) f8 Z( E& j6 c5 |* Z0 Q0 C
原来:<h1>天天收藏夹</h1>
1 t9 P# E# A6 ~/ l) l, ]/ F% E, o6 F ~6 L/ A2 y
脚本:document.write("<h1>天天收藏夹</h1>");6 F) Q! ~! r6 |& m: h
6 ~) w! I( M* z5 L3 f
例如:华军软件园 源代码,将标题、导航等等都放着js 文件里,将导航放在js 里面就不太好了.
2 ?5 N0 |+ U( P
/ y$ U- f* U2 X/ _ 3.使用 base 标签:
, w; F3 U9 d/ z7 [7 } S! W; S }9 p- m
Base 标签是一个全集控制的标签.0 s: s' p6 ]( |8 S" W: a7 ^/ o0 T
3 d+ h' ^$ q; l, v. I
比如:- @" b: v0 i( F9 o: M- Z: [* B, u
7 p2 d( l% }1 C7 z# i
<A HREF="http://www.7769999.com/html/nanxingke/ " target="_blank">厦门妇科医院</A>
$ ^( h7 h$ F# q% |9 O/ M+ u3 E! j6 T$ S1 @5 p
<A HREF="http://www.7769999.com/html/zaoxie/" target="_blank">厦门妇科医院</A>$ E5 U: r( M2 z4 @: K5 u; z' Y W4 _
# q) a' f% ?: o: {( E
其中 http://www.7769999.com 和target="_blank": 多次重复,增加无用的代码.
! w; h/ e( S, t- v( U S0 Y, g) N) ~' N/ L* \# \+ N% L
修改为:2 T) C0 `/ P! [! y
; U3 A+ }; H& L% X1 G
<head>
$ C! v4 c& i9 E" T4 t
2 |/ \% M7 g h, { <base href="http://www.7769999.com/" target="_blank">5 }+ Z9 Q G) _6 W% P
0 |- f9 @3 L2 g# A9 a* P" X' A </head>; K+ D/ M& G$ |$ ^4 c( j7 E
/ W, D @( Z( |: Q8 p; f
<body>
) S/ j3 x5 S) a. N4 j; U! l* |1 {$ z
<a href="/html/nanxingke/">厦门妇科医院</a>3 {: J; o! }" G! ]1 N6 [' I" ]
8 w7 K; ^: l& I5 ?3 W. K+ y: a
<a href="/html/zaoxie/">厦门妇科医院</a>
; r" p* h- L2 ^/ S4 j$ b
[# b& n+ w; p7 y' k4 A </body>3 }/ j7 g& @. \% Y
6 @# O! z! S8 Y' j0 L6 _ 4.慎用网页减肥工具
8 l8 X# b3 Z' B( ^ R. d( g5 m% H) [
& y9 ?, d3 h0 d$ e* R 通常的网页减肥工具,对 htm 减肥具有一定的破坏性,常常为了减肥将标签的 后半个标签删除,& Z( F0 j4 l2 [% q$ T
, q6 h# }8 V+ y4 p( g2 g) d4 \
造成网页的不完整.4 @8 b( v$ ^4 M) A
1 L# S: G5 y* q, l1 s. j0 G( ]+ B2 x 处理前:<table><tr><td>第一行</td></tr><tr><td>第二行</td></tr></table>% R0 f- }1 X$ B
! l; I( C% k' r5 D4 H6 v. \ 处理后:<table><tr><td>第一行<tr><td>第二行</table>6 Y ^* ?7 n3 [ f8 A. w
3 s) [) Y0 o+ H3 v" J 处理后 </td></tr> 被去掉了,使页面不完整.5 d+ K* ^4 e6 V! c+ \# n
$ x* |! l8 M1 {$ j; I, W. s0 o
5.删除空格和回车
* @' F8 E+ ~3 E* b" N. d; B# ]- |; ?* Q" k2 k' p+ |" `2 L% ]* P
如果要更加苛刻的减肥,那最后一步就是删除空格了,还可以使文件大小下降很多.* {3 n2 E6 p8 y
- v# l+ ]! s e+ ~: O
不过删除空格后的页面由于没有阶梯排列,将很难读懂.
7 p4 y, g& Y* B8 A/ D0 q8 s! R; u
& N# J; P6 Y' b8 P- y( O: Z 例子:百度首页的代码就非常紧凑. |
|
