SEO——友好的HTML和javascript

普通的规则设置：

1. 在浏览内容之前不要求访问者进行登录，搜索引擎蜘蛛不能登录。（技术上可以使用伪装检测蜘蛛的存在，再传输内容给它们而不要求登录，但是这是一项颇受争议的技术）
2. 呈现的内容是纯文本形式，而不是图像，使用基于HTML/CSS技术，而不是到处使用AJAX或者Flash
3. 不要求访问者支持javascript导航的功能

一、友好的Javascrpt

1、javascript链接

javascript链接可以是任意的按钮或文本，但是不赞成使用的原因就是蜘蛛无法进入到链接，而且也让不支持javascript的用户无法进入。

<a href="#" onclick="location.href='http://www.example.com';return false;">Link</a>

这样的问题也出现在其他客户端动态技术如java applets、Ajax和Flash。一般来说不能通过<a>链接进入的导航都是不能被蜘蛛检索到的。如果非要不希望一个链接被索引应使用robots.txt或者meta标签来排除。

正确的可以修改为：

<a href="http://www.example.com" onclick="location.href=this.href;return false;">Link</a>

这样既可以保证链接的有效性，也可以再支持javascript的情况下使用javascript跳转。

2、DHTML菜单

DHTML菜单是基于javascript的，这对搜索引擎同样也是存在问题的。由于使用javascript来产生或者控制HTML的显示等动态效果，但蜘蛛却把其视为页面上不可见的元素，因此导航菜单部分的链接就是最大的问题。

可以在页脚设置一组可见的链接，或者使用站点地图，这样提供了可见的明确的链接不仅对搜索引擎来说是友好的，而且对不支持javascript实现的动态效果的用户也是可以使用导航功能的。

3、弹出窗口

搜索引擎很可能无法搜索到弹出的页面，一般如下：

<a href="#" onclick="window.open('page.html', 'mywindow', 'width=800;height=600');return false;">Window</a>

这样可以使用如下的代码来改变：

<a href="page.html" target="_blank" onclick="window.open('page.html', 'mywindow', 'width=800;height=600');return false;">Window</a>

使用target="_blank"来模拟新打开的窗口，在page.html页面的body中可以使用onresize='setTimeout("window.reaizeTo(800,600)",100)'来处理大小。这样对搜索引擎来说友好，而且对不支持javascript的用户也是同样可以访问。
上述实现有一个问题就是新打开的页面需要提供导航才能返回到原来页面，通过读取$_SERVER['HTTP_REFERER']变量来获取到达弹出页面的网页，如果是本地网站就不显示导航，否则是从外部网站访问的，就要显示导航页面。但是很多防火墙封闭了referer信息，同时如果是https协议得到，那么referer信息也不可用。

最后的选择，可以使用DHTML来模拟，使用javascript隐藏或显示，设置visibility属性为hidden，从而控制实现弹出窗口的效果。但是由于不可见，很可能会被认为是不可见的页上因素。

4、可检索的图像和图形文本

网络蜘蛛不能检索图片中的文字等信息，因此需要尽可能使用按CSS风格设计的正规文字，但是CSS不能满足设计者的排版需要，为了弥补CSS排版的不足，可以使用客户端javascript浏览HTML文件结构，选项性地选择部分位子用已下载的图形进行替换，这就是所谓的“文本替换”，常用的文本替换有sIFR和Stewart Rosenberger方法，前者是使用Flash文件替代指定的文本，后者是使用服务器端脚本生成的图片替换。这个替代使得蜘蛛可以检索文本内容，人类访问者可以看到有优美字体的Flash或图片，达到了排版了需要，这种替代需要忠实于原文，否则就是“黑帽”。

二、友好的HTML

1、HTML结构化单元

HTML标签需要与语义相关，这样结构化的单元可以帮助网络蜘蛛从全局了解文件内容以及定位逻辑分区和重要部分，如<h1>、<h2>、<b>、<li>等，使用内容语义化的标签结构进行布局是搜索引擎同样也是开发者关注的重点。

应该直接创建HTML而不是用所见即所得的编辑器，同时还有一种解决方案就是使用自定义标记语言。

2、内容突出和表格

内容突出是只物理深度，即该内容在HTML文档中的实际起始位置。搜索引擎对越靠近文档头部的内容越重视，因此要避免在页面初始内容中设置重复和不相关内容。

通常将javascript文件移到文档底部，或者移到单独文件中并在文档底部进行引入。

使用表格布局之所以被废弃，一个原因是网页结构布局难以扩展，另一个重要原因就是导航栏设置网页左边时会将主要内容的物理位置往下推，从而导致网页更加靠后。

解决办法第一是使用纯CSS类替代表格进行排版，也就是DIV+CSS，扩展性也很好；第二就是使用表格排版时可以将导航单元放在页面右边；第三是使用HTML手法维持表格的出现顺序，逆置表格单元在文档中的物理位置。

3、表单、Flash和Ajax

搜索引擎不提交表单，因此表单导航下的所有内容都会被忽视。表单提交的URL可以放到站点地图中让蜘蛛检索到它。

搜索引擎只索引页面文本内容和链接，不会索引应用程序，因此Flash和Ajax表现过多的网页会带来很多问题。应该仅在特别需要的时候使用，一般尽可能使用HTML和Javascript混合就可以达到这些效果。同时随着HTML5的不断应用，很多特效都可以使用html标签和javascript代码实现，因此这对网络蜘蛛也是特别友好的。