总有人在那里炫耀自己的 ps(photoshop)技术, 好象是平面就要用 ps 做, 结果很多做网页的设计师也用 ps 做平面图然后切割导图, 再 做网站, 今天我就来说说用 fireworks 一样可以做出好的网页设计, 只要你有心!
先看最终效果图:
点击放大
下面开始讲解:
1. 布局
先来说一下 我们制作网页一般的大小
高度：没有一个固定值，因为每个人的浏览器的工具栏不同，我见过有的浏览器工具栏被插件占了半个屏幕，所以高度没有确切值。
宽度：
1、在 IE6.0 下，宽度为显示器分辨率减 21，比如 1024 的宽度 -21 就变成 1003。但值得注意的是 IE6.0(或更低)无论你的网页多高都会有右侧的滚动条框。
2、在 Firefox 下，宽度的分率辨减 19。比如 1024 的宽度 -19 就变成 1005
3、在 Opear 下，宽度的分率辨减 23。比如 1024 的宽度 -23 就变成 1001
注：Firefox 或 Opear 在内容少于浏览器高度时不显示右侧滚动条。
所以如果是 1024 的分辨率，你的网页不如设成 1000 安全一点。
如果是 800 的分辨率一般都设成 770。
这些需要明白并且牢记, 不然很可能做出来不符合浏览器要求, 不过一般我们都回设定的再稍微小一点, 应为有些浏览器加了插件或者其他的东西宽度会有变化 所以 800 的分辨率一般设定 760 左右,1024 的设定 990 左右.
我这样用辅助线和标尺把大概范围划分出来, 注意我的划分, 正好是 770, 和 1000 的地方, 应为我要做的网站是 1024 分辨率下的, 但是考虑到依然可能存在 800 分辨率的用户, 所以我回把主要的内容和菜单都放置在 770 以内,770-1000 的地方放一些辅助的东西, 这个习惯特别是在做一些门户网站设计的时候更要考虑以下, 毕竟改善用户体验也是我们要考虑的问题.