代码优化终极课代码优化实战演习Word文件下载.doc
《代码优化终极课代码优化实战演习Word文件下载.doc》由会员分享，可在线阅读，更多相关《代码优化终极课代码优化实战演习Word文件下载.doc（8页珍藏版）》请在冰豆网上搜索。
#ffffff"
背⺌景默认属性为白色
对于这些代码，可以利⺌用Dreamwea⺌ver的替换功能把他们替换成空白就可以了
3.注释语句
过多的注释语句不仅会占用大量的网页存储空间，而且还会稀释关键字的密度
4.长标签替换成短标签
比如，<
b>
和<
strong>
都是对字体加粗，起到的作用是一样的，但是<
比<
多5个字符
网页中多种不同的标签可以实现同样的效果但是为了网页的精简可以才要短标签，网页中常见的有以下几种
加粗<
对应<
斜体<
em>
i>
删除线<
strike>
s>
缩进<
blockquote>
对应<
ul>
2.Css等脚本优化（脚本优化）：
CSS学起来并不难，但在大型项目中，一个团队中不同的人在书写CSS风格上也有不同这样这个项目就变得难以管理，团队上就更加难以沟通，为此总结了一些如何实现高效整洁的CSS代码原则：
步骤/方法
1.使用Reset但并非全局Reset
不同浏览器元素的默认属性有所不同，使用Reset可重置浏览器元素的一些默认属性，以达到浏览器的兼容。
但需要注意的是，请不要使用全局Reset：
*{margin:
0;
padding:
}
这不仅仅因为它是缓慢和低效率的方法，而且还会导致一些不必要的元素也重置了外边距和内边距。
在此建议参考YUIReset和EricMeyer的做法。
/**清除内外边距**/
body,h1,h2,h3,h4,h5,h6,hr,p,
blockquote,/*structuralelements结构元素*/
dl,dt,dd,ul,ol,li,/*listelements列表元素*/
pre,/*textformattingelements文本格式元素*/
form,fieldset,legend,button,input,textarea,/*formelements表单元素*/
th,td,/*tableelements表格元素*/
img/*imgelements图片元素*/{
border:
mediumnone;
margin:
0;
/**设置默认字体**/
body,button,input,select,textarea{
font:
12px/1.5‘宋体’,tahoma,Srial,helvetica,sans-serif;
}
h1,h2,h3,h4,h5,h6{font-size:
100%;
em{font-style:
normal;
/**重置列表元素**/
ul,ol{list-style:
none;
/**重置超链接元素**/
a{text-decoration:
color:
#333;
a:
hover{text-decoration:
underline;
#F40;
/**重置图片元素**/
img{border:
0px;
/**重置表格元素**/
table{border-collapse:
collapse;
border-spacing:
2.良好的命名习惯
无疑乱七八糟或者无语义命名的代码，谁看了都会抓狂。
比如下面这样的代码：
.aaabb{margin:
2px;
color:
red;
我想即使是初学者，也不至于会在实际项目中如此命名一个class，但有没有想过这样的代码同样是很有问题的：
<
h1>
Mynameis<
spanclass=”redblod”>
Wiky<
/span>
/h1>
问题在于如果你需要把所有原本红色的字体改成蓝色，那修改后就样式就会变成：
red{color:
bule;
这样的命名就会很让人费解，同样的命名为.leftBar的侧边栏如果需要修改成右侧边栏也会很麻烦。
所以，请不要使用元素的特性（颜色，位置，大小等）来命名一个class或id，您可以选择意义的命名如：
#navigation{…}，.sidebar{…}，.postwrap{…}
这样，无论你如何修改定义这些class或id的样式，都不影响它跟HTML元素间的联系。
另外还有一种情况，一些固定的样式，定义后就不会修改的了，那你命名时就不用担忧刚刚说的那种情况，如:
.alignleft{float:
left;
margin-right:
20px;
.alignright{float:
right;
text-align:
margin-left:
.clear{clear:
both;
text-indent:
-9999px;
如果需要把这个段落由原先的左对齐修改为右对齐，那么只需要修改它的className就为alignright就可以了。
3.代码缩写
CSS代码缩写可以提高你写代码的速度，精简你的代码量。
在CSS里面有不少可以缩写的属性，包括margin，padding，border，font，background和颜色值等，如果您学会了代码缩写，原本这样的代码：
li{
1.2em/1.4emArial,Helvetica,sans-serif;
5px010px5px;
4.利用CSS继承
如果页面中父元素的多个子元素使用相同的样式，那最好把他们相同的样式定义在其父元素上，让它们继承这些CSS样式。
这样你可以很好的维护你的代码，并且还可以减少代码量。
那么本来这样的代码：
#containerli{font-family:
Georgia,serif;
#containerp{font-family:
#containerh1{font-family:
可以写成:
#container{font-family:
Georgia,serif;
5.使用多重选择器
你可以合并多个CSS选择器为一个，如果他们有共同的样式的话。
这样做不但代码简洁且可为你节省时间和空间。
如：
h1,h2,h3{font-family:
Arial,Helvetica,sans-serif;
font-weight:
6.适当的代码注释
代码注释可以让别人更容易读懂你的代码，且合理的组织代码注释，可使得结构更加清晰。
7.保持CSS的可读性
书写可读的CSS将会使得更容易查找和修改样式。
对于以下两种情况，哪种可读性更高，我想不言而明。
8.使用外部样式表
这个原则始终是一个很好的设计实践。
不单可以更易于维护修改，更重要的是使用外部文件可以提高页面速度，因为CSS文件都能在浏览器中产生缓存。
内置在HTML文档中的CSS则会在每次请求中随HTML文档重新下载。
9.避免使用CSS表达式（Expression）
表达式的问题就在于它的计算频率要比我们想象的多。
不仅仅是在页面显示和缩放时，就是在页面滚动、乃至移动鼠标时都会要重新计算一次。
给CSS表达式增加一个计数器可以跟踪表达式的计算频率。
在页面中随便移动鼠标都可以轻松达到10000次以上的计算量。
代码压缩
当你决定把网站项目部署到网络上，那你就要考虑对CSS进行压缩，出去注释和空格，以使得网页加载得更快。
压缩您的代码，可以采用一些工具，如YUICompressor，利用它可精简CSS代码，减少文件大小，以获得更高的加载速度。
3.SEO站内优化（整站优化）：
一、代码及标签优化
代码和标签的优化，主要从以下几个方面进行：
1、网站代码精简和CSS&
JS
2、网站标题标签（titile）设置合理化
3、网站关键词（keywords）设置合理化
4、网站描述（Description）设置合理化
5、网站H1/H2标签的合理优化
6、网站METE标签的合理优化
二、网站URL优化
1、网站页面的静态化处理（生成html）
2、网站扁平化层级结构
3、网站SEO定制文件名
4、网站导航的面包屑处理
三、网站内容优化
1、网站内容的原创性
2、网站内容的更新频率
3、网站数据库的总体数据量
不利于搜索引擎排名优化的因素：
1、JS代码
JS代码，建议尽量少用这种动态，会增加网页加载时间。
2、会隐藏的滑动条
还有一个就是常见的会隐藏的滑动条，我们不建议使用的。
除非是你的网站实在要实现某一些功能才迫不得已。
一般情况下是不建议大家使用的。
是不利于优化的。
滑动条的影响不大，但是会减分的。
比如说100分，你做一个滑动条减了你2分。
对不对?
表面上是影响不大，但是对于整个关键词排名来说，它是有影响的。
比如，你本来能排第一的，你排第二。
3、Flash代码
Flash代码，尽量的少。
另外不建议你在网站里做一个页面里面做过多的Flash。
你做一个就OK了，一个首页做一个就OK了。
不要所有的频道页都做。
这是不合理的。
特别是很多企业站。
4、隐藏代码
不要含有隐藏代码。
常见的隐藏代码，像很多地方的新闻门户啊，就是那种带链接的网站，一般都有。
一般都有那种就是滑动门。
像那种出售友情链接站，把它隐藏起来，点一下它才出来的那种，其实应该是做了一个CSS隐藏的东西。
这个，所有的动态都不建议做。
5、弹窗代码
最好在你的网站里面不要做前弹和后弹代码。
这些都是会被减分的。
当然了，这些不会有致命的危险。
但是它会减分。
前弹就是打开一个网站它会弹出一个网页，就是弹窗。
后弹就是我们关闭一个网页，它就弹出一个网页。
你关闭了，它弹出一个。
这两个都是影响的。
6、覆盖代码
覆盖代码。
这个也很危险。
就是你在百度上搜索一个词，你点开一个网页的时候弹出了一个新窗口。
同时你那个百度的窗口就变成了一个广告页。
他就覆盖了原来搜索引擎的搜索引擎页面，这叫做覆盖。
大家明白了吗?
这种覆盖是比较致命的。
7、JS留言本
不要过多地使用JS代码，比如说百度的留言本。
百度，那个做竞价，他一般都建议你添加留言本。
留言本的确有好处，能够留住一些客户的那个。
留
升级会员 