《Fireworks设计制作漂亮网.docx》由会员分享，可在线阅读，更多相关《Fireworks设计制作漂亮网.docx（3页珍藏版）》请在三一文库上搜索。
1、Fireworks 设计制作漂亮网页总有人在那里炫耀自己的 ps(photoshop) 技术,好象是平面就要用 ps 做,结果 很多做网页的设计师也用 ps 做平面图然后切割导图,再做网站,今天我就来说 说用 fireworks 一样可以做出好的网页设计,只要你有心 !先看最终效果图 :下面开始讲解 :1. 布局先来说一下 我们制作网页一般的大小高度：没有一个固定值, 由于每个人的浏览器的工具栏不同, 我见过有的浏览器工 具栏被插件占了半个屏幕,所以高度没有确切值.宽度：1、在 IE6.0 下,宽度为显示器分辨率减 21,比方 1024的宽度 -21 就变成 1003.但值得注意的是 IE6.
2、0( 或更低) 无论你的网页多高都会有右侧的滚动条框.2、在 Firefox 下,宽度的分率辨减 19.比方 1024的宽度 -19 就变成 10053、在Opear下,宽度的分率辨减 23.比方1024的宽度-23就变成1001 注：Firefox或Opear在内容少于浏览器高度时不显示右侧滚动条. 所以如果是 1024的分辨率,你的网页不如设成 1 000平安一点.如果是 800 的分辨率一般都设成 770.这些需要明白并且牢记, 不然很可能做出来不符合浏览器要求, 不过一般我 们都回设定的再稍微小一点, 应为有些浏览器加了插件或者其他的东西宽度会有 变化 所以 800 的分辨率一般设定
3、760左右, 1024的设定 990左右.我这样用辅助线和标尺把大概范围划分出来,注意我的划分,正好是 770, 和 1000的地方,应为我要做的网站是 1024分辨率下的, 但是考虑到依然可能存 在800分辨率的用户,所以我回把主要的内容和菜单都放置在 770以内, 770-1000 的地方放一些辅助的东西, 这个习惯特别是在做一些门户网站设计的时候更要考 虑以下,毕竟改善用户体验也是我们要考虑的问题 .2. 开始工作我们继续讲解, 现在我们来画上部菜单局部的内容, 其实很简单拉, 就是画 一个方框,一个圆,然后组合,加上渐变就可以了,如下列图设置3. 下面我们来画哪个类似徽章的东西 其实也
4、很简单, 创意是类似奖状上贴的哪个获奖标志一样, 会让网站生动一 点,嘿嘿 .八、5八、八、我们选择多边形,如图 :设置如下,继续贴图,大家要注意一下列图层顺序,拖动到下层就好了恩 要注意,这个图层我们固定了以后通常就不动了,所以要锁定,不然鼠 标晃来晃去很容易把图移位,注意图层那里点一下就多了一个小锁子,方便吧, 这下他就彻底不干扰我们了 !好的我们继续,其实其他的东西都大同小异我们来研究一下细节 .我最喜欢的就是 firewroks 超级多的纹理,在 ps 里面有些纹理要自己做真 的好麻烦啊 !我最喜欢的对角线,恩 看页面左边的渐变局部, 其实就是拉出来了一个矩形, 然后加上线性的渐变, 然 后加上对角线的纹理,稍微调整一下透明度,就这么简单,效果却很好看,嘿嘿下一个小地方,就是产品资讯的背景框,其实也很简单 就是一个矩形,然后外框为红色,矩形加一个内部发光,发浅灰色的光,就 这样就成了下一个地方 就是右上角大家可以看到一个类似网格的底纹 其实就是一个矩形,再加上一个蒙版,一个渐变,就 ok 了,现在看起来是 不是生动很多,嘿嘿OK看图就这样一个网站的平面设计三下五除二的就搞定了,嘿嘿,怎么样 fireworks 方便不 !OK今天就到这里,再欣赏一下我们的作品吧,不错吧 ！3文章来源网络,仅供参考