第一篇:网站设计与制作个人总结报告
网站设计与制作个人总结报告
taiyuangongyexueyuan近一个星期的实训将要结束了,顶着考研考试的巨大压力我们小组还是如期的完成了老师的要求,其中的酸甜苦辣我会在今后的日子里不断地去咀嚼,去回味,去探索。从制作网页过程中,我学到了新的美化网页的方法,运用了更多以前未运用的技巧。这使我学到了更多的知识,并且为我自己在制作网页这方面积累了一些经验。这些将是我人生中的一次重要的经历,将是我今后走上社会后的一笔巨大的财富。这次实习的收获对我来说有不少,我自己感觉在知识、技能等方面都有了不少的收获。总体来说这次是对我的综合素质的培养,锻炼和提高。
做好页面,并不是一件容易的事,它包括个人主页的选题、内容采集整理、图片的处理、页面的排版设置、背景及其整套网页的色调等很多东西。本次课程设计不是很好,页面过于简单,创新意识反面薄弱,这是我需要提高的地方。需要学的地方还有很多,需要有耐心、坚持,不断的学习,综合运用多种知识,才能设计出好的web页面。
制作网页,首先是确定主题,经过再三考虑,就做了个关于发型的网站, 是一家为理发店提供数据库服务的大型企业Pretty hair还为注册的理发店提供会员管理服务,各大理发店均可注册pretty hair并获取相应数据库,prettyhair来维护数据库安全可靠。同时,pretty hair也是一家以提倡健康、漂亮头发的信息资讯类公司,您可以在这里获取如何保养头发的相应信息,以及各种发型的图片相关介绍,还有各种护发用品。于是网站主题确立。然后是整体规划,每一版块都有其个性的色彩,清晰明了,便于阅读浏览,大致分几部分,个人档案、兴趣爱好、成长经历、国家队生涯、荣誉、职业生涯数据、转会记录,再加入个别网站等,每一部分又分几小部分,内容比较充分,多样。
再后是收集资料与素材,大量浏览相关网站,收集关于C罗的一些事迹历史图片,好的文章和图片等,还有参考一些好的网站的布局,特色,颜色搭配,背景图等。
再后是制作网页了,使用dreamweaver制作。首页内容精彩丰富,简洁明快,语言风趣,通俗易懂。页面可爱清爽。首页主要是导航作用。首页制作时,时刻考虑着网页的基本原则:统一,连贯,分割,对比及和谐的原则,内容统一,都是为了主题服务,一个网站强调的就是一个整体,只有围绕一个统一的目标所做的设计才是成功的;连贯,页面之间关系连贯,统成一体;每版内容都自成一体,颜色各异,便于浏览;整个网页有动有静,颜色不同,形成对比,不呆板,富有生气;颜色各异,但又不同之中又相同,浑然一体。而且制作过程中,不忘以下原则:
简洁实用: 这是非常重要的,网络特殊环境下,尽量以最高效率的方式将用户所要想得到的信息传送给他就是最好的,所以要去掉所有的冗余的东西。使用方便:同第一个是相一致的,满足使用者的要求,网页做得越适合使用,就越显示出其功能美;页面用色协调,布局符合形式美的要求: 布局有条理,充分利用美的形式,是网页富有可欣赏性,提高档 次。当然雅俗共赏是人人都追求的。
利用我们所学的框架集,制作更完美的页面。将动态网页与静态网页结合起来。再后,调试过程,好多次本来在dream里好好的,把字调的好好的,位置很对,可在浏览器里御览就出毛病了,不是靠上了,就是靠下了,很不老实,经过再三调试,整理,加了好多表格,终于满意了,很是麻烦,想请问老师,为什么会出现这种情况啊,还有怎么解决啊,不用这么反复调整的办法,还有什么好办法啊?
还有,在最超链接过程中,明明在页面属性里设置的是超链接的文字是原色,点击链接后也是原色,可一链接上就变色了,想了老半天,也做了很多研究,实验,终于知道怎么回事了,原来应该对文字所在的单元格整体做链接,而不是只选中文字做链接。这次的网站大部分用的是表格,层用的很少,因为它太灵活了,不好控制,用的很少。
制作过程中,才发现,原来自己懂的太少了,好多不知道的地方,才赶紧查书,开始的时候只是会建立模版,可不会应用,操作,可这样要修改模版可就麻烦了,要一个网页一个的修改,于是赶紧上网学习相关内容,阅览书籍,最后才知道文件这有个资源,点击进入资源面板,点击到数第二个的模版,选项,所有模版就都显示了,点击资源面板左下角的应用命令,好了,这个模版就应用到你建立的网页中去了。
这只是在制作过程中出现的问题之一,其它问题也是类似相同。现在想想,自己所会的东西太少了,现在做的网站只是一些简单的网站,看到了一些知名的网站开发出的网页,不仅栏目内容丰富,信息量大,而且页面图文并茂,五彩缤纷,使得网民赞叹不已,流连忘返。以我们的经验,当前的软件的功能日趋复杂,不学到一定的深度和广度是难以在实际工作中应付自如的。因此反映出学习的还不够,缺点疏漏。需在加以刻苦钻研及学习,不断开拓视野,增强自己的实践操作技能,为以后能做出出色的网页而努力。
(一)页面的设计方面
网页设计跟学习别的东西一样,也需要兴趣,所谓的兴趣也不是三分钟热度,是一种执著。
学习网页设计需要耐心,如果没有耐心,就学不好网页设计,应为当你碰到一个问题时,如果不能立刻得到问题的答案,你可能需要很长时间去解决,我就碰到过一个问题,用了很长时间才解决。
学习网页设计需要坚持,坚持不断的学习,因为设计网页的软件在不断的更新,因此我们要不断的学习并且学习网页设计不要掉入技术的陷阱,如果你的网页设计技术一流,并且对软件的掌握程度已经达到一定水平,但是你设计的网页确不堪目睹,这是因为网页设计是介于平面设计和编程技术两者之间的“边缘科学.”不仅涉及到美学,心理学,平面构成,色彩搭配等平面设计的方面的知识,还涉及到html,javascript,css,asp,php等编程语言技术方面的知识.只有综合运用多种知识,才能设计出视听特效,动感十足,富于个性的web页面,才能全面展现互联网这一新型媒体的独特魅力和多维空间的超强功能.并且我认为网页设计应该注重实用性,因为它是让人浏览的,是用户可以抚摸,可以评论,可以交互的。因此我提倡简单的美。
(二)网页视觉效果
视觉形象识别即我们通常所说的VI(VisualIdentity),与BI一起用于深化表现企业理念,同时也受到BI的影响。所谓视觉形象识别,就是指能够被目标客户通过视觉来认知与企业相关的一切事物,从最基础的企业标志、吉祥物、标准色到企业日常业务中的信纸、服装、名片等等,在将其系统化以后就形成了企业的视觉形象识别系统。
视觉形象识别系统在整套CIS中处于最表层的位置,其中所有的设计都将与目标客户发生直接的接触。
(三)网页的整体布局和导航
网页的布局通常指的是网页的整体架构,说的通俗一点就是排版。如何突出最重要的内容,即让用户第一眼就看到这个网页所想要传达的信息。这一点至关重要。在大多数做的比较成功的网页中,一个共同的特点就是网页的整体架构十分的清晰明了,便于用户浏览网页布局大致可分为“国”字型、拐角型、标题正文型、左右框架型、上下框架型、综合框架型、封面型、Flash型、变化型
网页布局是主要考虑以下几点:
1、首先要考虑整个网页的长和宽,以及长度和宽度之间的比例。
2、其次就应该考虑导航条的设置了。
3、正文的框架设置(横向因素和纵向因素交错)
(四)网页中文字、图像
图象我利用网上搜索和自己所学过的banner进行处理,这样做起来节约了很多时间。
(五)网页制作过程中的其他注意事项
不要过于注重色彩的灿烂,只要简单就行。我们最终追求的主要是实用价值
通过这次实习,在制作时想想使自己的网页更加丰富多彩,在网页中插入图象,动画,动态特效。可是总遇到这样那样的问题,但在同学的帮助和自己摸索的情况下完成了这个实习的成果。看到了一些知名的网站开发出的网页,不仅栏目内容丰富,信息量大,而且页面图文并茂,五彩缤纷,使得网民赞叹不已,流连忘返。以我们的经验,当前的软件的功能日趋复杂,不学到一定的深度和广度是难以在实际工作中应付自如的。因此反映出学习的还不够,缺点疏漏。虚在加以刻苦钻研及学习,不断开拓视野,增强自己的实践操作技能,为以后能做出出色的网页而努力。
总体来说,通过这次的对网页课程设计,有收获也有遗憾、不足的地方,但我想,我已经迈入了网页设计的大门,只要我再认真努力的去学习,去提高,凭借我对网页设计的热情和执着,我将来设计出的网页会更加专业,更完善。感谢老师、同学在这次课程设计中给我的帮助、指导!
第二篇:小组网站制作总结报告
小组网站制作总结报告 1.需求分析
主要是通过设计好的网站来体现个人的特点,能够更好地让大家了解我们的小组。同时也是为了提高我们对网络数据库的深刻认识。所以,我们的网站宗旨就是简洁、清楚、明了,让大家一目了然。同时要体现出个人的爱好、名言、学科成绩、学号等重要信息。2设计思想
我们的设计思想就是让网站简洁、清楚、明了、同时我们个人的工作量不会太大。首先我们想到了就是分工,总网页其中一个人负责先做,其他几个人分别去做个人的分网页,组长负责对每个人的分网页进行检查和修改,修改好后每个人将成品的分网页传给组长,组长把分网页与总网页进行链接即可,图片和个人资料自己准备。3总体方案(功能模块)
总网页一定要有名称,同时要放入整个组的合照,同时要有每个人的名字和相对应的个人静态网的链接。个人的分网页要有个人资料模块,还要有个人照片,同时要有返回首页的链接,最重要的是有动态网的链接。4数据库设计
我们是用dream weaver 软件做的网页,首先要测试PHP网页等相关数据,还要配置好网站参数,然后便开始制作网站,先改好文件的存放地点等重要设置,然后先用HTML文件做静态网页,我们统一用表格的形式做了个人信息的录入,然后加入背景图片和个人图片。设计好后要预览测试一下个人网站是否能够打开。然后,用PHP作动态网站输入网站程序代码,做好链接即可。5网站首页设计
首先用Dream weaver 用HTML新建文件,修改页面属性等重要信息,在浏览器地址栏输入“http:/127.0.0.1/网页程序文件名。选择文件类型后单击“创建”。还要设置网页页面属性。接着,插入和设置网页页面文本,插入和设置网页页面的导航条。最重要的是设置超链接,这样才能实现网页的跳转。6总体运行效果
总体运行的效果不错。首先网站首页标题清楚,设计颜色鲜艳,简洁、明了。然后能够直接看到小组合影,最上边有每个人的名字,名字上都做了与个人网页的超链接。点每个名字就能进入相应的小组个人简介和内容中,个人网页图片和内容清晰,也做了返回首页的链接和动态网的链接 7存在的问题及改进设想
存在的问题是动态网的链接点入后会出现错误,原因是源代码中有中文的部分,软件无法识别,要改成英文。同时,我个人觉得可以插入音乐,这样会有一种带入感。
第三篇:网页制作论文--个人网站设计
网页制作课程论文
(个人网站设计论文)
姓名:薛金鸽 学号:105031040025 班级:103212 专业:市场营销(电子商务方向)学期:2011-2012学年第2学期 任课教师:刘新飞
个人网站策划书
1.组织机构描述
1.1个人网站的应用背景
网络发展到今天,建立网站已经成为一个很普遍的问题了,对于个人来说,建设好时间的个性化网站可以更加方便的收集信息,开展更加直接的网络交流,使用自己构筑的友善平台,我们可以为自己毕业后找工作做好充分的准备,通过自己建设的网站,用人单位可以更好的去了解你,从而给自己增加了一份很重的砝码。在我的这个个人网站的制作过程中,我选择了我比较熟悉的大学生活中的许多内容做为我的网站的重要组成部分,这样相对于其他包括种类齐全的网站,我就有了一定的材料基础。这是我这个网站选择大学生主题的原因之一。
其次,做为在校大学生,我知道大学生现在对什么事物,内容,活动等等感兴趣,所以,我做起来的时候相对来说是比较随手的,我不用像其他的网站那样去刻意的收集信息,资料,我只要在校园里稍微留意,我就会捕捉到大学生的兴趣点。所以,在整个网站的设计过程中,我广泛的听取同学的意见和建议,不断的改进和提高我的网站的内容和质量,这些都取得了比较好的效果。
在整个网站的设计过程中,我根据自己以往的设计经验和自己找来的资料,又经过老师的指点,经过了近一个月的努力,几经易稿,最终做成了我的这个个人主页。.2 个人网站建设的目的
在我们的工作、日常生活中,能够拥有一个自己的网站,一个已经成为不少人的希望和骄傲。一个网站项目的确立是建立在各种各样的需求上面的,这是个人网站,所以这种需求往往来自于个人的实际需求,其中每个人的实际需求占了绝大部分[6]。因此如何更好地的了解、分析、明确需求,并且能够准确、清晰以文档的形式表达出来,保证开发过程按照个人需求为目的正确项目开发方向进行。不同的网站目的要求通过不同的方式来实现。一个展示个人能力的网站与一个以花卉种植为主题的网站,以及一个大型门户网站和一个小型企业网站,其出发点和建站目的都有所不同,在整个网站的建设规划方面的要求也是肯定是大不一样的。因此在规划我的这个网站时,我选择了和大学生的生活和学习相关联的主题。
1.3 相关应用软件选用、技术采用
在网页的设计过程中,我选用的软件包括Dreamweavercs5、Fireworks cs5和Photoshopcs5,其中,Dreamweaver 是网页编辑软件,Fireworks cs5是图形/图像处理软件,photoshopcs5是图片处理软件。它们是Macromedia公司专门为网页设计、制作开发的系列软件套件,三者之间可以无缝集成,能够有效地解决网络带宽问题,是设计动画网页的最佳工具。
Dreamweaver cs5采用“所见即所得”的直观设计模式,充分尊重设计人员的原始意识和想象力。她成功地将网页设计功能中的技术实现部分和设计部分分离开来,使用户只需专注于设计,而其余的工作由Dreamweavercs5自动完成。另外,还有一点值得说明的是,Dreamweaver cs5可以控制和删除冗余代码,减小网页文件的大小。从而能够快速上传和下载。
Fireworkscs4的独特之处在于它能够优化、切分图片映射图,并提供了功能强大的翻滚图工具。它是基于WEB应用的图形/图象处理软件,提供了一种革命性的新方法来创建WEB图形,并且具有所有其他图形处理工具的诸多优点。Fireworks cs4的最大优势就在于它在任何时候可以从任何阶段开始设计工作,这样既可以节约时间又可以对产品进行扩展。另外,Fireworks cs4中的诸多功能都是面向WEB应用的,因此对于WEB设计新手来说也很容易学习的。
在我设计我的个人网站的过程中,我选择了Dreamwearcs5和 Photoshopcs5 Fireworks cs4三种软件。因为自己向对于其它的软件来说,这三个还算是比较熟悉的。
2.网站的技术参数部分
2.1我的导航系统
我所制作的个人网站的导航系统包括:
1.个人简介2.个人专题4.我的相册5.网站说明6.给我留言 8.发送邮件9.链接百度10.女生花园
2.2功能模块的划分
1.搜索引擎:
根据浏览者的要求,使用主页上的搜索引擎链接到百度,在整个Internet上进行搜索,完成信息的优化与提取。
2.论坛:
主要功能是网友和网站之间的交流平台,也是网友给版主提出意见的主要渠道。在论坛中用户可以发表意见,这些意见可以让所有人看到,也可以只让版主看到,版主和其他人可以针对留言的内容进行回复,只留给版主的留言只有版主能够回复,并且版主可以登录后台对留言进行管理,是否发表或删除。
3.发送电子邮件:
网友可以通过“联系我”利用outlook 向版主或其他人发送电子邮件。4.精品收藏:
在其中展示我喜爱的东西,包括电影、歌曲和一些优美的文章。奇文共欣赏,疑义相与析。我只想起到抛砖引玉的作用,让大家从中认识我和了解我,让一些美好的东西我们大家共同来欣赏。但我增加了管理权限,我以管理员的身份可以对加入的新内容进行管理,即允许加入和对其进行删除。
5.留言板:
是一个我与大家谈心交流的地方,在留言板中,我们可以畅所欲言,和大家进行交流。就我们感兴趣的话题展开讨论。和大家进行沟通。
2.3 首页的设计 我的网站首页主要采用简单大方的设计方法,用的是色调一致的一组图片做的LOGO和相关的背景图片,主要页面布局如下:
2.4主要栏目的介绍
1.个人简介:
介绍版主的一些基本信息,希望各位访客能够认识版主。2.我的论坛:
此版块又分为主页、发表意见、回复意见、显示论坛内容、版主后台管理以及版主的回复界面。其中发表意见界面是所有访客都可以在论坛里面发表自己的意见,这些意见可以是发表给所有的访客,也可以是只发表给版主,如果只发表给版主,只有版主可以看到和回复;回复意见是所有访客针对自己感兴趣的话题进行回复;这些发表的意见和回复可以在显示论坛内容的界面都显示出来,供大家讨论;那些只有版主才能看到的信息在版主的管理界面,这个界面需要登录,设有用户名和密码,在这里版主可以对所有评论进行发表或删除的管理。3.个人专题:
这里收录了我平时搜集的一些文章和音乐,各位访客可以根据自己的喜好进行阅览。4.我的相册:
在这个板块可以看到我的照片,班级照片和搜集的校园照片,如果大家喜欢可以收藏。更改照片的时候只要更新数据库就可以了。5.网站说明:
里面是我对整个网站的介绍,不太清楚网站构架的访客可以先到这里。6.给我留言:
这是每位访客针对我的网站情况给我留言,这些留言会直接保存到数据库里面,并且能够轻松的读取。7.发送邮件:
各位访客可以通过outlook向版主或者其他人发送电子邮件。8.链接百度:
如果访客想在互联网上查找东西,可以直接点击这里。9.女生花园:
收集了一些女生喜欢的东西,如果你是女生,可以进来看看。
2.5二级页面的设计
我的网站主页内容简单所以主要内容再二级页面里要有详细的说明,具体说明如下:
2.5.1个人简介
本模块是个人简介部分,每个个人网站都会有作者介绍。在这个模块访客会了解到作者的一些基本信息.2.5.2文学欣赏
这个版块主要介绍我自己喜欢的相关文学作品。此版块的界面如图所示:
图3.6 文学欣赏界面
2.5.3快乐音乐
进入此版块,界面如图所示:
通过在数据库中存放音乐路径,达到在网页上播放的效果。在音乐的首页上放置了歌曲的名字,网友无需登录,即可收听自己喜欢的歌曲。
音乐界面
2.5.4我的相册版块
个人网站中又一亮点就是个人相册的设置,在我的相册里,放置了我自己的照片、班级照片和校园照片。
相册里面的这三个版块具有相同的版面设计,如下图所示:
相册界面
2.5.5网站说明版块
此版块是我根据自己的网站结构对整个网站以及每个版块所做的网站结构和功能的说明,以及网站和作者版权说明。如下图所示:
网站说明界面
如果网友不清楚网站的构架,可以查看此版块。2.5.6给我留言版块
留言板是目前最为流行的网络应用之一,使用留言板,可以为留言者提供发言的机会,让他们能够及时、准确地交换自己的观点。
2.5.7留言板主界面
完整的留言板具有发表留言和察看别人留言的功能,如图所示的留言板主界面index1.ASP,可由此进入留言界面和察看留言界面。
留言主界面
在主界面中存有全部留言的作者和主题,点击你想察看的主题就会进入察看留言界面,点击 “发表帖子”进入留言界面。
3.网站的维护方案
3.1域名的申请
域名(Domain Name),是由一串用点分隔的名字组成的,Internet上提供用户访问某网站或网页的路径,用于在数据传输时标识计算机的电子方位(有时也指地理位置)。
域名申请的含义
“域名申请”:为保证每个网站的域名或访问地址是独一无二的,需要向统一管理域名的机构或组织注册或备档的一种行为。也就是说,为了保证网络安全和有序性,网站建立后为其绑定一个全球独一无二的域名或访问地址,必须向全球统一管理域名的机构或组织去注册或者备档方可使用的一种行为。由于域名是网站必不可少的“门牌号”,域名可用于:网站地址访问、电子邮箱、品牌保护等用途,所以很多企业或个人均会进行域名申请。
3.2空间或者主机的租用
有了自己的域名这个门牌号后,就需要一个空间来存放自己的网站,也就是虚拟主机。一般虚拟主机提供商都向用户提供100MB、500MB、3GB等虚拟主机空间。我的个人网站选择100-300MB的虚拟主机空间。购买虚拟主机主要考虑几个方面:售后服务、稳定性、访问速度等。首先我选择在万网上注册一个域名然后申请租用空间建立个人网站。
3.3网站链接稳定性测试
超级链接对于网站用户而言意味着能不能流畅的使用整个网站提供的服务,因而链接将作为一个独立的项目进行测试。网站能够正确运行首先要保证链接能够连贯运行。
网站的运行中整个系统是否运行正常,我主要采用将测试网站长时间运转进行测试,派生出执行程序所有功能需求的输入条件,从而导出测试用例,进行测试,网站中的每个版块的每个页面都出现了很多的链接,所以每个版块要先进行单独测试,单独测试完成后,根据个版块之间的连接结构再进行总体测试,从而达到网站的整体的运营能够顺利地进行。在测试这个环节时,没有特定的测试方法,就要做到细心,做到网站的顺利运行。
总结:
通过这次个人网站设计的制作,我学会了很多东西,也了解了很多关于个人网站的资料。不知不觉网页设计的课程将要结束了,这门课程所包含内容的丰富是让我从没有想到的。在整个的学习过程中,我学习了Dreamwave、Firework、Html语言、网站建设的基本思想等重要内容。到现在为止,我还是很庆幸能够学到这么多的内容。
虽然整个网页的结构还有很多不足,还有一些板块没有开通,但是我的确能够感到在我们制作过程中技能的提高。整个网站的不足我想是没有使用到一些动态网页的知识,使得日后网站的维护较为繁杂。希望以后可以自学动态网站的课程,从而弥补自己在动态网络语言方面的不足。这样以后可以利用业余的时间为自己或者公司,根据自己的爱好建立一个个人网站。
[参考文献] [1] 袁晓红.《网页设计与制作》[M].高等教育出版社 2006 385页~389页 [2] 甘登岱.《我也能掌握Flash编程》[M].航空工业出版社 2000 [3] 赵更生.《Flash动画制作培训实录》[M].人民邮电出版社 2004 [4] 鲍嘉.卢坚.陈丁法《Dreamweaver CS5网页设计从入门到精髓》[M].中国电力出版社2010 [5] 张成龙.《网页制作一点通》.延边人民出版社
[6] 刘瑞新,《ASP动态网站开发、毕业设计指导及实例》[M].机械工业出版社 2000 [7] 石晓燕、苏萍《网页设计基础》[M].清华大学、交通出版社 20 04 [8] 王玉芬.《网站规划与设计》[M].西北工业出版社 2003 [9] 谢希仁.计算机网络(第5版)[M].北京:电子工业出版社,2008
第四篇:个人网站设计制作研究
XXXX 师 范 学 院
本科生毕业论文
题 目:个人网站设计制作研究 学生姓名:XXXXX 指导教师:XXXXX 二级学院:物理与电子信息学院 系 别:电子系
专 业:电子信息科学与技术 年 级:09级
学 号:0905XXXXXXXXX
完成日期:2013年1月10日
XXXX师范学院本科生毕业论文
论文题目:个人网站设计制作研究
【论文摘要】在制作网站前需要有一个明确的思想,要做一个什么样风格的网站,它要表达什么样的效果,为达到这样的效果需要使用什么样的设计方案和开发工具。我做的这个网站以温馨舒适为主题,表达个人对生活的热爱和对美的追求,故以温馨的粉色的基色,搭配明媚的梅红,插入柔软绚丽的插图,使整体协调一致。这个过程是使用Photoshop制作的效果图,然后使用Dreamweaver进行制作。网站制作是个看似简单实则艰辛的过程,只有经历过的人才懂得个中滋味。
【关键词】 设计思想; 实现方式;效果图
XXXXXXX Normal College Graduate Thesis
Personal Web Design
【Abstract】 Before the production site need to have a clear idea to do a site of what style, it is to express what kind of effect, what kind of design and development tools needed to achieve this effect.I made this website to cozy theme to express personal love for life and the pursuit of beauty, it is a warm pink base color, with bright MEI, inserted into the soft, colorful illustrations, so that the overall coherence.This process using Photoshop produced effect diagram, and then use Dreamweaver for production.The production site is a deceptively simple but in reality difficult process, only experienced people know the taste.【Key Words】 design ideas;Implementation;Effect diagram
目 录
1.网站的策划.......................................................5
1.1个人网站的简介...............................................5 1.2.建设网站前的市场分析........................................7 1.3.建设网站的目的及功能定位....................................9
2.网站总体分析与设计..............................................10
2.1网站设计....................................................10 2.2网站内容及实现方式..........................................12 2.3开
发
工
具的使用..............................................................................................13 2.3网站的测试发布及后期更新与维护..............................................................6
3.制作流程及效果图................................................15
3.1首页制作流程及效果图........................................15 3.2个人展示制作流程及效果图....................................17 3.3相册制作流程及效果图........................................18 3.4音乐盒制作流程及效果图......................................19 3.5视频制作流程及效果图........................................20
4.总 结...........................................................21 参考文献..........................................................22 致 谢.............................................................22
网络技术逐渐深入社会生活各个层面的今天,互联网成为人们快速获取、发布和传递信息的重要渠道,网络成为最大的推销平台,网站是不可缺少的推销手段,现在基本上每个人都参与网络,而网络上能展现自我的平台就是个人网站。
个人网站是由个别提供的一套集博客、文章、相册、日程、通讯录、链接、调查、留言板等诸多功能于一体的网络平台。个人网站的自由、开放精神,并使之更容易操作,更具个性需求,而不需要高深的技术。它可以帮助个人进行全面的信息化,以多种形式达到对信息获取、组织、思考、表达、共享和交流的目的。以个人为中心,建立一个完全属于自己的可定制的个性化网络平台。来自文章的评论,留言板都可以很好的进行交流,倾听别人的声音。
人们通过网络来表现自己的欲望越来越强,人们更迫切的需要能够张显个人色彩,更加个性化的个人网站。当今,个人网站的设计与开发应用更加广泛,更加具有生命力。通过对个人网站的设计与开发,可以熟悉相关的网站设计技巧和,网络技术,熟练掌握HTML和ASP的编程技术,同时掌握和活用Dreamweave、Flash等工具。对于计算机网络的理解都有深远意义的。
1.网站的策划
1.1个人网站的简介
当今世界发展得越来越快,如何才能紧跟时代的步伐,已成为越来越紧迫的问题。随着互联网的快速发展,也为我们找到了一个紧跟时代步伐的平台。为了更好地利用网络资源,使我们的信息电子化,也为了能与世界各地进行广泛地交流,丰富我们的知识和视野。因此网站就因运而生,网站最核心的价值在于给人们带来最有价值的信息或服务。
个人网站是指因特网上一块固定的面向全世界发布消息的地方,个人网站由域名(也就是网站地址)、程序和网站空间构成,通常包括主页和其他具有超链接文件的页面。网站是一种通讯工具,就像布告栏一样,人们可以通过网站来发布自己想要公开的资讯,或者利用网站来提供相关的网络服务。个人网站是指个人或团体因某种兴趣、拥有某种专业技术、提供某种服务或把自己的作品、商品展示销售而制作的具有独立空间域名的网站。
个人网站一般由个人或团体因某种兴趣、拥有某种专业技术、提供某种服务或把自己的作品、商品展示销售而制作的具有独立空间域名的网站。个人网站=顶级域名 虚拟主机 网页。网页: 需要自己运用各种网页软件制作.做好网页后上传到虚拟主机,再把域名绑定到虚拟主机上,你的个人网站就可以对外供别人浏览了。
个人网站包括:博客,个人论坛,个人主页等等,网络的大发展趋势就是向个人网站发展。个人网站是一个可以发布个人信息及相关内容。通俗理解个人网站:就是指网站内容是介绍自己的或是以自己的信息为中心的网站,不一定是自己做的网站,但强调的是以个人信息为中心。个人网站是指个人或团体因某种兴趣、拥有某种专业技术、提供某种服务或把自己的作品、商品展示销售而制作的具有独立空间域名的网站。
个人网站是指因特网上一块固定的面向全世界发布消息的地方,个人网站由域名(也就是网站地址)、程序和网站空间构成,通常包括主页和其他具有超链接文件的页面。网站是一种通讯工具,就像布告栏一样,人们可以通过网站来发布自己想要公开的资讯,或者利用网站来提供相关的网络服务。个人网站是指个人或团体因某种兴趣、拥有某种专业技术、提供某种服务或把自己的作品、商品展示销售而制作的具有独立空间域名的网站。个人网站是万维网 由个人创建的网页包含的内容,而不是个人性质的公司,组织或机构的代表
1.2.建设网站前的市场分析
随着社会经济的不断发展,现代社会节奏越来越快,人们每天都在接受超负荷的信息量,如何让站长在看到你的网站的时候就下定决心一定要用这个网站呢?和所有行业一样,这需要换位思考,做出的网站能站在站长(客户)的角度去思考。其次,网站需能够提供“垂直”服务,即交友留言类。最后,站长要产生独立拥有感,即使用者希望能够独立使用管理。
1.2.1行业分析:相关行业的市场是怎样的,市场有什么样的特点,是否能够在互联网上开展公司业务。
(1)市场容量
(2)市场增长率、需求增长率
(3)合作伙伴:公司有哪些主要的或次要的商业伙伴可以在该领域给予一定的帮组(即业务、技术方面)
(4)整体行业简介
1.2.2、市场主要竞争者分析:竞争对手上网情况及其网站策划、功能作用。
1.2.3、公司自身条件分析、公司概况、市场优势分析:公司利润只要是靠什么,即通过什么来盈利,产品、服务还是其他公司是否有充裕的资金和人力去开拓网站业务目标人群
1、服务器:选用独立服务器还是虚拟空间,选用国外的空间还是国内的空间。
(1)独立服务器:优点 容量大、适合信息量多、运行快,而且是最稳定的空间。
缺点:花费高、人力消耗大
(2)虚拟空间:优点价格便宜、容易操作。
缺点:和独立服务香波不稳定、不能应对高负荷、高访问。
(3)国外空间: 优点 不需要备案(即开即用较方便)、无国内网站限制(什么类型的网站都可以建设)。缺点:速度慢、服务跟不上。
(4)国内网站:优点、速度快、访问稳定、整体服务较好。
缺点:需要备案(企业一般为15-30个工作日)、网站类型限制较多。
2、选择操作系统,用Window2000/NT还是unix,Linux。分析投入成本、功能、开发、稳定性和安全性等。
3、采用模板自助建站、建站套餐还是个性化开发:目前市场较为流行的建站系统为织梦、phpcms、discu、帝国等系统。
4、网站安全性措施,防黑、防病毒方案(如果采用虚拟主机,则该项由专业公司代劳)。
5、选择什么样的动态程序及相应数据库。
6、域名的选择:com、cn、info、cc等国际顶级域名选择(个人推荐com,原因:com域名,知名多高、全重大、使用广)域名的组成:如果有条件可将网站的域名注册为公司名称全拼或者首字母,例如:百度 www.xiexiebang.com。
7、根据网站的目的确定网站的结构导航。一般企业型网站应包括:公司简介、企业动态、产品介绍、客户服务、联系方式、在线留言等基本内容。更多内容如:常见问题、营销网络、招贤纳士、在线论坛、英文版等等。
8、根据网站的目的及内容确定网站整合功能。如FLASH引导页、会员系统、网上购物系统、在线支付、问卷调查系统、在线支付、信息搜索查询系统、流量统计系统等。
9、确定网站的结构导航中的每个频道的子栏目。如公司简介中可以包括:总裁致词、发展历程、企业文化、核心优势、生产基地、科技研发、合作伙伴、主要客户、客户评价等;客户服务可以包括:服务热线、服务宗旨、服务项目等。
10、确定网站内容的实现方式。如产品中心使用动态程序数据库还是静态页面;营销网络是采用列表方式还是地图展示。1.3.建设网站的目的及功能定位
网站的目的直接影响其功能定位,如商业网站注重产品和服务的介绍,而交友型网站则需大量的人流信息等。这些目的使得网站必须做出适当的超链接,安排不同的重点。
那么为什么要建立网站?是为了树立企业形象,宣传产品,进行电子商务,还是建立行业性网站?是企业的基本需要还是市场开拓的延伸?在考虑了这些问题之后,初步确立建站目的。这个要根据每个人或公司自身的资源来决定,一但目的明确了,要考虑的是整合公司或个人资资源,进一步确定网站功能,根据网站功能,确定网站的初期与最终发展应达到的目的与作用。这中间的每一个环节都不可忽视,应该根据自己先前的思想和网站的目的把网站的功能细化。
网站的定位大致可分为这两种方式:一种是一开始的定位很小,小可变成大;一种是一开始的定位很大,大可变成小。这两这种定位有这个明显的区分,前者一般是个人站长所为,个人站长没有足够的资源、技术与资金来作站前的市场分析,也没有强大的团队走“大定为,小实现”。后者一般是公司所为,公司就不用说了,只要看到这有发展空间,只要论证认为有利公司发展,那么会就此作为一个项目,投入相应的人力、物力与财力组成一个团队来实现公司的目标。只有公司能做到从大定位,逐步小实现。
不论是个人还是公司在对网站的建设及功能定位这一步都会做很多的判断,我个人始终认为:在把握建站的目的及定位之后,最为重要的一点就是提高网站的特色,当然想要在这个网络横行的年代里做出的特色是很不容易的。
不过好的思想是成功的一半,在有了特色以后,就是推广自己的网站,这又分免费和收费。我做的这个网站属个人网站,可用于如腾讯空间、博客等。其重点是要突出个人色彩,因为这个世界上每个人都是不一样的,每个人的思想更是千差万别,所有做出大众都能接收的温馨特性,太另类的作品只有少数人喜欢,难以成为主流。因此,这个网站需要有个人展示,相册,音乐盒,电影等,不可或缺的细节是,在首页有留言栏,这是作为人际社会与他人沟通的桥梁,能让人感受到拥有自己的独立世界的同时还有与外界密切的联系。
2.网站总体分析与设计
2.1网站设计
确立了网站的目的和功能,接下来按着已有的目的和需要达到的功能做出设计方案。网页美术设计要求与主题整体形象一致,注意网页色彩,图片的应用及版面策划,保持网页的整体一致性。除此,还要考虑使用者的年龄段,性别,群体爱好倾向等。作为个人网站,协调温馨的画面会是最为吸引人的因素,当然使用性是必不可少的。
2.1.1确定网站的整体风格
网站的整体风格及其创意设计是最难以学习的。难就难在没有一个固定的模式可以参照和模仿。给你一个主题,任何两人都不可能设计出完全一样的网站。
风格是抽象的。是指站点的整体形象给浏览者的综合感受。这个“整体形象”包括站点的CI(标志、色彩、字体、标语)、版面布局、浏览方式、交互性、文字、语气、内容价值、存在意义、站点荣誉等等诸多因素。举个例子:我们觉得网易是平易近人的,迪斯尼是生动活泼的,IBM是专业严肃的。这些都是网站给人们留下的不同感受。在这里,我提供给大家一些建议:
1.将你的标志logo,尽可能的放在每个页面上最突出的位置; 2.突出你的标准色彩;
3.总结一句能反映贵站精髓的宣传标语;
4.相同类型的图像采用相同效果,比如说标题字都采用阴影效果,那么在网站中出现的所有标题字的阴影效果的设置应该是完全一致的!
2.1.2色彩的搭配
无论是平面设计,还是网页设计,色彩永远是最重要的一环。当我们距离显示屏较远的时候,我们看到的不是优美的版式或美丽的图片,而是网页的色彩。
关于色彩的原理有许多,在此我们不可能一一阐述,大家可以看看相关设计书籍,有利于系统地理解。在此我们仅仅想告诉大家一些网页配色时的小技巧。
1.用一种色彩。这里是指先选定一种色彩,然后调整透明度或者饱和度,这样的页面看起来色彩统一,有层次感;
2.用两种色彩。先选定一种色彩,然后选择它的对比色;
3.用一个色系。简单的说就是用一个感觉的色彩,例如淡蓝,淡黄,淡绿;或者土黄,土灰,蓝。
在网页配色中,还要切记一些误区:
1.不要将所有颜色都用到,尽量控制在三至五种色彩以内; 2.背景和前文的对比尽量要大(绝对不要用花纹繁复的图案作背景),以便突出主要文字内容;
3.色彩的鲜明性。网页的色彩要鲜艳,容易引人注目。
2.2网站内容及实现方式
1、根据网站的目的确定网站的结构导航。
个人网页可根据喜好设置:个人简介、相册、日志、留言板、音乐盒等。企业型网站则可以包括:公司简介、企业动态、产品介绍、客户服务、联系方式、在线留言等基本内容。更多内容如:常见问题、营销网络、招贤纳士、在线论坛、英文版等等。
2、根据网站的目的及内容确定网站整合功能。
如FLASH引导页、大部分网站都有的会员系统、电商网站网上购物系统、在线支付、邮件系统、问卷调查系统、信息搜索查询系统、流量统计系统等。
3、确定网站的结构导航中的每个频道的子栏目。
如医科大学简介中可以包括:学校简介、现任领导、历史沿革、管理机构、科研机构、直属医院等;科学研究可以包括:管理机构、科技管理制度、科技成果、项目开发、重点学科、重点实验室、学术交流、学术团体、学术委员会、知识产权等。
4、确定网站内容的实现方式。
如使用动态程序数据库或静态页面;营销网络是采用列表方式还是地图展示。
我这个个人网站首页中左上角为logo,右边为导航条。中间是插图,下面是留言板。整个版面按颜色由浅渐深再由深到浅进行过渡,颜色深的地方即为需要突出的地方,这样就不会产生审美疲劳。左下角安插了一个Flash,让整个版面添加动感。整个首页即为这个网站的基本模式,即网站都是以首页的风格为基础进行制作的。
在导航条中可链接到各个页面。简洁便宜。2.3.开发工具的使用
制作网页的基本软件离不开HTML,但是如果真的要用其完成全部的网络课程开发是不现实的,因为既不方便效率又低,常用的方法是选择一种工具软件,只是在必要的时候对工具软件生成的HTML文件进行编辑,这样可以使开发工作变得简单又轻松。
但网页制作工具只是对其中各种类型的媒体进行了集成,媒体的编辑还需要各种类型的媒体工具软件。1.Microsoft公司的FrontPage 应用开发工具可大大提高编制网络课件的效率.目前,国际上比较流行的Web页制作软件大致可以分为两类:代码型和所见即所得型.代码型的制作软件要编程,对于初学者来说想要立即上手比较困难.Microsoft公司的FrontPage就不同了,它作为一种所见即所得型的代表软件,可以使使用者的工作效率得以很大提高.FrontPage是Office家族的一员,沿袭着Office 的风格.所以会用 Word 的人很容易学会FrontPage.2.Macromedia 公司的Dreamweaver Dreamweaver是美国MACROMEDIA公司开发的集网页制作和管理网站于一身的所见即所得网页编辑器,它是第一套针对专业网页设计师特别发展的视觉化网页开发工具,利用它可以轻而易举地制作出跨越平台限制和跨越浏览器限制的充满动感的网页.3.FLASH网页需要画面流动时的首选择。
4.Adobe Photoshop图象处理软件,一般网页都需要有图片相搭配,Adobe Photoshop是款很强大的工具。
5.Java开发工具
应选择可移植性好的开发工具。如JDK。
虽然Java程序的可移植性好,但其也依赖于使用的开发工具,如果使用了一些编程工具自己提供的扩展功能,则可能会降低可移植性。
6.数据库的选择
最好选择能跨平台使用的数据库,如Oracle等。
网站制作中要使用到许多的开发工具。根据不同的需要又可选择性的使用一些工具。
这个个人网站是先做出了美工图,所以Photoshop是必不可少的,在处理图片,制作logo,制作导航条等方面都需要用到Photoshop。将美工图处理好以后使用Dreamweaver进行操作。
Dreamweaver是一个功能很强大的软件,再配合使用其他软件,即可做出预期效果。
2.4网站的测试发布及后期更新与维护
2.4.2测试和发布网站
该网站正式发布之前,有必要进行必要的测试,所有的测试应该是主要的用户体验。网站的测试包括许多方面,包括稳定的空间,配置测试,兼容性测试,易用性测试,文档测试,安全性测试,如果该网站是在全球范围内的观众,也应包括本地化测试。
不同技术的网站程序在不同的环境做测试。
经过全面测试的网站才能发布。使用FTP发布网站内容上传到网络空间,可以在网络空间提供商网络购买。制作的网站数据库,但购买网站空间没有自己的数据库,你需要购买额外的数据库。FTP数据库账号和密码信息将在网络空间的应用和FTP帐户。
在所有的网站数据上传到网络空间,你还需要申请的域名的网站。通过域名指向的网站空间,使网站可以通过域名访问的。域名也可以购买域名提供商网络。
2.4.2更新和维护网站
网站制作,将来的更新和维护是最重要的。更新和维护长期,稳定,以使网站在互联网上运行,并继续为用户提供新的网站内容。需要一个很好的网站,定期或不定期更新的内容,以继续吸引更多的观众,不断更新的内容,以确保活力的网站。
更新和维护的主要任务包括:规划和设计,增加网站的内容,扩大服务范围、空间和增加服务项目。
内容更新可以考虑从以下几个方面人手,使该网站可以长期运营·网站建设初期给予足够的重视,需要后续的维护工作,以确保该网站的建设完成后,发布更新和维护简单,易于开展。
普通网站增加内容,增加能够及时,准确,全面的考虑建立一个管理系统,从信息采集,信息审核发布的信息的良性运转。
尽量不要在网站上做了很多的变化,可以部分更新,添加内容的情况下,网站的架构并没有改变。
3.制作流程及效果图
3.1首页制作流程及效果图
首页的制作是重中之重。众所周知,第一印象是非常重要的。而首页同时承担者板式的角色,故制作时应考虑到大局。
所有的页面都是先做出效果图,这从页面的色彩基调及布局开始,定位好色彩基调为红色,然后制作插图,制作logo。制作导航条。Photoshop使用时分层很重要,分层后才能随意修改。
按照已经设计好的制作方案做出Flash,然后将页面分割,再使用Dreamweaver表格将页面布局安排好。
首页的效果图如下:
logo导航条
留言板
3.2个人展示制作流程及效果图
个人展示这块的制作模式和首页类似,在一些细节方面做了改动。左边使用表格建立超链接。
效果图如下:
3.3相册制作流程及效果图
相册制作是在首页制作的基础上结合个人展示的细节进行制作的,在主要内容里面插入了图片,都是先用Photoshop做好的美工图。
效果图如下:
3.4音乐盒制作流程及效果图
音乐盒的制作与前面介绍的网页类似,不同的是建立的超链接是音乐
效果图如下:
3.5视频制作流程及效果图
视频的制作和音乐盒类似,超链接为各个电影。效果图如下:
总 结
一份看似轻松的作品却需要作者全身心的投入,网站如此,其他工作也是如此。而且仅是一个网站,就要涉及很多的专业知识和业余知识,比如说美工图的设计,不仅要熟悉Photoshop,还要了解广告学和心理学,用以布局,创造出最佳的效果。古语言,学海无涯。我在这次毕业设计中学到了很多,成长了很多,本次设计提高了自己的动手,动脑能力,丰富了自我知识,增强了克服困难的勇气和能力,使我获益匪浅。介于设计时间问题,系统还有许多不尽人意的地方,功能不够全面等方面问题,这些都有待于进一步改善。在设计过程中,我发现网站设计的设计语言也很重要,不同的编程语言实现功能的方法都有所不同的,实现的效果也不尽相同,在今后的学习中会不断提高自己的能力。但愿在今后的成长中也能有机会不断的学习。参考文献:
[1] 万维多媒体工作室.ASP实战锦囊.第一版.机械工业出版社.2001 [2] 廖信彦.ASP应用经典.第一版.北京:中国铁道出版社.2000 [3] 王利福 张世琨 朱冰.《软件工程》.编著;北京大学出版社 [4] 李绍原.《数据库原理及应用》.主编:科学出版社 [5] 肖金秀.ASP网络编程技术.主编;青华大学出版社
[6] 吴涛主编,网站全程设计技术(修订本),北京:清华大学出版社; [7] 张华、贾志娟主编,asp项目开发实践,中国铁道出版社 [8] 沈大林主编,中文Flash 8案例教程,中国铁道出版社
[9] 龙马工作室编,ASP+SQL Server组建动态网站实例精讲:人民邮电出版社 [10] 赵增敏编,ASP动态网页设计,电子工业出版社 [11] 任学文、范严编, 网页设计与制作,中国科学技术出版社 [12] 武创、王惠主编,网页设计探索之旅 ,电子工业出版社 [13] 杜巧玲等编, 网页设计超级梦幻组合,清华大学出版社 [14] 吴黎兵、罗云芳编,网页设计教程,武汉大学出版社 [15] 庄王健编,网页设计三剑客白金教程,电子工业出版社 致 谢
毕业设计的时间虽然不长,但是在和指导老师的交流中我学习到很多,不仅是在专业知识方面,也在做人做事认真对待工作的积极态度。特此感谢指导老师对我的帮助,也感谢院方安排的这个毕业设计,让我有机会去体会到不同的感受。由衷感谢指导老师,感谢院方对我们的帮助。
当年花30块钱买了3500字,自己加到了12000字又删了点,适合低水平论文过了就可以的同学,希望可以帮到你。
当年只在万方查过重复率 17%左右 不知道现在,凑合用吧
第五篇:校园网站的设计与制作
校园网站的设计与制作
“听者有心”的首页
创建背景
这个网页可以说是采用了二分栏结构,却有一些变化,包括网页上方占很大面积的Banner、栏目名称以及网页下方放置版权信息的区域,都为传统的二分栏结构注入了一些新的元素,让网页不那么规矩,更加迎合学生的品位。而背景对于这个网页来说也非常重要,用淡雅的蓝色与“听者有心”这个网页标题相呼应,使浏览者打开网页的一瞬间就有一种清新脱俗的感觉,进而产生亲切感。
1.打开Photoshop,按【Ctrl+N】,新建一个宽“760px”,高“900px”的文件,将它命2.按【Ctrl+A】进行全选,填充淡蓝色(R228,G246,B244);新建图层,将其命名名为“听者有心”。
为“灰色”,在页面的上下分别创建高为“30px”和“100px”的矩形选区,填充上浅灰色(R236,G236,B236)。如图所示。
97298299300点。选择柔角的画笔,调整画笔的大小,在你认为合适的地方点缀出朦胧的圆点,把它调整到【听者有心】图层的下面,最终Banner的效果如图2-10所示。
图2-10 梦幻Banner最终效果图
制作信息面板
1.新建【信息面板】组,在组内新建图层,命名为“信息面板”。新建【路径5】,绘制如图3-1所示的路径,创建选区之后填充白色。
图12-3-1 绘制信息面板
2.双击【信息面板】图层的缩览图,在弹出的对话框中勾选【描边】复选框,做如图3-2所示的设置,其中【颜色】为灰色(R204,G204,B204)。
02303
图3-6 加上“more”按钮并作装饰
这样,信息面板就制作完成了,最后要做的是作整个页面的细节修饰。
进行细节修饰
1.在页面上部的浅灰色和白色横条都是用来放栏目文字的,如果两部分除了颜色没有任何差别,会让浏览者觉得乏味,所以我们要作一点小变动。首先,新建图层,命名为【白色条纹】,在页面右上角绘制如图4-1所示的宽“270px”的图形,其中2条间隙高“2px”,中间的白色细线高“1px”。
图4-1 绘制白色条纹
2.创建一个矩形选区,在选区内右击后选择【变换选区】,把选区的宽度改为“7px”
05306307308-