|
|
代码设置不妥不仅延长网页加载时间,也严重影响蜘蛛程序对网页内容的抓取.通过对网页代码进行清减去掉臃肿杂乱的代码,减小网页文件大小,能够加快网页加载速度,让蜘蛛快速索引到重要内容.整个网页最好不要超过 30K,文字内容最好5K-10K 之间,Google 只对内容的前5000 个字进行索引.7 I! @9 n y! \ i
4 I$ ~* s1 I4 H( w
网页减肥重点涉及以下几个要点:; z6 q& J% @* a9 M& h T: q4 ?! l) A' f
9 l8 k5 j, z4 X6 W0 Q
1.CSS 样式: O! M% R* } K$ w) U" T1 g7 f
' G2 f$ U" p6 n% y8 k q6 |
网页制作应通过 CSS(层叠样式表单)来统一定制字体风格.例如:
6 R8 a) W a! @3 d
% @. q+ g, K+ o- O t <b style="color:red;font-size:16px;">测试</b>$ A( B3 ]: ^( C) S& V2 J
z# \9 r- R7 U7 @1 K' c0 C <div id="divmain" style="font-size:12px;">DIV</b>
: [& N+ O; r2 l% W+ M0 i
, q& T: y$ f6 A <div style="color:red;"> 红色 <b style="color:green;">绿色</b> </div>6 Y p0 L/ \. X" X# k7 D) C5 G
2 `( _! q. q% G8 H M8 e
----------------------
% R* S- O( g" m6 }) H9 w, ]; F; I" A j f4 U
<style type="text/css">! A/ o8 ~! o8 W7 N/ ]
4 u) O; H7 O& c
b { color:red;font-size:16px; } /*通用对象*/" g9 x3 a: ~6 P I
" s+ a3 G! w8 n% r #divmain {font-size:12px;} /* ID 对象 */6 n6 r( X# Z3 m4 [. e! U
3 n. t, J( {3 g6 b* A: { .red {color:red;}/* 定制类别 */
P3 Q/ v- B* g0 W6 p
4 L" y1 K9 k8 o& d" _. k0 N .red b {color:green;}/* 定制类别下的 通用对象*/1 ]% z- @# N! Z1 P- n
/ ~7 P& l- g( e# |# H </style>
# G- U3 ]6 c6 L7 t
% D6 x7 |6 e: ]' @ <b>测试</b>; O9 E5 r+ Z! R' Y) D2 p1 x! q7 |
% K) Q1 B0 O2 j2 Z
<div id="divmain">DIV</b>4 c; } N: {/ Q. g' S1 u' T' A
( ~: p8 ?9 [: V: ~
<div class="red"> 红色 <b>绿色</b> </div>5 f) p9 `( s( R' v; J
) X# P9 r' m1 o) W* X( d+ t
CSS 减肥示例文件 把文字的字体、字号、颜色、背景色等统一起来,不用对每段文字单独进行格式定义,从而减少大量重复性标签.注意把所有css文件单独存放在命名为css的外部文件中.5 j7 l3 K0 L2 j( i! |
+ t8 e+ l, N- A8 P8 x 语法:<link rel="stylesheet" type="text/css" href="/common/client.css">
4 R' @7 c$ H- L7 D. `) @4 U* f3 u2 q8 f% Y+ @7 O
作用的优先级:自身的style属性> 页面的内部style对象> 页面外部css文件.) B9 T1 ?% a1 N) A& O n5 g0 J9 @
5 F2 M4 F% {' u 下载:css帮助4 K2 D t. u( v$ c. C8 d( H3 V2 ~- q
$ v4 _+ t) I6 K' } [: j1 s& x 2.JavaScript :( F. L3 h0 \; f$ C& N
M( C) h7 w+ f3 {, L5 n) M E3 ^ 1. 简化js 中的函数名称和变量.( P0 ]0 ~8 ?$ | M h1 m; {/ d
" s2 O' A' u2 |/ q# ?' K1 H
例如:Google,里面的函数名称只有 1 个或者 2 个字符.9 E" ]$ F. a& @8 g+ `# j8 E; `
0 g3 V5 @; n7 L3 b- [' Z. ~6 u! ] 2. 将网页的公共部分转换为脚本并存于js 文件里.这样可以减少文件大小,加快下载速度,同0 V5 C. N, [, ?" w* l
+ e4 A0 P0 u" H2 c$ S
时也方便管理.不过不能将导航等等优化的关键代码转换成js ,否则搜索引擎搜索不到.4 D# r5 R u$ _3 N
2 M/ Y2 V5 G. {* y0 N 转换方式:1 N# S3 L# ^* Q% a2 `9 C3 _3 j
# m2 N7 D4 `% s$ F
原来:<h1>天天收藏夹</h1>
' N$ q$ U X9 @: R, r& |# `% G# x) @
脚本:document.write("<h1>天天收藏夹</h1>");
' `, A. j' Y [; l {
9 N+ x0 q6 j8 b; R$ y1 O6 j 例如:华军软件园 源代码,将标题、导航等等都放着js 文件里,将导航放在js 里面就不太好了.8 C3 d% f* j3 q
8 Z( Z, L, c+ ?, o4 v 3.使用 base 标签:2 y: y/ s5 z0 p5 d+ `5 H2 D
* k* |/ |5 R5 U, a# P
Base 标签是一个全集控制的标签." |, Y ?, K1 \( U- K% x
9 ~# k( j( m9 [. E& P2 l( w 比如:
; I0 G: G- D5 t+ f+ [' c2 C) n. L2 a' N6 B. y3 G3 H
<A HREF="http://www.7769999.com/html/nanxingke/ " target="_blank">厦门妇科医院</A> ?0 U! U/ {4 i+ T! J
1 N$ j! O% b2 K( i+ U" { <A HREF="http://www.7769999.com/html/zaoxie/" target="_blank">厦门妇科医院</A>/ G( G4 ?, ], ~# V, P( f
; @2 Q5 q% S$ H+ x) m8 n) C! c 其中 http://www.7769999.com 和target="_blank": 多次重复,增加无用的代码.
8 F% E# Z' H$ ^- v! Y$ ^; n0 ~, }7 e' F& x
修改为:# j. Q4 |: W( X( W
s O* }# g! t/ n* t <head>
, w( {$ h2 U" \8 u: g: a# w
9 ` n2 q& x3 q; L Y' j <base href="http://www.7769999.com/" target="_blank">
9 [) e; i1 m# S; W3 A
$ e, j2 \9 _. ] </head>5 p0 I+ E- O Z" G- o6 y
8 ]3 R; i. N* y3 G2 P5 r% b3 i <body>8 t+ `7 o! r' Z: ?! b1 u
* o' n# W, c9 t: A <a href="/html/nanxingke/">厦门妇科医院</a>1 f- Y; w* Q9 @
# `8 z2 j. {3 s! l! ]
<a href="/html/zaoxie/">厦门妇科医院</a>& B, U% A- U& p, ~+ k' g
, |2 c2 ^4 K* B+ ^
</body>
) s0 ?) q2 j% Y6 I& d! n* o7 |) ^! d9 @$ [
4.慎用网页减肥工具8 Q, }7 Y: m) k% f! ^, q
: {- v& f3 j3 J7 H1 d5 b
通常的网页减肥工具,对 htm 减肥具有一定的破坏性,常常为了减肥将标签的 后半个标签删除,4 u5 ?6 ]5 M1 R& B4 J) p
) r! i# q- a* f- j$ D. e 造成网页的不完整.# Y1 U2 e4 F$ S& B
G% E- ?# s9 E3 a! i2 }* A
处理前:<table><tr><td>第一行</td></tr><tr><td>第二行</td></tr></table>
+ |/ ]( H D1 n, w" `! Y
' `7 Y9 s7 x% R. N# h 处理后:<table><tr><td>第一行<tr><td>第二行</table>
) x' o3 |+ x, r+ Q# r6 l4 M# x2 \" _9 a; m: V' ]
处理后 </td></tr> 被去掉了,使页面不完整.
9 i7 `% Z5 g9 s- _2 B: P
% B" j' ~6 N" F; | U* r* l) [ 5.删除空格和回车" I8 `* b: q _
" T3 x% u2 \2 ~. U3 R
如果要更加苛刻的减肥,那最后一步就是删除空格了,还可以使文件大小下降很多.
, k# R" W2 J/ v. g
+ s8 [7 T1 J$ y9 q8 z+ i: r6 P 不过删除空格后的页面由于没有阶梯排列,将很难读懂.# Y/ Z7 R; Q, y
7 _1 d# d# Q5 p& W% c* \* a- R
例子:百度首页的代码就非常紧凑. |
|