《信号与系统》精品课程网站的设计与维护.docx
- 文档编号:8622902
- 上传时间:2023-02-01
- 格式:DOCX
- 页数:24
- 大小:106.19KB
《信号与系统》精品课程网站的设计与维护.docx
《《信号与系统》精品课程网站的设计与维护.docx》由会员分享,可在线阅读,更多相关《《信号与系统》精品课程网站的设计与维护.docx(24页珍藏版)》请在冰豆网上搜索。
《信号与系统》精品课程网站的设计与维护
摘要
当今中国网络的发展可谓日新月异。
它已从最初的教育领域扩展到了各行各业,网站几乎成了网络的代名词。
而网站的设计制作与维护技术也就成为大家研究和讨论的热点。
本论文共分六章主要研究了《信号与系统》精品课程网站的设计建立及维护问题。
对企业网站的建立所涉及到的诸多实用技术进行了讨论。
首先对网站的设计理念与原则进行了详尽的阐述,然后又简要介绍了网页制作的几种工具,如网页制作常用软件,图象处理软件,链接,CSS样式等等。
最后又对建成网站后的维护及推广等工作做了简要介绍。
在实际创作过程中我们主要运用了Dreamweaver、photoshop等图象处理软件,最终完成了对《信号与系统》精品课程网站的建立。
关键词:
网站网页链接创意设计(CI)CSS样式DreamweaverPhotoshop
ABSTRACT
NowadaysthenetworkhasdevelopedrapidlywithcontinuouschangesandimprovementsinChina.Fromprimaryeducationrealm,thenetworkhasfoundmanyapplicationsinallfields.Websitenearlybecomesthenetwork'salternativename.Thewebsite'sdesignandmaintaintechniquebecomeahotpointinmanyperson'sresearchworkanddiscussiontopics.
Thisthesisincludessixchaptersfortheproblemofestablishmentandmaintenancesignalsandlinearsystemsenterprisewebsite.Manypracticaltechniquesforbusinessenterprisewebsitedesignarediscussedinthispaper.First,itelaboratelyexpatiatesdesigntheoryandprincipleaboutthedesignofwebsite,thenbrieflyintroducesafewtoolsusedinthedesignofwebpage,suchassoftwareincommonuseofthewebpagecreation,imagemanipulationsoftware,CSSstyleandsoon.Atlength,itinbrieflyintroduceshemaintenanceandpopularizationofwebsiteafterbeingdesignedinthepracticallydesigncourse.Wemainlyuseimagemanipulationsoftware,suchasdreamweaver,Photoshopandsoon.
FinallyawebsiteconstructionforsignalsandlinearsystermsFineryCo.Ltdiscompleted.
Keywords:
websiteCIwebpageCSSstyleDreamweaverPhotoshop
一设计理念与原则:
建立一个成功的网站……………………………….5
1.1定位网站的主题与名称...........................................................................6
1.2定位网站的CI形象…………………………………...............................7
1.3确定网站的栏目………………………………………………………….9
1.4确定网站的目录结构…………………………………………………...10
1.5确定网站的链接结构…………………………………………………..11
1.6设计网站的整体风格…………………………………………………...12
二网页制作工具简介……………………………………………………..14
2.1HTML超文本标记语言简介..................................................................14
2.2所见即所得的Web页开发工具……………………..............................16
2.3制作网页静态图象的工具……………………………………………...17
2.4制作网页动画的工具…………………………………………………...18
2.5网页图象减肥工具……………………………………………………...19
2.6动态网页制作工具……………………………………………………...20
三《信号与系统》精品课程网站的制作规范...................................................24
3.1导航规范…………………………………………….............................24
3.2网站框架……………………………………………………………….25
3.3网页制作技术要求…………………………………………………….26
四设计实例:
《信号与系统》精品课程网站的设计与维护……………….27
4.1概述…………………………………………………………………….27
4.2《信号与系统》精品课程网站的设计与实现…………………………..27
4.3《信号与系统》精品课程网站的维护…………………………………..34
4.4网站的推广…………………………………………………………….36
五总结与体会………………………………………………………………...37
六结束语……………………………………………………………………...38
七参考文献…………………………………………………………………...39
一设计理念与原则:
建设一个成功的网站
随着网络技术的不断发展,网络应用已经渗透到人类社会的各个角落。
作为网络世界的支撑点的网站,更是人们关注的热点:
政府利用网站宣传自己的施政纲领,日益成为与百姓交流的直通车;企业利用网站宣传自己的形象,挖掘无限商机;个人利用网站展现个性风采,创建彼此沟通的桥梁。
越来越多的人希望拥有网站,开辟网络世界里的一片天空。
如何设计一个出色的站点呢?
关于这一点人们讨论的很多。
因为网络技术的迅猛发展,也就很难提出一个绝对权威和正确的设计思路。
在这里,我根据这段时间以来的设计体会,就如何设计与维护一个企业网站进行阐述。
我们设计企业网站的理念首先应该是简洁清新。
这对于一个成功的企业网站是非常关键的一点。
我们力求达到让浏览者尽快找到他想要知道的关于本企业的信息但又不让浏览者感觉太平淡。
这就要求设计者在文字和图片上达到一种平衡,使网站充实而又丰富多彩。
就我个人而言我觉得建立企业网站应该注意下面几个方面:
1、介绍公司的情况:
对于一个企业网站来说,这是至关重要的。
毕竟作企业网站的目的就是为了宣传自己的企业形象。
2、介绍公司的产品及网上销售。
就中国电子商务的现状而言,只适合少量的大型企业,对中小型企业还不很适用。
3、通过网站达到与外界的一种交流。
建立客户留言系统,随时了解客户对公司及产品的意见和建议。
4、网站的信息必须经常更新。
主页设计的好自然会吸引人们的注意,但只能是一次两次,要想长期吸引住浏览者,最终靠内容的不断更新。
本论文拟从主题定位,浏览群定位,形象包装,网站结构等方面介绍如何设计网站。
寻求设计网站的一条基本思路。
1.1定位网站的主题与名称
网站的主题也就是网站的题材。
网站题材琳琅满目,下面是美国《个人电脑》杂志评出的99年度排名前100位的全美知名网站的十类题材:
第一类:
网上求职
第二类:
网上聊天/即时信息/OICQ
第三类:
网上社区/讨论/邮件列表
第四类:
计算机技术
第五类:
网页/网站开发
第六类:
娱乐网站
第七类:
旅行
第八类:
参考/资讯
第九类:
家庭/教育
第十类:
生活/时尚
题材已经确定以后,就可以围绕题材给网站起一个名字。
网站名称,也是网站设计的一部分,而且是很关键的一个要素。
你来看,"电脑学习室"和"电脑之家"显然是后者简练;"迷笛乐园"和"MIDI乐园"显然是后者明晰;"儿童天地"和"中国幼儿园"显然是后者大气。
我们都知道PIII的中文名称"奔腾",如果改为"奔跑",可能就没有今天这么"火"了。
和现实生活中一样,网站名称是否正气,响亮,易记,对网站的形象和宣传推广也有很大影响。
我的建议是:
1、名称要正
其实就是要合法,和理,和情。
不能用反动的,色情的,迷信的,危害社会安全的名词语句。
2、名称要易记
最好用中文名称,不要使用英文或者中英文混合型名称。
另外,网站名称的字数应该控制在六个字(最好四个字)以内,四个字的也可以用成语。
字数少还有个好处,适合于其他站点的链接排版。
3、名称要有特色
名称平实就可以接受,如果能体现一定的内涵,给浏览者更多的视觉冲击和空间想象力,则为上品。
例如:
音乐前卫,网页陶吧,e书时空等。
在体现出网站主题的同时,能点出特色之处
1.2定位网站的CI形象
所谓CI(corporateidentity),意思是通过视觉来统一企业的形象。
一个杰出的网站,和实体公司一样,需要整体的形象包装和设计。
准确的,有创意的CI设计,对网站的宣传推广有事半功倍的效果。
具体的做法是:
1、首先要清楚建立网站的目的。
是要维持访问率还是要提高交易量,还是要树立品牌还是要建立与客户的关系?
因此,传达的信息与您的竞争者划清界线,给人鲜明的独特性,这是网站CI的最重要的部分。
2、设计网站的标志(logo)
就如同商标一样,标志是一个站点特色和内涵的集中体现,看见标志就让大家联想起你的站点。
标志的设计创意来自你网站的名称和内容:
(1)网站有代表性的人物、动物、花草等,可以用它们作为设计的蓝本,加以卡通化和艺术化,例如迪斯尼的米老鼠,搜狐的卡通狐狸等等。
(2)网站有专业性的,可以以本专业有代表的物品作为标志。
比如中国银行的铜板标志,奔驰汽车的方向盘标志等等。
(3)最常用和最简单的方式是用自己网站的英文名称作标志。
采用不同的字体,字母的变形,字母的组合可以很容易制作好自己的标志。
3、设计网站的标准色彩
网站给人的第一印象来自视觉冲击,确定网站的标准色彩是相当重要的一步。
不同的色彩搭配产生不同的效果,并可能影响到访问者的情绪。
举个实际的例子就明白了:
IBM的深蓝色,肯得基的红色条型,windows视窗标志上的红蓝黄绿色块,都使我们觉得很贴切,很和谐。
"标准色彩"是指能体现网站形象和延伸内涵的色彩。
一般来说,一个网站的标准色彩不超过3种,太多则让人眼花缭乱。
标准色彩要用于网站的标志,标题,主菜单和主色块,给人以整体统一的感觉。
一般来说,普通的底色应柔和一些,素一些,淡一些,配上黑字读起来自然流畅。
当然其他的颜色也可以用,只是作为点缀和衬托,绝对不能喧宾夺主。
设计要符合公司现阶段的宣传方针,同公司在其他媒体上的公告最好遥相呼应,如:
以非常稳重的蓝色作为底色表明该公司的实力雄厚而且科研态度严谨。
在底色上配以时髦的亮色如绿色则表明公司在发展中走在最前列。
无论是平面设计,还是网页设计,色彩永远是最重要的一环,当我们距离显示屏较远的时候,我们看到的不是优美的版式或者是美丽的图片,而是网页的色彩。
关于色彩的原理有许多,在此我们不可能一一阐述,大家可以看看相关设计书籍,有利于系统地理解,在此我们仅仅想告诉大家一些网页配色时的小技巧。
用一种色彩。
这里是指先选定一种色彩,然后调整透明度或者饱和度,(说得通俗些就是将色彩变淡或则加深),产生新的色彩,用于网页。
这样的页面看起来色彩统一,有层次感。
用两种色彩。
先选定一种色彩,然后选择它的对比色。
用一个色系。
简单的说就是用一个感觉的色彩,例如淡蓝,淡黄,淡绿;或者土黄,土灰,土蓝。
在网页配色中,还要切记一些误区
不要将所有颜色都用到,尽量控制在三种色彩以内。
不要选择色彩太鲜艳的颜色作为文字背景,页面文字颜色的设置应与缺省页面背景相配,是访问者可以轻松的访问,不然就不会有回头客了。
另外还要注意避免使用非标准的链接颜色。
未访问的链接用蓝色访问过的用红色或紫色,最好不要将这些颜色与其他颜色相混淆。
4、设计网站的标准字体
和标准色彩一样,标准字体是指用于标志,标题,主单的特有字体。
一般我们网页默认的字体是宋体。
为了体现站点的"与众不同"和特有风格,我们可以根据需要选择一些特别字体。
例如,为了体现专业可以使用粗仿宋体,体现设计精美可以用广告体,体现亲切随意可以用手写体等等。
5、设计网站的宣传标语
也可以说是网站的精神,网站的目标。
用一句话甚至一个词来高度概括。
类似实际生活中的广告金句。
例如:
鹊巢的"味道好极了";麦斯威尔的"好东西和好朋友一起分享";Intel的"给你一颗奔腾的心"等等。
1.3确定网站的栏目
建立一个网站好比写一篇文章,首先要拟好提纲,文章才能主题明确,层次清晰。
如果网站结构不清晰,目录庞杂,内容东一块西一块。
结果不但浏览者看得糊涂,自己扩充和维护网站也相当困难。
网站的题材确定后,并且收集和组织了许多相关的资料内容,但如何组织内容才能吸引网友们来浏览网站呢?
栏目的实质是一个网站的大纲索引,索引应该将网站的主体明确显示出来。
一般的网站栏目安排要注意以下几方面:
1、要紧扣主题
将你的主题按一定的方法分类并将它们作为网站的主栏目。
主题栏目个数在总栏目中要占绝对优势,这样的网站显的专业,主题突出,容易给人留下深刻印象。
2、设立最近更新或网站指南栏目
设立"最近更新"的栏目,是为了照顾常来的访客,让你的主页更有人性化。
如果主页内容庞大,层次较多,而又没有站内的搜索引擎,设置"本站指南"栏目,可以帮助初访者快速找到他们想要的内容。
3、设立可以双向交流的栏目
比如论坛,留言本,邮件列表等,可以让浏览者留下他们的信息。
4、设立下载或常见问题回答栏目
网络的特点是信息共享。
如在你主页上设置一个资料下载栏目,便于访问者下载所需资料。
另外,如果站点经常收到网友关于某方面的问题来信,最好设立一个常见问题回答的栏目,既方便了网友,也可以节约自己更多时间。
1.4确定文章的目录结构
目录结构的好坏,对浏览者来说并没有什么太大的感觉,但是
对于站点本身的上传维护,内容未来的扩充和移植有着重要的影响……
首先我们要对文档进行归类,以确定哪些是要在首页上或者一级页面上就要向浏览者表明的,哪些可以放在子栏目中的。
分类完毕后统计出新版网站有多少个栏目每个栏目有多少个页面,每个页面的具体内容及名称。
统计完毕后要有一个网站文件明细表最好是树型图。
目录结构的好坏对于站点本身的上传维护,内容未来的扩
充和移植有重要影响。
下面是建立目录结构的一些建议:
1、不要将所有文件都存放在根目录下。
你常常搞不清楚哪些文件是需要编辑和更新的。
哪些文件可以删除哪些文件是相关联的。
这就影响了工作效率。
另外使的上传,速度很慢,所以尽可能的减少根目录文件的存放数。
2、按栏目内容建立子目录
子目录的建立,首先按主菜单栏目建立。
例如:
企业站点可以公司简介,产品介绍,价格,在线定单,反馈联系等建立相应目录。
其他的次要栏目,类似what'snew,友情连接内容较多,需要经常更新的可以建立独立的子目录。
所有程序一般都存放在特定目录。
所有需要下载的内容最好也存放在一个目录下。
3、在每个主栏目目录下都建立独立的images目录
为每个主栏目建立一个独立的images目录是最方便管理的。
而根目录下的images目录只是用来放首页和一些次要栏目的图片。
4、目录的层次不要太深
目录的层次建议不要超过3层,维护管理方便。
5、不要使用中文目录
6、不要使用过长的目录
1.5确定网站的链接结构
网站的链接结构是指页面之间相互链接的拓扑结构。
它建立在目录结构基础之上,但可以跨越目录。
建立网站的链接结构有两种基本方式:
1树状链接结构
类似DOS的目录结构,首页链接指向一级页面。
一级页面指向二级页面。
这样的链接结构浏览时,一级级进,一级级出。
优点是条理清晰,访问者明确知道自己在什么位置,不会迷路。
缺点是浏览效率低,一个栏目的子页面到另一个栏目的子页面必须绕经首页。
2、星状链接结构
类似网络服务器的链接,每个页面相互之间都建立有链接。
这种链接结构的优点是浏览方便,随时可以到达自己喜欢的页面。
缺点是链接太多,容易使浏览者迷路,搞不清自己在什么位置,看了多少内容。
这两种基本结构都只是理想方式,在实际的网站设计中,总是将这两种结构混合起来使用,达到比较理想的效果。
比较好的方案是:
首页和一级页面之间用星状链接结构,一级和以下各级页面之间用树状链接结构。
1.6设计网站的整体风格
风格(style)是抽象的,是指站点的整体形象给浏览者的综合感受。
这个"整体形象"包括站点的CI(标志,色彩,字体,标语),版面布局,浏览方式,交互性,文字,语气,内容价值,存在意义,站点荣誉等等诸多因素。
举个例子:
我们觉得网易是平易近人的,迪斯尼是生动活泼的,IBM是专业严肃的,这些都是网站给人们留下的不同感受。
风格是独特的,是站点不同与其他网站的地方。
或者色彩,或者技术,或者是交互方式,能让浏览者明确分辨出这是你的网站独有的。
例如新世纪网络的黑白色,网易壁纸站的特有框架,即使你只看到其中一页,也可以分辨出是哪个网站的。
风格是有人性的。
通过网站的外表,内容,文字,交流可以概括出一个站点的个性,情绪。
是温文儒雅,是执著热情,是活泼易变,是放任不羁。
像诗词中的"豪放派"和"婉约派",你可以用人的性格来比喻站点。
如何树立网站风格呢?
我们可以分这样几个步骤:
1、确信风格是建立在有价值内容之上的。
一个网站有风格而没有内容,就好比绣花枕头一包草,好比一个性格傲慢但却目不识丁的人。
毕竟HTML语言只是一种内容修饰语言而不是一种页面显示环境,所以你首先必须保证内容的质量和价值性,这是最基本的,然后再去考虑利用各种方法来美化你的网页。
2、你需要彻底搞清楚自己希望站点给人的印象是什么
可以从下面几个方面来理清思路:
a.如果只用一句话来描述你的站点,应该是:
()
参考答案:
有创意,专业,有(技术)实力,有美感,有冲击力
b.想到你的网站,可以联想到的颜色是:
()
参考答案:
热情的红色,幻想的天蓝色,聪明的金黄色。
c.想到你的站点,可以联想到的画面是:
()
参考答案:
一份早报,一辆法拉利跑车,人群拥挤的广场,杂货店
d.如果网站是一个人,他拥有的个性是:
()
参考答案:
思想成熟的中年人,狂野奔放的牛仔,自信憨厚的创业者
e.作为站长,你希望给人的印象是:
()
参考答案:
敬业,认真投入,有深度,负责,纯真,直爽,淑女
f.用一种动物来比喻,你的网站最像:
()
参考答案:
猫(神秘高贵),鹰(目光锐利),兔子(聪明敏感),狮子(自信威信)
g.浏览者觉得你和其他网站的不同是:
()
参考答案:
可以信赖,信息最快,交流方便,
h.浏览者和你交流合作的感受是:
()
参考答案:
师生,同事,朋友,长幼。
你可以自己先填写一份答案,然后让其他网友填写。
比较后的结果会告诉你:
你网站现在的差距,弱点及需要改进的地方。
3、在明确自己的网站形象后,开始努力建立和加强这种形象。
经过第二步印象的"量化"后,你需要进一步找出其中最有特色特点的东西,就是最能体现网站风格的东西。
并以它作为网站的特色加以重点强化,宣传。
以下做法可作参考:
(1)将你的标志logo,尽可能的出现在每个页面上。
或者页眉,或者页脚,或则背景。
(2)突出你的标准色彩。
文字的链接色彩,图片的主色彩,背景色,边框等色彩尽量使用与标准色彩一致的色彩。
(3)突出你的标准字体。
在关键的标题,菜单,图片里使用统一的标准字体。
(4)想一条朗朗上口宣传标语。
把它做在你的banner里,或者放在醒目的位置,告诉大家你的网站的特色是...。
(5)使用统一的语气和人称。
即使是多个人合作维护,也要让读者觉得是同一个人写的。
(6)使用统一的图片处理效果。
比如,阴影效果的方向,厚度,模糊度都必须一样。
(7)创造一个你的站点特有的符号或图标。
(8)用自己设计的花边,线条,点。
(9)展示你网站的荣誉和成功作品。
(10)告诉网友关于你的真实的故事和想法。
风格的形成不是一次定位的,你可以在实践中不断强化,调整,修饰。
第二章网页制作工具简介
2.1HTML语言
HTML是“超文本标记语言”的缩写,是网络的通用语言,一种简单、通用的全置标记语言。
它允许网页制作人建立文本与图片相结合的复杂页面,这些页面可以被网上任何其他人浏览到,无论使用的是什么类型的电脑或浏览器。
也许你听说过许多可以编辑网页的软件,事实上你不需要任何专门的软件来建立HTML页面,您所需要的只是一个文字处理器(如MicrosoftWord/记事本/写字板等)以及HTML的基本常识。
其实您很快就会发现基础的HTML语言很简单。
HTML标签通常是英文词汇的全称(如块引用:
blockquote)或缩略语(如“p”代表Paragragh),但它们的与一般文本有区别,因为它们放在单书名号里。
故Paragragh标签是
块引用标签是
。有些标签说明页面如何被格式化(例如,
开始一个新段落),其他则说明这些词如何显示(使文字变粗)还有一些其他标签提供在页面上不显示的信息--例如标题。
关于标签,需要记住的是,它们是成双出现的。
每当使用一个标签--如
,则必须标签将它关闭。注意“blockquote”前的斜杠,那就是关闭标签与打开标签的区别。
基本HTML页面以标签开始,以结束。
在它们之间,整个页面有两部分--标题和正文。
标题词--夹在
和标签之间--这个词语在打开页面时出现在屏幕底部最小化的窗口。正文则夹在
和之间--即所有页面的内容所在。页面上显示的任何东西都包含在这两个标签之中。
那么让我们建立一个简单的范例吧,非常容易的。
第一步,当然是要建立一个新的文本文件(记住,如果你在使用比较复杂的文字处理器,就应该用“纯文本”或“普通文本”来保存),将它命名为“xxxx.html”。
(随便你起一个什么名字,但记住,要用英文)
然后你可以用浏览器将它打开,你会看见最简单的自己做的页面。
2.2所见即所得的Web页开发工具
MicrosoftFrontPage98是微软公司推出的一套兼具网页编辑和网页管理的超强工具。
网页设计
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- 信号与系统 信号 系统 精品课程 网站 设计 维护