.Net C# Asp.Net 技术博客
.NET技术 Blog .NET c# software 穷则变,变则通,通则久 寂寞平淡
博客园
闪存
首页
新随笔
联系
管理
订阅
随笔- 300 文章- 2 评论- 3044
CSS关于SEO优化的细节
对于任何一个网站来说名字是SEO的首选,而H1标签是搜索引擎认为页面上最重要的文字部门,所以我们要把网站的名字放在H1中;问题是代表网站名字的通常是一个LOGO图片,而图片对于SEO来说是不友好的。请看下面jquery的首页的logo部分的图片和代码。
<
div
id
="jq-header"
>
<
h1
><
a
href
="http://jquery.com/"
>
jQuery: The Write Less, Do More JavaScript Library
</
a
></
h1
>
.
jquery的界面做的很棒,SEO也很棒。很显然图片的效果和Html是联系不起来的。上面的一小段html代码是欺骗搜索引擎用的,和显示根本不搭边。那么这里是如何让浏览器渲染出来的呢,大家都能猜到,是CSS,请看下面的一段CSS代码:
#jq-header h1 a
{
}
{
text-indent
:
-9999em
;
background
:
url(../images/logo_jquery3.png) no-repeat
;
width
:
116px
;
height
:
35px
;
font-size
:
0
;
display
:
block
;
border
:
0 !important
;
border-bottom
:
0
;
}
关键的地方有三处:
1. text-indent设定了一个很大的负数值,这个的效果就把Html中的那段文字藏到了您的显示器的左边几百米的地方,用来欺骗搜索引擎的文字就从浏览器的界面上消失了。
2. 只有这样还是不够的,还需要让用户从浏览器中看到LOGO图片,在CSS中肯定就是background了,注意url()括号里面的内容可以用引号也可以不用,如果不用的话就可以省掉俩字符.-:)
3. 光有上面的两步还是不够的,我们还需要让用户的鼠标放到LOGO上时的表现像放到一个链接上,显示一个小手,由于A标签的真实文本已经被移动到浏览器左侧几百米的地方了,所以浏览器不认为背景图片的地方有链接;这时候就用到了下面的width,height,display的设定。
分析到此为止,细节有时候很重要。 谢谢你的光顾。
我的微博地址是:
http://weibo.com/yukaizhao
我会把一些技术心得碎片写到微博中,欢迎关注。
标签:
css
,
seo
绿色通道:
好文要顶
关注我
收藏该文
与我联系
posted @ 2008-07-07 13:19
玉开
阅读(2687)
评论(21)
编辑
收藏
评论
2237208
回复
引用
查看
#1楼
2008-07-07 13:37
|
平淡无奇_LKC
辛苦了
回复
引用
#2楼
2008-07-07 14:02
|
benbenxxx[未注册用户]
不错!
回复
引用
查看
#3楼
2008-07-07 14:03
|
SOSOS's BLog
受教了...
回复
引用
查看
#4楼
2008-07-07 14:09
|
丁学
我觉得会适得其反,对于用户在页面上看不到的元素,现在的搜索引擎已经可以识别出来,对于此种情况,对搜索引擎来说,相当于没做,如果做得多了,反而会被认为是作弊行为:采用大量用户不可见元素堆砌关键词。一种很古老的作弊方式,在SEO上已经被严禁使用了
对于LOGO,还是老老实实图片加alt比较好,至于站名SEO,在LOGO这里作文章明显不合适,一是这个地方太小了,搜索引擎并不知道你这里是最重要的,从这方面来说,完全可以把这个<h1>放到页面中的任何位置,而无须动用LOGO的地盘。二来,<title><meta>这两个标签的作用显示要大于页面中任何“单个元素”,尤其<title>已经是SEO重中之重,所以SEO首先要从这里做起
总结:把站名放到<title>中,在<meta>中使用keywords和description来突出站名,在页面代码尽量靠前的地方<h1>了站名,至于LOGO的地方,还是留给LOGO吧
PS:其实对于<h1>,搜索引擎只是认为它比其他文字更重要一些,远远无法起到决定性作用。
回复
引用
查看
#5楼
2008-07-07 14:31
|
菜菜灰
很古老的一个手法,语意化才是重点。
回复
引用
查看
#6楼
2008-07-07 14:39
|
Baldwin
@菜菜灰
何谓"语意化"?
回复
引用
查看
#7楼
2008-07-07 14:53
|
杨正祎(阿一)
text-indent:-9999em;
因此文字很常用的一个手法。
但是,千万不要乱搞,很容易被搜索引擎认定为作弊。
其实,h1放logo和网站名没有太大意义,为什么呢?因为所有的页面都一样。都一样的h1,对seo有什么意义呢?
h1应该放文章标题、新闻标题这样的东西,我觉得才是合适的。
另:感觉,这个放首页,有点那个了……
回复
引用
查看
#8楼
2008-07-07 15:10
|
丁学
--引用--------------------------------------------------
Baldwin:
@菜菜灰 何谓"语意化"?
--------------------------------------------------------
他打错了字,应该是“语义化”,百度一下就知道了
回复
引用
查看
#9楼
2008-07-07 15:21
|
benbenx
内容才是王道!
回复
引用
查看
#10楼
2008-07-07 16:12
|
xjb
seo 很重要么?
回复
引用
#11楼
2008-07-07 17:27
|
x google[未注册用户]
还是老老实实做站吧。
网页优化在一定程度上是有效的,但内容才是最关键的要素。
现在的搜索引擎不像以前那么傻B了。
04年开始做站,alexa上最高8000名,经验告诉我,内容不一定要多,
网页也不需要过度SEO,内容才是关键。
回复
引用
#12楼
2008-07-07 17:37
|
heero0w[未注册用户]
网站的名字并不是最重要的关键字,请问有多少人搜索的时候是通过网站的名字搜索的?
网站的精华在于内容,最重要的内容才是最重要的关键字。
回复
引用
#13楼
2008-07-07 20:06
|
12345679[未注册用户]
很有意思,学习...
http://***/
回复
引用
#14楼
2008-07-07 21:32
|
爱好编程[未注册用户]
欺骗搜索引擎是不好地 o(∩_∩)o...哈哈
回复
引用
查看
#15楼
2008-07-07 21:54
|
玄猫(韩国峰)
text-indent:-9999em;
这个一般不会被搜索引擎认为是作弊
另外url()里面的双引号是必须不能写,呵呵
回复
引用
查看
#16楼
2008-07-08 00:06
|
Cat Chen
这是个很基本的技巧啦。
回复
引用
查看
#17楼
[
楼主
]
2008-07-08 08:54
|
玉开
感谢各位的光顾,指点。
回复
引用
查看
#18楼
2008-07-08 09:22
|
汉城
关注~!~!再关注
回复
引用
#19楼
2008-07-09 15:29
|
BAsil
不错
回复
引用
查看
#20楼
2010-05-18 19:52
|
南通SEO
好文
回复
引用
查看
#21楼
2011-11-07 10:21
|
何晱
细节的处理很到位
刷新评论列表
刷新页面
返回页首
发表评论
昵称:
[登录]
[注册]
主页:
邮箱:
(仅博主可见)
验证码:
看不清,换一个
评论内容:
登录
注册
[使用Ctrl+Enter键快速提交评论]
0
1237437
Jtxf0mGZP50=
首页
博问
闪存
新闻
园子
招聘
知识库
最新IT新闻
:
·
苹果征集iPad 3发布会演示应用 重点是图形应用
·
京东商城涉足汽车销售 将上线售车频道
·
亚马逊新广告挑衅苹果:一个iPad可买三台kindle
·
动视暴雪确认今年第二季度推出《暗黑破坏神3》
·
官方承认 Google Bar 逆行倒施
»
更多新闻...
最新知识库文章
:
·
高级编程语言的发展历程
·
如何学习一门新的编程语言?
·
学习不同编程语言的重要性
·
为什么我喜欢富于表达性的编程语言
·
计算机专业的女生为什么要学编程
»
更多知识库文章...
China-pub 2011秋季教材巡展
China-Pub 计算机绝版图书按需印刷服务
公告
转载请保留链接
书海之舟
昵称:
玉开
园龄:
6年3个月
荣誉:
推荐博客
粉丝:
382
关注:
44
<
2012年2月
>
日
一
二
三
四
五
六
29
30
31
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
1
2
3
4
5
6
7
8
9
10
搜索
常用链接
我的随笔
我的评论
我的参与
最新评论
我的标签
更多链接
最新随笔
1. Html5 loading 来了
2. .Net中的数字和日期格式化规则助记词
3. 【译】让垃圾回收器高效工作(四)
4. 在Web.config或App.config中的添加自定义配置
5. Monitor的另一种用法
6. 【译】让垃圾回收器高效工作(三)
7. 【译】让垃圾回收器高效工作(二)
8. 【译】让垃圾回收器高效工作(一)
9. 【译】.Net 垃圾回收机制原理(二)
10. 【译】.Net 垃圾回收机制原理(一)
我的标签
sql(26)
performance(10)
t-sql(10)
sql server(8)
Xml(8)
gc(7)
垃圾回收(7)
linq to sql(7)
sqlite(6)
c#(5)
更多
随笔分类
(458)
.Net开发经验(135)
(rss)
c#(94)
(rss)
C++(12)
(rss)
linq to sql(6)
(rss)
sql server(26)
(rss)
Xml,XPath,Xsd(4)
(rss)
简单问题(56)
(rss)
客户端(21)
(rss)
软件设计(6)
(rss)
设计模式(2)
(rss)
生活(41)
(rss)
数据库(35)
(rss)
算法,建模(3)
(rss)
网站管理(17)
(rss)
随笔档案
(301)
2011年12月 (5)
2011年11月 (7)
2011年10月 (4)
2011年9月 (1)
2011年8月 (11)
2011年7月 (11)
2011年6月 (1)
2011年5月 (3)
2011年4月 (3)
2011年3月 (2)
2011年1月 (3)
2010年12月 (3)
2010年11月 (1)
2010年8月 (2)
2010年7月 (12)
2010年6月 (14)
2010年5月 (17)
2010年3月 (2)
2010年1月 (1)
2009年12月 (7)
2009年8月 (2)
2009年7月 (8)
2009年6月 (3)
2009年5月 (5)
2009年4月 (6)
2009年3月 (6)
2009年2月 (5)
2009年1月 (4)
2008年12月 (23)
2008年11月 (24)
2008年10月 (2)
2008年9月 (1)
2008年8月 (4)
2008年7月 (6)
2008年6月 (7)
2008年5月 (19)
2008年4月 (7)
2008年3月 (2)
2008年1月 (1)
2007年12月 (3)
2007年11月 (2)
2007年10月 (1)
2007年9月 (3)
2007年6月 (3)
2007年5月 (6)
2007年4月 (22)
2007年3月 (16)
玉开的友链
小苗子的阳光
(rss)
积分与排名
积分 - 535740
排名 - 108
最新评论
阅读排行榜
评论排行榜
推荐排行榜