November 1, 2006


更多



从搜索引擎的角度来看,用一些基本的HTML代码实现网页设计对搜索引擎会更具有友好性。

假设你的网站有如下2个选择:
1。The Left Section:通常包含 导航信息、广告、推荐等等
2。The Main Content Area:网站主题内容

下面是基本的网页结构设计:

点击在新窗口中浏览此图片


通常,我们都是采用如下HTML代码来实现:


<table width="80%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td>
  <b>LEFT SECTION</b><br>
   ITEM1<br>
   ITEM2<br>
   ITEM3<br>
</td>
<td bgcolor="#D9BBBB" rowspan="2" valign="top">
        Main Body
</td>
</tr>
</table>


注意,在源代码中,左侧区域出现在主内容区域的前面,因此,相比之下,搜索引擎可能会给网页左侧内容更多的偏爱。

为达到良好的SEO目的,我们需要改善上面的网页设计结构

解决问题的办法就是利用标签的Rowspan属性。通过将Rowspan的值设置为2来将网页划分成两行,把主内容区域放在第1行优先于左侧区域显示,而左侧内容被放在第2行

网页设计结构优化后的HTML代码:


<table width="80%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td height="1">
</td>
<td bgcolor="#D9BBBB" rowspan="2" valign="top">
        Main Body
</td>
</tr>
<tr>
<td>
  <b>LEFT SECTION</b><br>
   ITEM1<br>
   ITEM2<br>
   ITEM3<br>
</td>
</tr>
</table>


网页设计结构优化后的效果:
点击在新窗口中浏览此图片
最后编辑: 郝聪 编辑于2008/02/19 23:02
From: 本站原创
15 Comment(s)
vgfge02136 Email
2012/05/19 00:56
工作总是来之于坚持不懈我一定要坚持不懈不可啊
vgfge02136 Email
2012/05/19 00:56
工作总是来之于坚持不懈我一定要坚持不懈不可啊
全自动机械表那个好 Email
2011/08/19 19:05
谢谢分享经验,需要好好和博主学习技术~
全自动机械表那个好 Email
2011/08/19 19:05
谢谢分享经验,需要好好和博主学习技术~
丨丶o斌斌灬 Email
2008/05/03 06:54
我爱爱一万年
丨丶o斌斌灬 Email
2008/05/03 06:54
我爱爱一万年
londonrate.com Email
2007/08/10 22:54
Cannot understand the point :(
londonrate.com Email
2007/08/10 22:54
Cannot understand the point :(
hon.ki
2007/05/25 11:04
那要怎样进行优化呢?
hon.ki
2007/05/25 11:04
那要怎样进行优化呢?
violam Email
2007/05/13 09:15
引用
<head>
<title>Content Sort Float</title>
 <style>
#content {float:right; background:#00c;}
#sidebar {float:left; width:30%;  background:#c00;}
 </style>
</head>

<body>
 <div id="content">
Here is Main Body
 </div>
 <div id="sidebar">
Here is SideBar
 </div>
</body>

这样如何?整个body区只有几行字,Content放在前面,用CSS控制它浮动,想放左边右边只要改一下CSS就行了. Div+CSS是标准化的趋势,GG应该更加喜欢才对
[回复] 是这样的
violam Email
2007/05/13 09:15
引用
<head>
<title>Content Sort Float</title>
 <style>
#content {float:right; background:#00c;}
#sidebar {float:left; width:30%;  background:#c00;}
 </style>
</head>

<body>
 <div id="content">
Here is Main Body
 </div>
 <div id="sidebar">
Here is SideBar
 </div>
</body>

这样如何?整个body区只有几行字,Content放在前面,用CSS控制它浮动,想放左边右边只要改一下CSS就行了. Div+CSS是标准化的趋势,GG应该更加喜欢才对
[回复] 是这样的
xudehuai Email
2007/03/26 17:06
div google不太喜欢呀
[回复] 请说说理由
xudehuai Email
2007/03/26 17:06
div google不太喜欢呀
[回复] 请说说理由
xudehuai Email
2007/03/26 17:06
div google不太喜欢呀
[回复] 请说说理由
xudehuai Email
2007/03/26 17:06
div google不太喜欢呀
[回复] 请说说理由
liaijv Email
2007/03/24 17:02
我是一个刚学习的做站的人  å¥½è±¡éƒ½ä¸è®¤è¯†ï¼³ï¼¥ï¼¯å•Š  ä¸è¿‡æˆ‘会好好学的
[回复] 加油
liaijv Email
2007/03/24 17:02
我是一个刚学习的做站的人  å¥½è±¡éƒ½ä¸è®¤è¯†ï¼³ï¼¥ï¼¯å•Š  ä¸è¿‡æˆ‘会好好学的
[回复] 加油
liaijv Email
2007/03/24 17:02
我是一个刚学习的做站的人  å¥½è±¡éƒ½ä¸è®¤è¯†ï¼³ï¼¥ï¼¯å•Š  ä¸è¿‡æˆ‘会好好学的
[回复] 加油
liaijv Email
2007/03/24 17:02
我是一个刚学习的做站的人  å¥½è±¡éƒ½ä¸è®¤è¯†ï¼³ï¼¥ï¼¯å•Š  ä¸è¿‡æˆ‘会好好学的
[回复] 加油
分页: 1/1 第一页 1 最后页
发表评论
昵称
密码 [ 游客无需密码 ]
电邮
网址
打开HTML 打开UBB 打开表情 隐藏 记住我