SEO优化笔记
1,清理垃圾代码.
清理垃圾代码是指删除页面中的冗余代码，可以删除80%的冗余代码，垃圾代码主要指那些删除了也不会对页面有任何影响的非必要代码。
最常见的垃圾代码：空格
空格字符是网页中最常见的垃圾代码。但并不是指标签，而是有代码编辑环境下敲击空格所产生的符号，每个空格相当一个字符，那么也就是说，一个页面，空格就占页面体积的15%，100K的页面，有15K是空格字符。
空格字符最常出现 在代码的开始和结束处，还有就是空行中。
这些都是容易产生垃圾代码的地方。
消除这样的垃圾代码的方法就是选中代码然后按shift+tab键左对齐.
2，HTML标签
A，HTML标签转换
HTML标签的转换主要是指使用短标签替换在网页中有同样效果的长标签，例如：,<b>与<strony>两者都是对字体加粗但是<strong>却比<b>多了5个字符。如果一个页面出现上百个加粗标签，就会产生不少的冗余代码。
解决方法是：在制作html页面的时候，进行优化的选择使用的标签。
B，头部标签
<title>网站标题</title>
<meta name="keywords" content="网站关键字，多个关键字用分隔符分开，如 |，" />
<meta name="description" content="对网站的描述" />
C，表格，ur 等容器形式的标签
浏览器编译器遇到一个标签时，就开始寻找它的结束标签，直到它匹配上,才能显示它的内容.，所以当表，ur等容器形式的标签嵌套很多时,打开页面就会特别慢,这样就降低了用户体验了.
解决方法：在编写html的时候，尽量使一个一个容器独立，如果要嵌套的时候，一定要使其清楚、简介。
D，图片ait标签
<img src="图片地址" alt="图片关键字"/>
E, 合理 target="_blank"
合理而不频繁使用target="_blank" 是能够在一定程度上位网站带来回旋流量和点击。同时，在细节上使用 target="_blank" ，可以增强网站整体用户体验.
3，CSS 优化
A，Css调用
有3种方式：
A，直接在页面的<head>和</head>之间写css样式；如果内容少则影响不大，否则大大增加页面的体积，还占用了顶部的重要位置
B，直接在html标签上面定义css 样式；增加页面的代码量
C，引用css文件；
这三种方式中，最利于seo优化的是 c ，也就是 引用css文件
B，使用Reset但并非全局Reset
不同浏览器元素的默认属性有所不同，使用Reset可重置浏览器元素的一些默认属性，以达到浏览器的兼容。但需要注意的是，请不要使用全局Reset：
*{margin:0;padding:0;}
这不仅仅因为它是缓慢和低效率的方法，而且还会导致一些不必要的元素也重置了外边距和内边距。在此建议参考YUI Reset和Eric Meyer的做法。
C. 良好的命名习惯
无疑乱七八糟或者无语义命名的代码，谁看了都会抓狂。比如下面这样的代码：
.aaabb{margin:2px;color:red;}
我想即使是初学者，也不至于会在实际项目中如此命名一个class，但有没有想过这样的代码同样是很有问题的：
<h1>My name is <span class=”red blod”>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:right;margin-left:20px;}
.clear{clear:both;text-indent:-9999px;}
如果需要把这个段落由原先的左对齐修改为右对齐，那么只需要修改它的className就为alignright就可以了。
D.代码缩写
CSS代码缩写可以提高你写代码的速度，精简你的代码量。在CSS里面有不少可以缩写的属性，包括margin，padding，border，font，background和颜色值等，如果您学会了代码缩写，原本这样的代码：
li{
font: 1.2em/1.4em Arial, Helvetica, sans-serif;
padding:5px 0 10px 5px;
}
E.利用CSS继承
如果页面中父元素的多个子元素使用相同的样式，那最好把他们相同的样式定义在其父元素上，让它们继承这些CSS样式。这样你可以很好的维护你的代码，并且还可以减少代码量。那么本来这样的代码：
#container li{ font-family:Georgia, serif; }
#container p{ font-family:Georgia, serif; }
#container h1{font-family:Georgia, serif; }
可以写成:
#container{font-family:Georgia,serif; }
F.使用多重选择器
你可以合并多个CSS选择器为一个，如果他们有共同的样式的话。这样做不但代码简洁且可为你节省时间和空间。如：
h1, h2, h3{ font-family:Arial, Helvetica, sans-serif; font-weight:normal; }
G. 适当的代码注释
代码注释可以让别人更容易读懂你的代码，且合理的组织代码注释，可使得结构更加清晰。
7. 保持CSS的可读性
书写可读的CSS将会使得更容易查找和修改样式。对于以下两种情况，哪种可读性更高，我想不言而明。
H. 使用外部样式表
这个原则始终是一个很好的设计实践。不单可以更易于维护修改，更重要的是使用外部文件可以提高页面速度，因为CSS文件都能在浏览器中产生缓存。内置在HTML文档中的CSS则会在每次请求中随HTML文档重新下载。
I.避免使用CSS表达式（Expression）
表达式的问题就在于它的计算频率要比我们想象的多。不仅仅是在页面显示和缩放时，就是在页面滚动、乃至移动鼠标时都会要重新计算一次。给CSS表达式增加一个计数器可以跟踪表达式的计算频率。在页面中随便移动鼠标都可以轻松达到10000次以上的计算量。
J,代码压缩
当你决定把网站项目部署到网络上，那你就要考虑对CSS进行压缩，出去注释和空格，以使得网页加载得更快。压缩您的代码，可以采用一些工具，如YUI Compressor，利用它可精简CSS代码，减少文件大小，以获得更高的加载速度。
4，js调用
Js的2种调用方式：
A，直接写在页面，巨量的JS代码放到页面不但增加页面的体积,而且还会占用首页这样重量级位置...从而使得页面中相对重要的位置不能优先向搜索引擎展示
B，引用js文件（引用外部地址的js会影响打开网页的速度）；
第二种方式可取
SEO优化笔记的更多相关文章
- 一些关于SEO优化的笔记
高级搜索指令: 双引号:“xxx” 代表完全匹配的搜索 减号:-(减号前面必须是空格,后面必须没有空格)代表搜索不包含减号后面的词的页面 filetype:用于搜索特定文件格式(百度支持的文件类型:P ...
- 《大型网站SEO优化实践》学习分享
本文主要内容源自2013年阿里技术嘉年华中阿里巴巴周文君分享<大型网站SEO优化实践>.学习过后,受益匪浅,特作笔记,经常回顾吸收学习. 大型网站SEO的特点&优势&挑战 ...
- seo优化入门教程：影响关键词排名的因素
很多人都说网站优化,但是怎么个优化法?优化什么东西?很多人都不知道.虽然我们优化的是我们的网站,但是提升的却是我们的关键词排名. 我们不管去优化哪一个网站,得到的搜索结果,他都会去触发关键词排名的因素 ...
- 最详细的网站改版SEO优化指南：如何让排名不降反升
我知道,网站改版很是让人头疼.首先,这个过程需要很长时间还有大量工作要做,并且通常结果不会如你的预期.其次,改版确实有破坏之前为 SEO 所做努力的风险. 但不要因为通常网站改版带来排名下降就认为这是 ...
- 一个网站完整详细的SEO优化方案
根据自己的个人经验完成了这篇文章,希望对SEOer有点帮助,高手直接跳过,请勿喷水... 一个完整的SEO优化方案主要由四个小组组成: 一.前端/页编人员 二.内容编辑人员 三.推广人员 四.数据分析 ...
- SEO优化小技巧
/** * seo优化课程 * 先谢慕课网 */ /** * SEO基本介绍 * SEO与前端工程师 */ /** * SEO基本介绍 * 搜索引擎工作原理:输入关键字------查询------显示 ...
- 大型网站seo优化之行业网站seo优化具体操作思路
第一部分:站内优化 第二部分:站外优化 第三部分:内容建设 第四部分:网站完善 一.站内优化 1.站内结构优化 2.内链策略 3.站内细节优化 4.网站地图设置 5.关键词竞争度分析 5.关键词部 ...
- Lucene.net站内搜索—1、SEO优化
目录 Lucene.net站内搜索—1.SEO优化 Lucene.net站内搜索—2.Lucene.Net简介和分词Lucene.net站内搜索—3.最简单搜索引擎代码Lucene.net站内搜索—4 ...
- 根据网站所做的SEO优化整理的一份文档
今日给合作公司讲解本公司网站SEO优化整理的一份简单文档 架构 ########################################## 1.尽量避免Javascript和flash导航. ...
随机推荐
- hello world 驱动程序编写
操作系统课程设计选题 驱动程序的编写和安装. 经过一天多的努力,终于把我的第一个驱动程序模块成功编写并实现插入内核和移除,在这里把过程记录下来方便以后查看,也给其他为之困扰的朋友一个建议. 环境: ...
- eclipse远程调试
-Xdebug -Xrunjdwp:transport=dt_socket,address=127.0.0.1:8000Eclipse 菜单上的 Window > Preferences > ...
- JavaScript正则验证邮箱
正则表达式/^正则$/.test() <html> <head> <title>JavaScript</title> <meta charset= ...
- GTX 770 (GK 104)
上周的这个时候,NVIDIA GeForce 700系列的旗舰产品GTX 780正式发布,传闻已久的GTX 700家族终于来了!虽然没有任何新架构.新特性的旗舰卡发布总让人觉得少点什么.但从性能上来说 ...
- 每天学点GDB 12
本文介绍在archlinux环境下,如何进行内核使用gdb配合qemu进行调试. 1. 安装qemu 2. 编译linux kernel 选择最新的内核版本,规避gcc编译出错的问题具体步骤如 ...
- MySQL 数据库设计 笔记与总结（2）逻辑设计
[实例演示 —— 实体之间的关系] [逻辑设计的工作] ① 将需求转化为数据库的逻辑模型 ② 通过 ER 图的形式对逻辑模型进行展示 ③ 同所选用的具体的 DBMS 系统无关 [名词解释] 候选码可以 ...
- Javascript 笔记与总结（1-5）闭包
[例1] <script> function t1(){ var age = 20; function t2(){ alert(age); } return t2; } var tmp = ...
- Grand Theft Auto V 图形研究（2）
原文链接 http://www.adriancourreges.com/blog/2015/11/02/gta-v-graphics-study-part-2/ Level of Detail 如 ...
- 浏览器 user-agent 字符串的故事
你是否好奇标识浏览器身份的User-Agent,为什么每个浏览器都有Mozilla字样? 故事还得从头说起,最初的主角叫NCSA Mosaic,简称Mosaic(马赛克),是1992年末位于伊利诺伊大 ...
- Nutch相关框架视频教程--说明
PDF文档: Nutch大数据相关框架讲义.pdf Nutch1.7二次开发培训讲义.pdf Nutch1.7二次开发培训讲义之腾讯微博抓取分析 Nutch公开课从搜索引擎到网络爬虫 ======== ...