试谈网站设计之我见

网 站 设 计 之 我 见,越城区鲁迅小学 周建刚,一、网站的基本要素,1、网站的标志(logo)。首先你需要设计制作一个网站的标志(logo)。就如同商标一样，logo是你站点特色和内涵的集中体现，看见logo就让大家联想起你的站点。注意：这里的logo不是指88X31的小图标banner,而是网站的标志。 标志可以是中文，英文字母，可以是符号，图案，可以是动物或者人物等等。比如：soim是用soim的英文作为标志，新浪用字母sina+眼睛作为标志。标志的设计创意来自你网站的名称和内容。最常用和最简单的方式是用自己网站的英文名称作标志。采用不同的字体，字母的变形，字母的组合可以很容易制作好自己的标志。,2、网站的标准色彩。网站给人的第一印象来自视觉冲击，确定网站的标准色彩是相当重要的一步。不同的色彩搭配产生不同的效果，并可能影响到访问者的情绪。 “标准色彩”是指能体现网站形象和延伸内涵的色彩。举个实际的例子就明白了：IBM的深蓝色，肯得基的红色条型，windows视窗标志上的红蓝黄绿色块，都使我们觉得很贴切，很和谐。如果将IBM改用绿色或金黄色，我们会有什么感觉？ 一般来说，一个网站的标准色彩不超过3种，太多则让人眼花缭乱。标准色彩要用于网站的标志，标题，主菜单和主色块。给人以整体统一的感觉。至于其它色彩也可以使用，只是作为点缀和衬托，绝不能喧宾夺主。 一般来说，适合于网页标准色的颜色有：蓝色，黄/橙色，黑/灰/白色三大系列色。,3、网站的标准字体。和标准色彩一样，标准字体是指用于标志，标题，主菜单的特有字体。一般我们网页默认的字体是宋体。为了体现站点的“与众不同”和特有风格，我们可以根据需要选择一些特别字体。例如，为了体现专业可以使用粗仿宋体，体现设计精美可以用广告体，体现亲切随意可以用手写体等等。你可以根据自己网站所表达的内涵，选择更贴切的字体。目前常见的中文字体有二三十种，常见的英文字体有近百种，网络上还有许多专用英文艺术字体下载，要寻找一款满意的字体并不算困难 需要说明的是：使用非默认字体只能用图片的形式，因为很可能浏览者的PC里没有安装你的特别字体，那么您的辛苦设计制作便付之东流啦！,二、网站设计的一般步骤：,网站总体设计 总体设计是非常关键的一步。它主要确定： 1、网站需要实现哪些功能； 2、网站开发使用什么软件，在什么样的硬件环境；,整体形象设计 整体形象设计包括标准字，Logo，标准色彩，广告语等。 首页设计包括版面，色彩，图像，动态效果，图标等风格设计，也包括banner，菜单，标题，版权等模块设计。首页设计完成后，你的网站的整体风格就基本确定下来了。,开发制作 需要提醒的是，由于现在的系统多数都为ASP程序，需要随时测试网页与程序，发现Bug立刻修改。不要等到完全制作完毕再测试，这样会浪费大量的时间和精力。,调试完善 在网站初步完成后，上传到服务器，对网站进行全范围的测试。包括速度，兼容性，交互性，链接正确性等等。,宣传 推广 宣传推广的基本方法有： 1、各搜索引擎登录； 2、交换链接； 3、准备新闻稿件在各新闻公告板发表； 4、合理使用Email邮件列表； 5、广告条交换； 6、付费广告。,三、网站制作的工具介绍,1、图像处理工具： Photoshop 等,2、动画设计工具： Flash Fireworks等,3、网页编制工具： Fronntpage Dreamweaver等,四、介绍几个适合做学校网站的免费新闻系统：,1、动力文章管理系统（http:/www.asp163.net),2、沸腾展望系统（http:/www.feitium.net),3、动网新闻系统（http:/www.xmlasp.net）,4、乔客新闻系统（http:/www.joekoe.com）,以上系统，都包括前台和后台两个部分。,五、结合我校网站，如何利用沸腾展望系统来制作网站。,沸腾系统的优缺点：,优点：功能强大、调用灵活、结构简单。,缺点：速度慢、安全性较差。,1、基本熟悉网站中各个文件的作用及后台管理。,2、动手修改（DIY）。（用三个网页制作一个网站）,（由于系统已经提供了较为完善的体系，所以如何修改原有文件这里就不提到了。）,操作步骤：,Daodu.asp：可同时调用图片和文字新闻、类似文件可调用后台置顶新闻。,B、Bigclassdeta.asp：所有文章列表。去掉一些不用的花哨的功能。,C、Readnews.asp：文章详细内容页面，同样去掉一些不用的功能，不过很多功能后台可以设置开关，不必多修改。,A、主页：Index.asp 网站总体内容展示、主要栏目调用。搜索栏、公告栏、友情链接栏、调查栏等。,News.asp ：新闻调用，可设置参数。,Picnews.asp：图片调用，可设置参数。类似的一个文件还可以图片滚动调用。,有了这三个文件，加上一个后台，一个最简单的网站就做好了。接下来是如何进一步美化网站。,1、修改Top.asp、Bottom.asp文件。,2、修改一些要用到的页面文件：如搜索页Result.asp，按需修改。,美化的几个小技巧：,1、灵活使用“错位”,如：文章列表的一般页面为Top.asp+Bigclassdeta.asp+Bottom.asp；适当修改Top.asp、 Bottom.asp，保存成Top1.asp、 Bottom1.asp等类似文件，重新组合Top1.asp+Bigclassdeta.asp+Bottom1.asp，就成了一个全新的页面。,3、多看看设计精美的站点，在能力有限的情况下，甚至可以“暂时借用”一些素材。,2、合理地运用系统提供的功能，可能做出无数个不同风格的子网站出来。,一个好的网站=精美的页面设计（30%）+丰富的内容（70%）,六、网站设计过程中需要注意的几个问题：,1、由于采用了ASP+ACC数据库的架构，特别要注意完全问题。,A、数据库要改名：一般改后缀名为ASP的格式，再修改相应文件的数据库链接。,B、数据备份：除数据库外的文件只需在本地备份一次，数据库文件有条件要做到经常备份。,D、多去官方网站转转，了解版本升级情况及安全补丁。,C、没必要的话，关闭用户注册，越开放自然就越不安全。,2、如何使页面访问的速度尽可能的快：,A、不要让不必非要用的声音和图像充斥网页，也不要把文件做得太长以至于在装载文件时让读者等得脚后跟发凉，因此使用图像时要谨慎；大的图像显然会降低页面建立的速度，但许多需要顺序装载的小图像也会如此。在发新闻照片时一定要注意图片的大小，这一点很容易被我们忽视。适当照顾外网或窄带用户。,B、制作网页时尽可能不要用一整张表格，使用多张表格显然要比使用一整张表格的下载速度更让读者能够接受。,A、合理利用短的段落，加点列示，适当列示，适当的整块引用文字，用水平线分节，用影象地图指引主要连接，使你的页面能吸引人和容易阅读。,B、没特殊要求，不要在每一页使用风格不同的图标。,3、其它需要注意的地方：,C、对用作背景的GIF要谨慎。它们可以使一个页面看起来很有趣，甚至很专业，但是装饰背景很容易使文字变得不可辨读，要把背景做得好，光有颜色对比是不够的。背景要么很亮(文字较暗)要么很暗(文字较亮)。如果背景含图像，对比度要较低才不至于过于分散读者的注意力。,D、尽可能地不要让读者浏览网站时出现左右滚动条。有条件的话，可以使用百分比来制作网站。,E、不要加载任何攥改主页、修改注册表、传播病毒的代码，或者是如3721中文网址、新浪新闻等插件包。,和许多人一样，我也是一只很菜很菜的菜鸟，不会编写任何的ASP语言，也基本不懂什么数据库写法，很希望得到大家真诚的帮助。欢迎大家访问鲁迅小学网站和我的个人主页。,我的结束语,