注册本站  论坛  繁體中文

电脑技巧
手机 | MP3 | MP4 | 显卡 | 主板 | 显示器 | 光存储 | 笔记本 | 网络设备 | 移动存储 | 数码相机
键鼠 | CPU | 音箱 | GPS | 电视 | 服务器 | 投影机 | 机箱电源 | 品牌电脑 | 办公打印 |
| 网站首页 | Cisco | Windows | Linux | Java | Dotnet | Oracle | 网页设计 | 平面设计 | 安全 | 软件应用 | 电脑维修 | 办公维修 |
您现在的位置: 电脑技巧 >> 网页设计 >> Flash >> 制作技巧 >> 网页设计正文

Flash Web结构之背景层浅析

文章来源:视觉中国 作者:佚名 更新时间:2008-2-17 13:17:11 【 】 【加入收藏

  背景层,顾名思义就是网站的背景,看上去很容易理解也很简单,其实它蕴涵着很多知识和技巧,如果处理不善,将直接影响Flash web的用户体验。

  我在这里把背景层分为以下三种模式:

  1 Flash模式

  2 PS模式

  3 混合模式

  Flash模式:所谓Flash模式,就是直接在Flash中完成网站主体框架的绘制,并利用Flash完成框架修饰内容的填充。这种模式比较适合界面简单,色彩单一,高效实用的Flash web。它充分利用简单矢量图形体积小的优势,同样一个画面,它的体积将比位图小很多。所以这样的网站如果处理恰当的话,完全可以比同种样式的常规HTML网页体积更小。同时由于它直接在Flash中绘制,非常便于修改以及同其它层结合。

  PS模式:这种模式我们可以和传统的网页制作进行类比。传统网页都是先用PS绘制界面,然后切片导出为网页,再在DW中进行编辑。Flash web开发一样可以采用这一流程,利用PS强大的位图处理功能弥补Flash绘图方面的不足。但是在切图的时候,它和HTML网页切图思想不同,在Flash web中经常要把动画因素和各元件之间的遮挡关系考虑进去,所以我一般都是把每个栏目切成一个JPG位图,涉及动画和层级关系的元素则独立导出为PNG透明图象。这样虽然方便了在Flash中的后期制作,但造成网站体积会一定程度的加大。为了优化下载和用户体验,我们可以利用Flash流媒体的特性,把体积较小或者独立性比较好的栏目放在开始的帧先显示出来,相互联系紧密的主功能栏目放中间,体积较大独立性也较好的栏目放最后显示。当然不要忘记用一个loading条时刻提醒浏览者各栏目加载状态,不至于使他们失去继续看下去的信心。这种模式一般适合网站各栏目独立性较好,网站色彩丰富且含有大量动画效果,元件层级复杂的网站。另外,在我写这篇文章的时候,从黑羽那里得到消息,最新版的Flash真的可以支持PSD了,而且还能保留原始图层,再加上以后网速越来越快,PS模式在将来很有可能会大行其道。

  混合模式:混合模式就是综合利用PHOTOSHOP和Flash,取长补短,相得益彰。先用PS设计好网站背景图,并把内容显示部分留空,就像设计HTML网页一样。然后不需切图直接导出为JPG,并导入Flash。再在这张大背景图片上新建一层,用制作动画常用的钢笔勾边上色技术把网站主框架描一边,这就涉及到我后面要讲的“数据显示层”,数据显示层主要由与背景色相似的工整的矢量色块组成,当然像笔者一样喜欢偷懒的人也可以适当添加位图,但数据显示层体积最好控制在30K以内。数据显示层成型后,一定要记得把背景位图放在数据显示层之后的帧上。现在大家应该差不多能猜出这种模式的优势在那里了吧!?对,我们可以利用Flash流媒体的特性,无须等到整个SWF都下载完毕后再显示网站,Flash web的loading时代该过去了!伟大的流式时代就要来临了!我们完全可以先把数据显示层显示出来,让浏览者以最快的速度得到他们想要的信息,与此同时,悄悄的下载背景层,由于我们的数据显示层和背景层的颜色和布局都相似,甚至是完全匹配的,所以背景层下载完成并显示出来的一刹那也不会给浏览者带来太大的跳跃感。当然这样无疑加大了工程量,要求设计师的PS和Flash都不能弱。所谓鱼和熊掌不能兼得,我们必须根据具体的项目进行取舍,看是否真的有必要采用这种模式。笔者个人门户V3主站中,由于背景图片体积过大,我便采用了这种模式,据大部分人反映,用户体验还是很好的:)

  三种模式可谓各有优缺点,如何取舍还是要根据具体项目决定,当然,团队和个人能力也是重要因素。一般来说,程序员出身的可能比较喜欢Flash模式;传统网页设计师出身的一般比较喜欢PS模式;半道出家,什么都懂点的家伙们看了笔者这篇文章后,估计就要开始尝试混合模式了。

  • 上一篇网页设计:

  • 下一篇网页设计:
  • 最 新 热 门
     让flash占满整个网页且flash总是居中
     flash下拉列表(comboBox)附源码下载
     CSS实现文本渐变效果
     Flash Web结构之背景层浅析
     Flash Web设计团队协作
     Flash Web结构之数据显示层
     去除Flash动画在线播放限制的技巧
     JavaScript Dom编程:介绍学习书籍
     网页改版是家家难念的经
     网页设计:当标题不能显示完整的时候
    最 新 推 荐
     让flash占满整个网页且flash总是居中
     Flash Web结构之背景层浅析
     Flash Web设计团队协作
     Flash Web结构之数据显示层
     去除Flash动画在线播放限制的技巧
     三分钟理解Flash中的level层级关系
     怎样禁止SWF文件显示在IE缓存中?
     创建Flash站点的十大技巧
     Swf2Gif将flash动画变成GIF格式
     SWFText轻松制作Flash贺卡
    相 关 文 章

    让flash占满整个网页且flash总是居中
    flash下拉列表(comboBox)附源码下载
    Flash Web设计团队协作
    Flash Web结构之数据显示层
    去除Flash动画在线播放限制的技巧
    JavaScript Dom编程:介绍学习书籍
    符合web标准的网页中调用Flash的方法
    网页中插入透明Flash的方法和技巧
    Swf2Gif快速将flash动画变成GIF格式
    Flash制作动画时的一些常用命令

    | 设为首页 | 加入收藏 | 联系站长 | 友情链接 | 版权申明 | 网站公告

     

    Copyright 2006-2008 pcjx.com All Rights Reserved
    电脑技巧 版权所有 粤ICP备06059145号 地图
    本网站所有内容未经许可不得转载或做其他使用