网页美工与网页优化

作者：老毛虫 首发：新疆二域设计 www.xjcncn.com

今天谈谈网页美工和网页优化的问题。刚才特地到Google和百度里搜了一下，关于网页优化的页面都是上百万，而网页美工的搜索结果只有几十万，

感觉大家对网页优化的研究方向有点偏颇了。其实网页优化应该是个系统的工程，它包括：1：网站页面美工优化；2. 网页程序代码优化 3. 网站结构优化 4：搜索引擎优化


我们做网站的最终还是要面对用户，而一个网站的界面美工就相当于一个人的脸面，给人的第一印象尤为重要。

但另一方面的现状是，一般作为专业网页美工人员，往往陶醉在技术里，

把精力放在控制颜色、排版、精确定位等方面

而忽略了对用户和搜索引擎的友好程度，也就是今天我主要讲的网页优化的核心问题。

下面我分3个方面来逐步分析一下网页美工在设计网页的时候，应该注意的网页优化问题。

一：网页下载速度

1：控制图片大小。网页美工在设计网页的时候，一般是用photoshop先把效果图DEMO设计出来，然后切割，导入Dreamwever,再重新排版。这就出现问题了

网页要取得良好的浏览速度，就必须控制单张图片的大小。最好单张图片能在10K以内

以往设计人员在导出JPG或GIF的时候，是很少注意这些的。我见过一些工作室的网站，单张图片上百K，那是很恐怖、很要命的事情。

要控制单张图片大小的一个方法就是切割，将整图分割成小块，然后再插入到表格里重新排版。对于色彩丰富、有过渡色的图片采用jpg格式保存，单色的背景图、颜色较少的图片可以用gif。

2：少用flash。

前几年比较流行引导页，就是将一个大型的swf文件作为网站的引导页，

而且有的不加跳过动画的文字入口，必须等到flash自己loading个差不多了才能进到真正的首页去。这些毛病是有悖网页优化的准则的

另外，有些网站为了追求美观，喜欢将网站的导航做成flash按钮，甚至将整个首页全部用FLASH方式设计，这也是不符合网页优化原则的。因为搜索引擎无法识别flash中的信息。

3：避免过多的表格嵌套。浏览器下载表格内容的顺序是由内而外的，先把单元格和里面的表格里的元素下载完之后，再下载最外面的表格。

这就提示网页美工人员。在整图切割之后，重新插到表格中时，要竭力避免过多的表格嵌套。当然，DIV+CSS能解决嵌套的问题，但很多人还是喜欢用表格。

二：网页导航和字体运用

1：网页导航不建议做成flash格式和图片格式，做成图片的导航注意要加alt和title。但还是尽量避免图片格式的导航。现在文字导航甚至文字型的网站名称越来越流行了，看来大家都注意到了这一点，就不废话了。

2：字体运用

a.不要使用超过3种以上的字体。字体太多则显得不够专业，页面会很杂乱，没有主题。

b.不要用太大的字。字体大小方面，标准字体是9pt。文章标题可使用 h1、h2、h3、等标签。 有时h1默认字体比较大，可以在css里控制一下，让它显示为14px即可。

c:不要使用不停闪烁的文字。想让浏览者多停留一会儿的话，就不要让它闪烁。

三：网页整体风格的统一和用户体验

上面说了很多，一大部分是针对搜索引擎的，一小部分是针对用户的。讨好google和百度只是第一步工作，跟着还要讨好访问者，才能把网站访问者转化成客户，提高客户转化率。

怎样才能形成良好的用户体验，确实比较难搞，不太类型的网站吸引的用户群不一样，也不好一概而论，但作为网页美工，

主要任务我觉得应该是对色彩的把握，对细节的追求

商业型的网站和娱乐性质的网站，色调和排版会有很大的区别，大型集团的网页设计可能在大气方面要求较多，

而有些企业可能比较喜欢简约的页面

所以，网页美工的差事会很苦，一方面要应付不同人的多种口味；另一方面为了照顾搜索引擎，又要牺牲一些美工方面的追求。

故而我觉得，要做一个风格统一、用户体验较好的网站，还是由专业美工人员全程参与。不能把效果图切割好就算完事

很多在效果图里表现的很好的页面，拿到程序人员手里，搞来搞去弄得页面惨不忍睹。

-----------不知道说什么了，先结束