FW设计资源小总集

学习FW有两年了,投入工作中使用也有一年多。虽然没有多少业余时间去专门研究过,也不是专门给人家接单做网站的工作,但做门户、娱乐性的网站也有不少了,总还是能从软件的应用中,综合其他的网页模仿中有些总结的。希望结合我的总结和理解,给使用FW设计网页的朋友一些帮助。或是说给新人一些启发。

以下内容,基于门户网站首页。不过大部分也该适应于多类页面的。
结构上来说,应该先从top的logo,到navi,banner,然后才到title。不过,我也不知道我总结和集合的东西能不能真的给大家帮助,所以,就先从我最想说的说起。(之前已经有过一篇“文字效果总结”)

Titile篇
网页内容的标题部分Title,一般是与内容list相结合来设计。在风格上寻求了统一,甚至可以用简单的几“笔“就可以妙笔生花。
常见的Title从左到右是:标识箭头,标题文字,“More(更多)"。
这里有几种常用到的Title效果总结:
注意几点:1.文字大小,用色,文字和图片这间的距离。这是一种设计技巧,我这不是专家的,就不瞎扯。和我一样没有专业常识的,工作中经验会告诉你怎样放着才好看的。
2.用好了背景框,可以达到很好的效果,但是不能滥用。你别看他放在下面这些图片都蛮好看的,可是用到网页中,还是要适当的和页面效果进行搭配的。
单色Title


图标打头


图和线

和内容的结合
和内容的结合,重在结构和用色。不一定要有多震撼,多花俏,根本你需要的风格(页面的整体风格,和网站的性质)来确定线条。
在白色区域的简单构造美


神奇的背景图和背景色(更适合娱乐、休闲性质的风格板块)


各种各样的盒子

点击在新窗口查看全图
CTRL+鼠标滚轮放大或缩小


用到一万年的册子式盒子:

点击在新窗口查看全图
CTRL+鼠标滚轮放大或缩小


百用不烦的针夹定点盒子:

关于图标
FW制作图标的教程已经很不鲜见,随便找两个放一下:

图标有单色,多色,水晶,矢量,像素,线条等多种风格。我做的实在不多,而且水平不咋地。随便拿几个来献一下丑。
以下提供几个我在工作中做的小图标源文件:


Title除文字设计图和内容表示图之外,用到最多的指示图有以下几种(部分源文件):

今天到此,以后再添其他的^_^