按照网站的制作流程,在网站前期策划结束之后将要进入网站的页面细化及实施阶段。这一步,首先需要根据策划书的要求,设计出网站效果图。一般在策划书中已经明确了网站的内容、风格、功能等,那么效果图就要紧紧围绕着已经确定的策划方案来展开设计。具体可以从以下几个方面入手。
1、页面色彩搭配方案设计:
不同的颜色表达不同的情感,同种颜色明度、纯度变化又可以给人不同的感觉,各种颜色互相搭配又可以产生更多的变化。页面上色彩如何选择和搭配当然首先要符合站点的内容、风格、功能,在满足了这三者要求的基础上再力求美观。网页中也有一些常用的配色方法,例如:选择一种颜色作为主色,用主色作明度、纯度变化后拉开几个层次,然后搭配黑、白、灰等无彩色来进行页面的色彩搭配,这样设计出的页面会显得很协调,但是要避免过于沉闷。再如:利用色相环选择相隔一定夹角的两种颜色来进行页面的色彩搭配,以其中一种颜色为主色,另一种颜色为辅色等等。总之,笔者认为:对色彩的把握要靠设计师的感觉和经验,平时多看一些设计优秀的网站,分析一下别人是怎样进行色彩搭配的,将对自己的设计大有裨益。
2、页面排版布局方案设计:
在上一节我们已经分析了网页的基本构成要素。从整体上来说,每个页面都会有页头、页脚。页头上需要放置网站名称、标志等重要信息;页脚上放置版权信息、联系方式、辅助导航等次重要信息。中间的主导航及主要内容区则会有较多的变化。这一部分的安排主要根据站点的内容和功能来确定。如果是内容繁多的站点,可能比较适合用多栏的排版布局方式。站点的主要内容或者站点提供的重要功能,则需要放置在页面视觉焦点的位置,以便浏览者一眼就能看到。
3、网站系列插图(动画)设计:
插图和动画是网页装饰必不可少的元素。在每幅页面上,插图(动画)都会有主次之分。表现页面主题的主图形(动画)会在页面上占有重要位置。这类的主图形(动画)如果能按照同一个主题,在网站各栏目首页中又根据各自的不同特点设计绘制,形成一套系列图片,则可以使网站各栏目系列感增强,提升站点整体质量。
除了主图形外,简单精致的系列小图标在网站中也大有用武之地。我们都知道使用合适的图形有时可以更加直观地表达意思。将网站的文字导航变成系列导航图标,可使站点更加有趣、表意更加直观。4、网站导航系统设计:
网站导航系统设计得方便与否将直接关系到站点的可用性以及用户体验。在前期策划中,当站点的分层内容结构图绘制出来之后,其中可能会有三层至四层的内容结构层次,要让这些下层页面方便地被用户找到,就需要设计便捷的导航系统。一般网站首页中都有主导航条,主导航条是在首页和各栏目首页中跳转的工具。具体进入某栏目之后,为了方便地进入本栏目的下层页面,就需要用到本栏目内的导航条。它负责在本栏目中的各个分栏目中跳转。同时主导航条也不能消失,因为用户随时有可能需要回到首页或跳转到其他栏目中去。此时的页面可能会同时出现主导航和次导航两条导航条,或者用Flash或Java Script等制作出鼠标指针经过时自动跳出下层导航的效果,从而实现在多层次页面中的方便跳转。
5、网站标题字体设计:
和所有的平面设计一样,在网站效果图中字体也是很重要的一部分。所不同的是在网页中正文部分的字体不需要我们做过多的变化。在Dreamweaver等网页编辑软件中,以默认值宋体显示的字体最清晰、最容易阅读。字体大小一般设置为12像素或14像素最合适。而对于标题字体的使用则需要设计师们作一番思考。如果使用现有中文字体,一定要选择与站点风格相吻合的字体,且在一个网站中标题字体以选择一到两种为宜,不可过多过花。如果自行设计,可以在现有字体基础上作变化,也可以完全按自己的思路重新设计一种符合站点特色的字体。另外,标题字体最后都必须以图片的形式插入页面,以确保在浏览者电脑中得以正确显示。