网页设计

firework使用基础知识

时间:2023-06-13 13:26:33 网页设计 我要投稿
  • 相关推荐

firework使用基础知识

  firework由Macromedia(在2005年被Adobe收购)推出的一款网页作图软件,软件可以加速 Web设计与开发, 是一款创建与优化 Web 图像和快速构建网站与 Web 界面原型的理想工具。下面是小编帮大家整理的firework使用基础知识,仅供参考,欢迎大家阅读。

firework使用基础知识

  PNG文件格式

  很多人预测PNG(Portable Network Graphics可移植的网络图形)将以其在WEB上的优越文件格式取代象GIF和JPEG等传统的图象格式。PNG格式在处理WEB图形方面的确有其独到的长处:

  1、无失真:不象JPEG图形文件,在将图片保存成PNG格式时,图象不会丢失任何的颜色信息。

  2、高压缩率:PNG格式的文件甚至可以比GIF有更大的压缩率。

  3、支持位透明:PNG支持alpher通道透明,alpher通道透明不同与Index索引颜色透明之处在于:Index索引颜色透明要么是完全透明,要么是完全不透明;而alpher通道透明颜色可以使同种颜色之中部分透明而其它部分不透明。

  4、伽码(gamma)校正:PNG格式是第一种支持监视器的伽码设置修正,这使得PNG格式的图象在任何平台上都可以得到同样的显示效果。

  5、支持真彩色:类似于JPEG图象格式,PNG可以处理上百万种的颜色。

  6、强大的图形再编辑性:在将图片保存成PNG文件格式之后,重新在Fireworks中调出来编辑时,图片仍然很好地保持了图层的分隔和对象的分隔,并允许我们对该图片的任何一独立的部分做任意的修改。这大大方便了我们以后对该图形的修改和编辑处理。

  虽然到目前为止,大多数的浏览器还不能或者只能通过插件来实现对PNG文件格式的支持,但是我们可以预见,随着PNG文件格式的不断完善和普及,PNG图片将很快成为续GIF和JPEG之后的第三种主要的WEB图形格式。

  在使用Fireworks进行一些操作时,它会有一些警告提示信息,就比如上面提到的“Dont show this again”如果你选择了“不再提示我”,这个信息就不会再次出现了。但在某种情况下,你有想看到这个信息提示,你可以选择:CommandsReset Warning Dialogs恢复警告提示),则这个提示又会出现。

  Fireworks的图象导出

  PNG被Fireworks视为自身的图象格式,通过选取Save或Save as我们可以将Fireworks中处理的图片保存成该文件格式。

  目前所有WEB浏览器广泛支持的仅有GIF和JPEG这两种图象格式,如何导出WEB的这两种图象格式呢?Fireworks为我们提供了非常好用的Export Preview(导出预览)和Export Wizard(转存精灵)两大功能版块,有关它们的详细解说我们同样可以查看在学习中心的相关文章。

  在Fireworks中我们一般都是使用Export Preview功能版块来导出包括GIF和JPEG在内的各种格式的图象文件,其实,细心的Fireworks还给我们提供了几种其它的特殊导出:

  Selected Slice:选择切片,该特别导出允许你只导出切图的其中一块或几块切片。

  Layers/Frames to Files:单独导出图象的其中一图层或动画的某一帧。

  Css Layers:将图片导出并放置在各自的CSS(Cascading Style Sheets)图层中,如果在做WEB页面要使用到该图层时,可以将生成的代码直接COPY到WEB页面适当的地方即可。

  Lotus Domino Image Well:导出用于Lotus Domino文档中的Image Well格式。

  Flash SWF:将动画导出生成Flash电影的SWF文件格式。

  Illustrator 7:将Fireworks图象导出为Illustrator的.ai文件格式。

  Fireworks的行为

  选取菜单“Window-->Behaviors”打开行为功能面板,使用该功能面板,我们可以很容易做出各种简单的滚盖图(rollover)、交互图片、导航条、状态栏文本信息等等。

  与Dreamweaver的无缝结合

  只要你将Dreamweaver的默认图象编辑器设定为Fireworks,这样在Fireworks中处理的Dreamweaver编辑器里的文件会立即跟随更新。

  可以在Dreamweaver中使用Fireworks提供的标准控制对图片进行优化处理,而无需打开Fireworks。

  可以把Fireworks生成的代码直接输出到Dreamweaver的Library或直接挎贝到Dreamweaver网页编辑器适当的位置。

  利用Fireworks的Behaviors,可以非常方便地生成各种滚盖图或交互按钮等等。

  导入Fireworks2.0的Style

  你是否因为Fireworks3.0少了好些Fireworks2.0中的风格模式(Styles)而在着急呢?不用急,先找到你原来Fireworks2.0的安装目录MacromediaFireworks 2SettingsStyles下的“Style Defaults.stl”文件,然后将它COPY到你Fireworks3.0的相同安装目录下,再开启你的Fireworks3.0,点击Style功能面板右上角的小三角形,在弹出的菜单中选取“Import Styles”命令,导入你刚COPY过Fireworks3.0安装目录下的该.stl文件即可。

  网页切法

  切片在制作网页的过程中占有很重要的地位,切片的成功与否直接决定日后网页制作的进度快慢和网站运行的速度,只有通过大量的练习才能体会切片的含义

  切片介绍

  1. 切片是将图片转换成可编辑网页的一座桥梁,通过切片才可以将普通图片变成Dreamweaver可以编辑的网页格式

  2. 切片后的图像可以更快的在网络上传播

  3. 切片后的图像也是网页中片的主要来源

  切片方法

  1. 切片首先保证切出网页中需要多次修改的区域,例如文字区域

  2. 切片图像的大小尽量保持在15K以内(便于网络传输)

  3. 充分利用Dreamweaver中的自动拼贴功能减少垃圾切片

  操作技巧

  技巧1:使用键盘的方向键移动对象时,按住【Shift】键不放,每次可以移动10个像素。

  技巧2:使用【指针】工具移动对象时,按住【Shift】键不放,可以保证其水平或垂直移动。

  技巧3:按住【Alt】键不放拖拽某个对象,即可对其进行复制。但是自动形状不能用这个操作,因为自动形状是一种组合状态,可以使用复制粘贴命令复制。

  技巧4:对于所有的形状绘制工具而言,按住【Shift】键不放进行绘制,可以保证其宽高比始终为1:1。

  技巧5:使用基本形状工具绘制形状时,按住【空格】键不放,不要松开鼠标左键,可以移动矢量图形的位置。绘制选区的时候也是如此。

  技巧6:使用【矩形】工具绘制矩形时,按住键盘的上或下键不放,不要松开鼠标左键,可以增加或减少矩形的圆度。

  技巧7:需要选择组内对象时,并不需要取消组合,可以选择【部分选定】工具来选择组内对象,这对于多个组合对象的编辑来说非常方便。

  技巧8:使用【钢笔】工具绘制路径的过程中,按住【Alt】键不放,可以随时调整路径点的控制手柄。

  技巧9:使用【刷子】工具绘制图像时,按住【Shift】键不放,绘制出出一条水平或垂直线后,释放鼠标,但不要松开【Shift】键,继续绘制,fireworks会把所画前一条线的终点和后一条线的起点连接起来。

  技巧10:按住【Alt】键,单击【层】面板中的位图图层,可以根据位图的形状获得选区。

  技巧11:绘制多个选区时,按住【Shift】键表示增加选区;按住【Alt】键表示减选区;按住【Shift】+【Alt】键表示对选区进行交集运算。

  技巧12:在给选区填充颜色时,可以使用【Alt】+【Delete】键快速填充颜色,与photoshop里填充前景色的快捷键一样。

  技巧13:按快捷键【Ctrl】+【F8】,可以创建一个新的元件。

  技巧14:按住【Ctrl】键,单击【混色器】面板下方的颜色栏,可以快速切换到不同的颜色模式。

  技巧15:在颜色弹窗口采集颜色时,按住【Shift】键可以确保获得的颜色为网络安全色。

  技巧16:如果要给辅助线精确定位,可以在辅助线上双击鼠标左键,在弹出的【移动引导线】对话框中输入详细的坐标。

  技巧17:在【层】面板中,选中蒙板图标并像移动图层那样按住蒙板图标将其移动到其他位置,这样可以删除蒙板,并且保留下了蒙板对象。

  技巧18:使用【文本】工具单击已经创建的文本,待光标转换为文本光标时,按住键盘上的【Ctrl】加键盘的左右键可以用来改变字符间距,按住【Ctrl】加键盘的上下键可以用来改变文本的行距。

  学习辅导教材,网络上有很多文字图片类的和视频类的教程。另外看书本结合练习也是很好的选择!

  羽化方法

  用Fireworks对位图边缘进行羽化,这是在fireworks运用中常用到的功能,希望对大家学习fireworks有所帮助。

  方法一

  一、导入位图

  二、用椭圆工具,在位图上画一个椭圆,填充色为黑色。并在其fill面板中,设置edge为feather,默认为10,不过我们可以设得比较大。

  三、用黑色箭头工具全选这二个物体。

  四、菜单modify中的mask命令,并在其后序菜单中选择group as mask.

  五、这样图片边缘羽化也就完成了。用mask做羽化有一个好处,就是当你选择这个图片时,边框是蓝色的时候,选中当中的蓝色标记,就能把改变图片的位置。呵呵,这样你就不需要担心选择的地方不正确了,只要确定好最终的图片大小 ,就能随意调节羽化图片的哪一部份。

  六、取消羽化。Modify菜单的最下面命令,ungroup,就能取消羽化,把图片还原成原先的位图和黑色的椭圆形。

  方法二

  一、在文件中导入一张需要被羽化的位图(菜单 %26gt; file %26gt; import)

  二、在工具栏中选择椭圆形选择工具或是矩形选择工具,在位图需要羽化的部位进行选择。

  三、菜单 %26gt; modify %26gt; marquee %26gt; feather命令。

  四、在featherselection对话框中设置羽化的半径,这里我选了20个象素,点击OK

  五、用黑色箭头工具,把这个选择框拉到一边,相应的图片也跟着移到旁边。

  六、我们可以把不需要的图片删除,也可以把这个已经羽化完了的图片复制到别的文件中去。

【firework使用基础知识】相关文章:

firework绘制灯泡的方法11-11

计算机一级基础知识电子邮件使用技巧03-10

Photoshop的基础知识08-10

cpu基础知识02-24

Java基础知识精选02-20

泰语入门基础知识03-03

C语言基础知识12-20

PS入门基础知识03-19

PS基础知识汇总03-03

计算机考试基础知识:网络安全基础知识06-08