左右互博现象之网页设计篇

周伯通，金庸小说《射雕英雄传》和《神雕侠侣》的人物，外号老顽童。因被困于桃花岛上十五年，为打发时间自创“双手左右互搏”之术，功力大增，荣登五绝之一。

左右互博是一个有趣的现象，在很多领域中，都存在，并且让人纠结。该从左，还是从右？似乎左右均是标准，难以舍弃任何一方，就这样一左一右，不觉之中已经前行了。

在网页设计的领域中，也存在矛盾的两个方向。一方以Flash技术为代表的互动型交互动画网页设计，另一方则是以DIV+CSS为代表的营销型网页设计。我曾和成都的网页设计师朋友们讨论过，不论是设计师在选择发展方向，还是公司在定位发展策略时，均遭遇了该左还是该右的纠结。

Flash交互型网页设计，有很多优势，比如：

1、视觉效果突破平面，动画范围突破局部，配以音效，在一定程度上具备影片展现的连续性。

2、感应到访客的点击或浏览行为，从而富有变化的互动效果，一定程度上具有游戏的操作乐趣。

3、不再有页面的说法，内容的呈现和切换，不是生硬的新开页面，而是在场景中变化出来，够酷。

这些优势，让注重眼球经济的品牌，追逐在这一领域，把网站的视觉感染力和酷劲不断推向新的高峰。Flash的技术发展，也让3D、手绘元素或卡通、音效视频片段在网页设计领域，有了介入式的新发展。

在Flash交互网页设计的酷站案例中，有不亚于电影大片的设计风格，也有干脆就是游戏的设计风格。更多的则是将互动体验做到极致的网页设计风格，极富浏览乐趣，让访客陶醉于点击之中，似乎忘记了关注网站本身要传递的内容。

另外，值得一提的是，移步换景的模式也被创意达人所实现。一般的创作原理是这样，在建筑物内，按照预计好的路线，推行照相机，一路拍摄连续的照片。跨门及转角会缩短步伐多拍几张。然后在Flash中，从进入开始，不断的有闪烁点提醒访客点击，每点击一次，则连续呈现该段路线的图片，当然预先对一些图片用到了射线模糊和对播放进行了快慢控制。这样，访客会感觉在建筑物中穿越前进。有的细节部分，也会设置提醒的闪烁点，点击之后会浮出该细节的局部写真放大图一类的，如抽屉拉开，柜门拉开呈现内景。类似这样的特效创意，在博物馆、房产样板间、艺术展厅中，多有应用。

Flash交互网页设计，让网页设计师们，成为了导演，在这里，可以将你的创意融入生命。

但是，Flash交互网站也不是万能，更不是完美，它也有劣势：

1、Flash交互网站不能被搜索引擎收录到内容，所以排名靠后。

2、Flash交互网站难以从网站后台进行内容更新和扩展。

3、Flash交互网站执行速度较慢。

4、Flash交互网站修改较为困难。

以上这几点是Flash从技术层面所存在的障碍，详细一点可以这样理解：

Flash交互网站，在源码中，没有文本内容，也没有插图的URL，更没有各个页面的链接，这样的方式，让搜索引擎被禁止进入了，其内容只有带有眼球的人类能阅读。

Flash交互网站，与数据库的结合，难度极高，虽然依托XML能实现数据的更新，不过受到极大的局限。大多数Flash网站不能基于网站后台及时的更新内容。如果要实现它，所耗费的成本是惊人的。

Flash交互网站，需要预先载入大量的图片、视频、音频等，这对访客的耐心和网络环境是一个考验。有经验的设计师，会进行分步加载，让开篇的等待时间减少，不过会在浏览过程中，出现更多的加载等待画面。

这些劣势，让希望排入搜索引擎结果前列的企业，觊觎Flash交互网站的惊艳又在其自闭的特性上止步不前，如果能实现双站，也许能有效的解决这一问题，不过Flash交互网站费用投入是非常高昂的。

让我们再来看看网页设计领域的另一个发展方向：DIV+CSS模式的营销型网站。

我们给DIV+CSS模式的网站，暂且称呼其为XHTML营销网站。XHTML的网站数量众多，从大家经常访问的新浪、网易等新闻门户，到淘宝、美团等电商网站，到海量的公司网站。这个阵营中，也不乏酷站，被尊为鼻祖的苹果主站，更是开创了一个流派，以其最早应用水晶效果被称之为苹果风格。

XHTML网站有着Flash网站无可替代的优势：

1、网站前端设计类似于基于平面设计，拥有广泛的美工人员支持。

2、网站突破了仅供欣赏的层面，进入到操作和应用领域。

3、有各类程序语言支持，拥有广泛的程序人员支持，应用范围无所不至。

4、代码简洁、执行效率很高、浏览速度有天然优势。

5、源码中文本内容、图片、链接，罗列有序，非常亲和于搜索引擎。

6、多媒体元素不仅仅为网页的效果服务，更多的是成为内容提供给访客。

以上仅仅是我所总结出的优势的一部分，也许很多特性我们已经习以为常，认为其理所当然。详细的说，XHTML基于DIV+CSS构架取代了第一代的HTML网站，将内容与表现分开。即：内容由DIV负责，样式由CSS负责，这样的好处是什么？哦，好处很多，网页设计师和程序工程师都清楚。大家用过博客吧，博客的换皮肤功能是如何实现的？简单来说，就是更换一套CSS样式表，就能实现博客的皮肤更换。如果没有这套标准，QQ空间大家就别指望能由自己来装扮了。而相对于HTML网站，DIV中所管理的内容，好比是线串起来的珍珠，而非散落在一堆杂物中的珍珠颗粒。她的最大优势，则是非常利于搜索引擎。其实，XHML网站最大的优势，在于依托于众多的语言支持下，与数据库类似一对双胞胎兄弟，亲密无间，把网站从观看带入了使用层面。例如：购物、支付、办公、搜索等应用。基于数据库，又足够开放和乐于协同，更让网站融入到原本属于软件的领域以及各类于数据打交道的领域。例如，在智能3G手机的新时代，即能在电脑上通过浏览器访问微博网站，登陆后敲的噼噼啪啪的发布，也能在手机上安装客户端软件后乐得滔滔不绝。

通过XHTML，网页设计师于程序工程师一道，夸张一点说，成为了互联网的上帝或者女娲娘娘，他们能创造了一切应用。

XHTML网站有着这么多的盟友支持，似乎无所不能，但它在网页设计领域，确实也有缺陷：

1、网站尽管有JS来制作特效，但仍然不能企及Flash的互动高度。

2、XHTML网站的世界里，多媒体元素在视觉效果上，能带来点缀，但不能带来震撼。

3、Ajax减少了页面的更替，不过终归是一篇又一篇的翻阅，类似游戏中操控乐趣，在这里体验不到。

4、不够酷，不够个性，不能让艺术家释放足够的创意，只因其并不是为专注于视觉表现而诞生。

正是因为Flash交互式网页设计和DIV+CSS开放式网页设计之间存在巨大的差异，且各自均有很远大的前程，确实让从事网站建设行业的网页设计师们纠结无比。精力和时间是有限的，把有限的精力投入到无限的学习中去，风险是大大滴。没有几个设计师能像老顽童周伯通一样，安静的藏匿在孤岛山洞中，左右互博15年。网页设计发展到当前的阶段，需要掌握和学习的太多，更多的是分工合作，各自在所沉醉的领域竭力提升。是左还是右，或者左右互博，希望此文，能给予网页设计师们一些启迪。

以上为成都网页设计领域的杨昶，胡言乱语，希望多多点击。原出处：www.netub.com

注：相关网站建设技巧阅读请移步到建站教程频道。