seo之google排名算法[民间版本]
博弈——我的工作与生活
2009/05/14 03:17 | by
要开始做切片了,公司的网页设计师问我针对seo方面代码有没什么特殊要求,我思考了很久,最后还是决定做一下“分外事”,虽然说是分外事有点不负责任,但我一向做事的原则是,把分内事做到极致,对分外事只看不碰.
这个处事原则我沿用了很久,有时候也觉得不妥偶尔似乎多管了一点“闲事”,但这次一心想着项目成功,就不理哪么多,还有一个理由是:友情协助,想到这点,于是书写如下:
SEO(搜索引擎优化)有很多工作要做,其中对代码的优化是一个很关键的步骤.
为了更加符合SEO的规范,对目前流行的CSS+DIV的命名规则整理如下:(以下部分为互联网整理,虽然我知道每个程序员都有自己书写代码的习惯,我记得这句话是你对我说的,但是——还是先看看吧)
//还是点一下原因:因为代码都是由26个字母和符号组成,搜索引擎的“蜘蛛”也是代码实现的程序,所以...
其他小技巧——Limxyz
1、内置css
将网页LOGO包含在CSS当中,然后用H1对关键词包括,并且做了H1的CSS修饰,这样下来,其实用户看到的是图片LOGO,而LOGO上很正常的显示了ALT,这里的ALT实际上就是你的刚才用H1包含的关键词.查看代码的时候,在源代码中找不到LOGO,而是只有用H1包含的关键词信息.
2、长css与css缩写
将它用一些缩写性质来替代就能够把代码减少为下面这样,两者的实际效果是完全一样的:
这里要说明的是搜索引擎的好感度,答案是后者,于是,付下以下列表——CSS缩写性质的列表以及它们所表示的常规性质.:
3、空白有必要吗?
先看代码!
代码示例在内容上相同,但是第二个要精炼得多.第一个:初学者,因为容易看懂,清晰,直观,出错容易调试.第二个:css修成者!
减少CSS样式表大小的方法是从文档里删掉大多数无用的空白.换句话说,将每条规则打破放进一行代码里,即把原来插入到代码里用来把每个性质／属性分割到不同行的换行符和缩进符删掉.
4.删掉注释
将注释从你的CSS代码里删掉是减少文件大小的另一种方式.尽管注释对于代码的阅读很有用,但是它无助于浏览器生成你的Web页面.很多Web建设者都习惯给每一行代码都加上注释,或者至少给每一条规则声明都加上.这样的慷慨注释在CSS样式表里是极少需要的,因为大多数CSS性质和属性都很容易阅读和理解.如果你对类、ID,以及其他的选择器都使用有意义的名称,什么叫做有意义的名称,文章一开始我就说了,你就可以省掉大多数的注释,同时仍然能够保持代码的可读性和可维护性.
还是说下原因吧!
第2、3和4点钟使用缩写性质、删除无用的空白、省略注释都能够在很大程度上减少你CSS样式表文件的大小.这反过来会对加速你Web网站速度的总体目标作出小的、但是可能会是显而易见的贡献.
不过声明一点,对于css写成后是要交接到下一位同事手中进一步开发的话,以上几点就有点麻烦了,seo还是工作交接方便,阅者自己取舍!
内文分页： [1] [2]
这个处事原则我沿用了很久,有时候也觉得不妥偶尔似乎多管了一点“闲事”,但这次一心想着项目成功,就不理哪么多,还有一个理由是:友情协助,想到这点,于是书写如下:
SEO(搜索引擎优化)有很多工作要做,其中对代码的优化是一个很关键的步骤.
为了更加符合SEO的规范,对目前流行的CSS+DIV的命名规则整理如下:(以下部分为互联网整理,虽然我知道每个程序员都有自己书写代码的习惯,我记得这句话是你对我说的,但是——还是先看看吧)
引用
页头:header
登录条:loginBar
标志:logo
侧栏:sideBar
广告:banner
导航:nav
子导航:subNav
菜单:menu
子菜单:subMenu
搜索:search
滚动:scroll
页面主体:main
内容:content
标签页:tab
文章列表:list
提示信息:msg
小技巧:tips
栏目标题:title
加入:joinus
指南:guild
服务:service
热点:hot
新闻:news
下载:download
注册:regsiter
状态:status
按钮:btn
投票:vote
合作伙伴:artner
友情链接:friendLink
页脚:footer
版权:copyRight
——————————————CSSID的命名————————————————
外套:wrap
主导航:mainNav
子导航:subnav
页脚:footer
整个页面:content
页眉:header
页脚:footer
商标:label
标题:title
主导航:mainNav(globalNav)
顶导航:topnav
边导航:sidebar
左导航:leftsideBar
右导航:rightsideBar
旗志:logo
标语:banner
菜单内容1:menu1Content
菜单容量:menuContainer
子菜单:submenu
边导航图标:sidebarIcon
注释:note
面包屑:breadCrumb(即页面所处位置导航提示)
容器:container
内容:content
搜索:search
登陆:login
功能区:shop(如购物车,收银台)
当前的(页面):current
登录条:loginBar
标志:logo
侧栏:sideBar
广告:banner
导航:nav
子导航:subNav
菜单:menu
子菜单:subMenu
搜索:search
滚动:scroll
页面主体:main
内容:content
标签页:tab
文章列表:list
提示信息:msg
小技巧:tips
栏目标题:title
加入:joinus
指南:guild
服务:service
热点:hot
新闻:news
下载:download
注册:regsiter
状态:status
按钮:btn
投票:vote
合作伙伴:artner
友情链接:friendLink
页脚:footer
版权:copyRight
——————————————CSSID的命名————————————————
外套:wrap
主导航:mainNav
子导航:subnav
页脚:footer
整个页面:content
页眉:header
页脚:footer
商标:label
标题:title
主导航:mainNav(globalNav)
顶导航:topnav
边导航:sidebar
左导航:leftsideBar
右导航:rightsideBar
旗志:logo
标语:banner
菜单内容1:menu1Content
菜单容量:menuContainer
子菜单:submenu
边导航图标:sidebarIcon
注释:note
面包屑:breadCrumb(即页面所处位置导航提示)
容器:container
内容:content
搜索:search
登陆:login
功能区:shop(如购物车,收银台)
当前的(页面):current
//还是点一下原因:因为代码都是由26个字母和符号组成,搜索引擎的“蜘蛛”也是代码实现的程序,所以...
其他小技巧——Limxyz
1、内置css
将网页LOGO包含在CSS当中,然后用H1对关键词包括,并且做了H1的CSS修饰,这样下来,其实用户看到的是图片LOGO,而LOGO上很正常的显示了ALT,这里的ALT实际上就是你的刚才用H1包含的关键词.查看代码的时候,在源代码中找不到LOGO,而是只有用H1包含的关键词信息.
2、长css与css缩写
引用
.sample1{
margin-top:15px;
margin-right:20px;
margin-bottom:12px;
margin-left:24px;
padding-top:5px;
padding-right:10px;
padding-bottom:4px;
padding-left:8px;
border-top-width:thin;
border-top-style:solid;
border-top-color:#000000;
}
margin-top:15px;
margin-right:20px;
margin-bottom:12px;
margin-left:24px;
padding-top:5px;
padding-right:10px;
padding-bottom:4px;
padding-left:8px;
border-top-width:thin;
border-top-style:solid;
border-top-color:#000000;
}
将它用一些缩写性质来替代就能够把代码减少为下面这样,两者的实际效果是完全一样的:
引用
.sample1{
margin:15px20px12px24px;
padding:5px10px4px8px;
border-top:thinsolid#000000;
}
margin:15px20px12px24px;
padding:5px10px4px8px;
border-top:thinsolid#000000;
}
这里要说明的是搜索引擎的好感度,答案是后者,于是,付下以下列表——CSS缩写性质的列表以及它们所表示的常规性质.:
引用
Background(背景):背景附件、背景颜色、背景图像、背景位置、背景重复
Border(边框):边框颜色、边框风格、边框宽度
border-bottom(底部边框):底部边框颜色、底部边框样式、底部边框宽度
border-left(左侧边框):左侧边框颜色、左侧边框样式、左侧边框宽度
border-right(右侧边框):右侧边框颜色、右侧边框样式、右侧边框宽度
border-top(顶部边框):顶部边框颜色、顶部边框样式、顶部边框宽度
cue(声音提示):前提示、后提示
font(字体):字体、字号、字体样式、字体粗细、字体变体、线高度、字体大小调整、字体拉伸
list-style(列表样式):列表样式图像、列表样式位置、列表样式类型
margin(空白):顶部空白、右侧空白、底部空白、左侧空白
outline(大纲):大纲颜色、大纲样式、大纲宽度
padding(间隙):顶部间隙、右侧间隙、底部间隙、左侧间隙
pause(暂停):后暂停、前暂停
Border(边框):边框颜色、边框风格、边框宽度
border-bottom(底部边框):底部边框颜色、底部边框样式、底部边框宽度
border-left(左侧边框):左侧边框颜色、左侧边框样式、左侧边框宽度
border-right(右侧边框):右侧边框颜色、右侧边框样式、右侧边框宽度
border-top(顶部边框):顶部边框颜色、顶部边框样式、顶部边框宽度
cue(声音提示):前提示、后提示
font(字体):字体、字号、字体样式、字体粗细、字体变体、线高度、字体大小调整、字体拉伸
list-style(列表样式):列表样式图像、列表样式位置、列表样式类型
margin(空白):顶部空白、右侧空白、底部空白、左侧空白
outline(大纲):大纲颜色、大纲样式、大纲宽度
padding(间隙):顶部间隙、右侧间隙、底部间隙、左侧间隙
pause(暂停):后暂停、前暂停
3、空白有必要吗?
先看代码!
引用
h1{
font-size:x-large;
font-weight:bold;
color:#FF0000;
}
font-size:x-large;
font-weight:bold;
color:#FF0000;
}
引用
h1{font-size:x-large;font-weight:bold;color:#FF0000}
代码示例在内容上相同,但是第二个要精炼得多.第一个:初学者,因为容易看懂,清晰,直观,出错容易调试.第二个:css修成者!
减少CSS样式表大小的方法是从文档里删掉大多数无用的空白.换句话说,将每条规则打破放进一行代码里,即把原来插入到代码里用来把每个性质／属性分割到不同行的换行符和缩进符删掉.
4.删掉注释
将注释从你的CSS代码里删掉是减少文件大小的另一种方式.尽管注释对于代码的阅读很有用,但是它无助于浏览器生成你的Web页面.很多Web建设者都习惯给每一行代码都加上注释,或者至少给每一条规则声明都加上.这样的慷慨注释在CSS样式表里是极少需要的,因为大多数CSS性质和属性都很容易阅读和理解.如果你对类、ID,以及其他的选择器都使用有意义的名称,什么叫做有意义的名称,文章一开始我就说了,你就可以省掉大多数的注释,同时仍然能够保持代码的可读性和可维护性.
引用
h1{/*Heading1style*/
font-size:x-large;/*x-largesize*/
font-weight:bold;/*Bold*/
color:#FF0000;/*Red*/
}
font-size:x-large;/*x-largesize*/
font-weight:bold;/*Bold*/
color:#FF0000;/*Red*/
}
还是说下原因吧!
第2、3和4点钟使用缩写性质、删除无用的空白、省略注释都能够在很大程度上减少你CSS样式表文件的大小.这反过来会对加速你Web网站速度的总体目标作出小的、但是可能会是显而易见的贡献.
不过声明一点,对于css写成后是要交接到下一位同事手中进一步开发的话,以上几点就有点麻烦了,seo还是工作交接方便,阅者自己取舍!
内文分页： [1] [2]
