搜索引擎友好的
HTML
和
Javascript
在通常情况下使用
Ajax
或者
Flash
显示信息的网站,可能会被搜索引擎忽视。同样使用基于
Javascript
的链接导航也可能带来同样的后果。尽管存在这样的问题,深入理解并运用这些内容显示技术,将使你的网站超过其他不够成熟的网站。本文将探讨这些问题,提供相应的解决方法,并概述网站显示的最优方法。因此我们不必担忧搜索引擎友好就意味着
Ajax
、
Flash
或
Javascript
的终结。本文的主要内容如下:
1、设计实现搜索引擎友好的
Javascript
站点的功能;
2、改进用于设计搜索引擎友好的
HTML;
3、分析什么时候及怎样在站点中使用
Ajax
和
Flash;
一、
搜索引擎友好的
Javascript
搜索引擎的是用来索引内容而非执行应用程序代码。因此,如果采取错误的方式应用
Javascript
,可能会降低网站搜索引擎的友好性。相反,当
Javascript
被适当地应用时,网站的友好性将不会受到影响。
1、
Javascript
链接
首先讨论
Javascript
代码在导航中的使用。
Javascript
链接可以是任意的按钮或者文本,当单击后导航到另一个页面,典型的
Javascript
链接就像下面的示例:
<a href="#" onClick="location.href='http://www.csdn.net';return false;">csdn
—全球最大中文
IT
社区
</a>
|
一般不赞成使用
Javascript
实现这类链接,因为这样做将会使得搜索引擎蜘蛛无法进入链接而且也让不使用
Javascript
的用户无法进入。普通的超链接也足以实现类似的链接功能:
<a href="http://www.csdn.net">csdn
—全球最大中文
IT
社区
</a>
|
2、
DHTML
菜单
因为
DHTML
菜单是基于
Javascript
的,因此它同样也存在搜索引擎不够友好的问题。为菜单中的所有单元提供另一个导航,是非常明智的选择。可以在页脚设置一组链接,站点地图,或者两者混合使用。这个方法不仅适用于搜索引擎,而且当访问者不支持
Javascript
时,也可以在这个站点中导航。
3、
弹出窗口
显示弹出页面最典型的方法,就是使用
Javascript
。同样,搜索引擎也很有可能不会搜索到由
Javascript
指向的网页。如何能让弹出网页被检索到呢?
解决方法非常的简单。下面就是典型的弹出窗口链接:
<a href="#" onClick="window.open('http://www.csdn.net','csdn
—全球最大中文
IT
社区
','width=800
,
heigth=600');return false;">
单击进入
CSDN</a>
|
可以使用以下代码来改变链接,使得弹出窗口可以被搜索到:
<a href="http://www.csdn.net" onClick="window.open(this.href,'csdn
—全球最大中文
IT
社区
','width=800
,
heigth=600');return false;" target="_blank">
单击进入
CSDN</a>
|
二、
搜索引擎友好的
HTML
1
、
HTML
结构化单元
通常
HTML
提供的结构化单元可以帮助搜索引擎从全局上了解文件内容,以及定位逻辑分区和重要部分例如
<h1>
和
<h2>
标签,
<b>
标签等。如果在
HTML
代码中没有给出引类结构单元,搜索引擎将完全根据自己的判断工作。然而所见即所得的网页制作软件一般不使用上述的标签,而是使用
Style
属性中内嵌的
CSS
来生成
HTML
。这些因素不利于针对搜索引擎的优化。请看下面的代码:
<ol>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
<li>Item 4</li>
</ol><br>
|
相比上面的代码,下面的代码提供了更多的语义信息(它们的显示内容完全相同):
<img src='bullet.gif'>Item 1<br>
<img src='bullet.gif'>Item 2<br>
<img src='bullet.gif'>Item 3<br>
<img src='bullet.gif'>Item 4<br>
|
2、
内容突出和表格
内容突出是指内容在
HTML
文档中的实际起始位置(即以字节为单位)。由于搜索引擎对越靠近
HTML
文档顶端的内容就越重视,所以要尽量避免在页面的初始内容中设置重复和不相关的内容。
通常我们没有必要将
Javascript
代码设置在
HTML
文档的顶端。最好将位于
HTML
文档顶端的
Javascript
代码移到底端,或者移到单独的文件中,因为
Javascript
包含网络蜘蛛难以检索的大量脚本。可以使用下面的代码调用外部
Javascript
文件:
<script language="JavaScript src="my_script.js"></script>
|
表格技巧使用
2
×
2
的表格,第一行第一个单元为空,第二个单元中将
rowspan
设置成
2
接着将导航信息放入第二行的第一个单元。
以下是一个简单的
HTML
示例:
<table border="1">
<tr>
<td valign="top">Navigation</td>
<td valign="top">Content</td>
</tr>
</table>
|
添加内容到表格后,如图
1-1
所示
图
1-1
添加内容到表格中
此时可以通过重写
HTML
代码,在不改变外观顺序的同时,将文档中的相关内容前置,代码如下所示:
<table border="1">
<tr>
<td><!-- empty table cell --></td>
<td rowspan="2" valign="top">Content</td>
</tr>
<tr>
<td valign="top">Navigation</td>
</tr>
</table>
|
图
1-2
是该表格改变后的示例:
图
1-2
表格改变后例图
通过这个方法,可以使文档中导航代码的物理位置在内容的物理位置之下,而且当代码载入浏览器时,导航仍会出现在页面的左边。
3、
框架(
Frame
)
由于在使用框架(
Frame
)会出现很多问题,以致有很多设计者很难决定在什么情况下该使用框架(
Frame
)。搜索引擎在搜索含有框架(
Frame
)的网页时,会出现很多问题。当一个页面中包含与上下文相关的框架(
Frame
)时,搜索引擎不能为该页面创建索引,只有具有单个框架(
Frame
)的页面才能被索引。但我们经常用导航框架(
Frame
)将这些框架(
Frame
)相关起来,这样一来,即使一些单个框架(
Frame
)页面被索引了,也有可能使得用户收到不带导航的孤立页面,对这个问题也有一个解决方法(与弹出导航页面中介绍的方法相似),然而此方法又会导致其他问题。任何使用框架(
Frame
)的网页都会存在上述问题,框架(
Frame
)带来的这些问题都没有那么简单的解决方法。详见
http://www.useit.com/alertbox/9612.html
。因此建议设计网页时不要使用框架(
Frame
)。
4、
使用表单
由于搜索引擎不提交任何表单,因此表单导航下的所有内容都会被蜘蛛忽视。蜘蛛不会填写表单。并没有什么办法可以解决这个问题。但是也胡一个绕过去的方法。只要将脚本配置为接受来自
GET
请求的参数,就可以在网站中的站点地图或其他某些表单请求的
URL
。
如果表单提交它的值并创建动态
URL
的代码如下所示:
/search.php?category_id=1&color=red
|
那么同样的链接就可以放到站点地图,此时蜘蛛就可以检索到它。
小结:
页面内容显示技术是一把双刃剑。
Flash
和
Ajax
这样的技术虽然带来了更好的用户体验,但是如果使用不当,也会导致搜索引擎无法检索到使用了这些技术的页面。即使是那些看似不重要的东西,如链接的结构等,也有可能严重影响到网站的可检索性和对搜索引擎的友好程度。
分享到:
相关推荐
搜索引擎友好设计是提升网站在搜索引擎排名和吸引流量的关键。通过优化网站的各个方面,可以使搜索引擎更容易理解和抓取网站内容,从而提高搜索引擎的收录速度和频率。 **一、网站定位与设计** 1. **精准定位**:...
JavaScript搜索引擎源代码是一种轻量级的搜索解决方案,适用于小规模网站的站内搜索功能。...总之,这个JavaScript搜索引擎源代码是一个学习Web开发、特别是JavaScript编程和前端交互设计的好实例。
7. **响应式设计**:确保搜索引擎在不同设备和屏幕尺寸上的可用性和可读性是现代网页开发的重要一环。使用CSS媒体查询和弹性布局可以实现这一点。 8. **错误处理**:对于可能出现的网络错误、服务器错误或无效查询...
在本课程设计中,我们将深入探讨“搜索引擎web”的构建,这是一个关键的技术领域,它使得互联网上的海量信息变得可检索和易获取。这个项目的目标是设计一个功能强大的搜索引擎,能够处理用户的查询,查找并返回与...
总之,淘宝客搜索引擎源码是一个包含HTML、CSS、JavaScript以及后端脚本的综合项目,它涵盖了Web开发的多个层面,无论是对于提升购物体验还是作为学习材料,都具有很高的价值。通过深入研究和实践,你可以掌握更多的...
通过分析这些源代码,你可以学习到如何使用正确的标签来构建语义化的页面结构,这对于搜索引擎优化(SEO)和无障碍访问至关重要。 CSS (Cascading Style Sheets) 是用于控制网页外观和布局的语言。CSS允许设计师将...
这个压缩包文件“javascript经典特效---综合的搜索引擎 .rar”显然包含了关于如何使用JavaScript来创建高效、用户友好的搜索功能的资源。下面我们将深入探讨这一主题。 【描述】:“综合的搜索引擎 .rar”这个描述...
标题中的“人工智能-项目实践-搜索引擎”点明了本次项目的核心是关于人工智能技术在搜索引擎中的应用,这通常涉及到自然语言处理、机器学习和信息检索等多个领域。在这个项目中,我们聚焦于如何通过智能算法来提升...
在IT领域,搜索引擎是至关重要的技术之一,尤其在大数据...同时,对JavaScript的掌握也能让你更好地理解和设计用户友好的Web应用程序。这个实践项目将理论与实践相结合,是学习人工智能和搜索引擎技术的一个宝贵资源。
**阿里巴巴SEO培训——中小网站搜索引擎友好设计** 搜索引擎优化(SEO)是提升网站在搜索引擎结果页面排名的关键策略,尤其对于中小网站来说,优化设计至关重要。阿里巴巴提供的SEO培训旨在帮助这些网站提高可见度...
6. **用户接口**:一个优秀的搜索引擎还需要有一个用户友好的界面,让用户能够方便地输入查询、浏览和筛选结果。HTML、CSS和JavaScript是构建前端界面的基础,而React或Vue.js这样的库可以帮助构建交互性强的UI。 7...
- 采用Web标准的优势包括更佳的访问性、兼容性、可维护性和搜索引擎优化等。 4. HTML5文档结构 - HTML5文档基本结构包括<html>、和等标签,其中标签定义了文档的标题,是中必须的元素。 - 元素是HTML文档的基本...
在“javascript经典特效---同时多种搜索引擎.rar”这个压缩包中,我们重点探讨的是如何利用JavaScript来创建和集成多种搜索引擎,为用户提供便捷的搜索体验。 在HTML文件“同时多种搜索引擎.htm”中,我们可以预期...
此外,考虑到搜索引擎优化(SEO),需要合理使用HTML标签,确保内容的可爬取性,同时通过JavaScript加载的内容也要考虑SEO友好。 总结,构建一个个人博客需要掌握HTML、CSS和JavaScript的基本知识,结合这些技术,...
6. **用户界面**:设计用户友好的搜索表单和结果展示页面,需要熟悉HTML、CSS和JavaScript,可能还需要响应式设计来适应不同设备。 7. **性能优化**:为了快速响应用户的搜索请求,需要考虑缓存策略、数据库优化、...
搜索引擎中的爬虫设计是互联网信息检索的关键组成部分,它负责自动地遍历并抓取网络上的大量数据,为搜索引擎提供新鲜且全面的网页内容。爬虫技术对于理解和构建高效的搜索引擎至关重要,因为它涉及到网络数据的获取...
总的来说,这个综合搜索引擎代码项目涵盖了网页开发中的前端设计、JavaScript编程、API交互和数据处理等多个方面,对于想要深入学习这些技术的开发者来说,是一个很好的实践和学习资源。通过研究这个代码,可以提升...
jQuery微软Bing搜索引擎是将流行的JavaScript库jQuery与微软的Bing搜索引擎API相结合,以实现高效、用户友好的网页搜索功能。这个应用实例旨在提供一种方式,让开发者能够轻松地在自己的网页应用中集成强大的Bing...
4. 搜索引擎设计:设计一个搜索引擎涉及多个方面,包括数据抓取、预处理、索引构建、查询解析和结果排序等步骤。在这个项目中,开发者可能详细讨论了如何使用Lucene来抓取和存储网页数据,如何建立倒排索引,以及...