刘为网络推广博客

面向SEO的网页设计，并不是要通过改变网页设计去主动迎合搜索引擎，而是通过坚持使用Web标准、保证网页质量来得到搜索引擎的认可。每个搜索引擎的排名算法各不相同，但可以肯定的是任何一种排名算法的目的都是让具有高质量、结构清晰、知名度高的网站排名靠前。所以坚持Web标准的网页设计是SEO的基础。

一、导航设计

从表现形式看主要有：文字导航、图片或flash导航以及带有图片背景的文字导航3类样式。文字导航是SEO推荐的导航方式，通过DIV+CSS可以方便地制作文字导航，如图所示。

图１  文字导航效果

文字导航可以很容易被网络蜘蛛识别。网络蜘蛛按导航链接逐层深入，抓取下级网页。另外，采用文字导航会降低网页文件大小，加快网页打开速度，避免因文件过大而导致网站被网络蜘蛛错过。

二、少用或不用帧结构

帧结构可实现在同一浏览器框架内不同帧结构内的页面调用，给网站开发者和用户带来便利，但是，某些浏览器不支持帧结构，而且大部分的搜索引擎也无法识别帧结构内的内容。因此，对于那些乐于被搜索引擎抓取的网页，最好不要使用帧结构。

三、图片优化

图片优化主要有两个方面：一是选择适合Web页面的图片格式，同时压缩图片大小；二是对需要表达含义的图片设置文字说明。

1．WEB图片格式

GIF和JPEG是适合在Web页面设计中使用的页面。GIF只限于256种颜色，适合对图片显示质量要求不高或单一色块图片，JPEG图片适合显示照片。从SEO和用户体验角度来说，适合对图片按钮或网页结构上的图片使用GIF格式，因为JPEG图片加载时是逐行显示，而GIF是先显示图片轮廓在逐渐清晰内容。

2．alt和title属性

Alt属性用于指定图片的替换文字，Title属性用于设置当前对象的说明信息。现在，用户使用搜索引擎已经不局限在文字搜索的范围，图片搜索逐渐被重视。搜索引擎是无法解析图片内容的，而带有Alt和Title属性是图片搜索引擎识别图片的主要依据，所以必须设置图片的Alt属性和Title属性。

在进行SEO优化时，适合将Alt属性设置为图片本来的含义，而将Title设置成指示性信息，示例如下：

<a href="/"><img src="home0.gif" border="0" alt="主页"  title="返回网站主页" /></a>

四、CSS优化

CSS样式表控制着整个网页的样式。随着页面布局的复杂以及表现形式的丰富，CSS样式代码也急剧膨胀，导致网页文件变大。因此，需要对CSS文件进行优化。

对CSS的优化主要有以下几个方面：

1．属性设置

例如对margin、padding属性设置时，原代码如下：

margin:0px 0px 0px 0px；

优化后的代码如下：

margin: 0px;

如果要实现的效果是将对象的外边界设置为0px，两个代码实现效果是一样的，显然后面的写法更简洁。

2．使用分组选择器

定义选择器样式时，经常会遇到不同选择器内容相同或类似的情况，代码如下：

h1 {

                font-size: 18px;

                color: #0000FF;

                text-align: left;

}

h2 {

                font-size: 18px;

                color: #0000FF;

                text-align: left;

}

可以使用分组选择器的方式，将样式相同的选择器放置在一个分组中定义，代码如下：

h1,h2 {

                font-size: 18px;

                color: #0000FF;

                text-align: left;}

3．使用类选择器

类选择器的好处是在样式中定义一次后，在HTML代码中，定义可重复应用。所以，在应用CSS进行网页布局时，除了基本的布局必须用id选择器定义外，其他部分的样式定义尽量使用类选择器定义，这也是优化CSS的一种方法。

４．外置CSS 代码

为了减轻网页的重量，使搜索引擎尽快地接触到网页内容，加快网页显现速度，可以把CSS编码做成外接文件。如下：

<link rel="stylesheet" rev="stylesheet" href="css.css" type="text/css" media="all" />

五、外置Jscript程序

为了减轻网页的重量，使搜索引擎尽快地接触到网页内容，可以把JScript编码做成外接文件。如下：

<script language="javascript" type="text/javascript" src="http://www.seo9go.com/js/inc.js"></script>

六、设置４０４错误页设置。

设定错误页的缺省页，使之成为信息页，来导引访问者继续访问网站，建议和主页的格式保持一致。将这一页命名为404.htm.