1客户端网站开发报告2目录1客户端开发说明1.1课程目的1.2课程要求1.3开发工具2网站设计2.1网站主题2.2网站内容2.3网站结构3网站制作3.1网页制作3.2网页测试4总结31客户端开发说明1.1课程目的通过提供给学生一定的资料与工具来引导学生利用课余时间进行自主学习以积累一定的理论基础和实践能力,最后的作业要求则是对学生自主学习能力的一种检验。该课程有助于促进学生自学能力与资料检索整合的水平。1.2课程要求要求:1、上交一份报告,关于网站建设的方法和过程,10页左右。2、做一个静态网站,页面不少于5个。自学能力比较强的的,可以做动态网站。另外,最终上交的需要打印稿和电子稿,报告需要打印稿和电子稿,网站上交电子稿。1.3开发工具①DreamWeaver自制动态HTML动画的网页DreamWeaver是一个很好的网页设计软件,它包括可视化编辑、HTML代码编辑的软件包,并支持ActiveX、JavaScript、Java、Flash、ShockWave等特性,而且它还能通过拖拽从头到尾制作动态的HTML动画,支持动态HTML(DynamicHTML)的设计,使得页面没有plug-in也能够在Netscape和IE4.0浏览器中正确地显示页面的动画。同时它还提供了自动更新页面信息的功能。DreamWeaver还采用了RoundtripHTML技术。这项技术使得网4页在DreamWeaver和HTML代码编辑器之间进行自由转换,HTML句法及结构不变。这样,专业设计者可以在不改变原有编辑习惯的同时,充分享受到可视化编辑带来的益处。DreamWeaver最具挑战性和生命力的是它的开放式设计,这项设计使任何人都可以轻易扩展它的功能。②Fireworks第一款彻底为Web制作者们设计的软件Fireworks的来头实在不小,它的出现使Web作图发生了革命性的变化。Fireworks是专为网络图像设计而开发,内建丰富的支持网络出版功能,比如Fireworks能够自动切图、生成鼠标动态感应的javascript。而且Fireworks具有十分强大的动画功能和一个几乎完美的网络图像生成器(Export功能)。它增强了与dreamweaver的联系,可以直接生成dreamweaver的Libaray甚至能够导出为配合CSS式样的网页及图片!③Flash让你的网页动起来Flash是用在互联网上动态的、可互动的shockwave。它的优点是体积小,可边下载边播放,这样就避免了用户长时间的等待。可以用其生成动画,还可在网页中加入声音。这样你就能生成多媒体的图形和界面,而使文件的体积却很小。FLASH虽然不可以像一门语言一样进行编程,但用其内置的语句并结合JavaScripe,您也可做出互动性很强的主页来。2网站设计2.1网站主题5要求:主题不可过于分散,网站主题越集中,一般情况下网站所有者在这方面投入的精力会更多,因此所提供信息的质量也会越高。主题:去图书馆偶然间看到一本关于元朝的书,随手翻了几页发现自己关于这个朝代的认识是如此之浅、如此陌生,由此对元朝产生了浓厚的兴趣。相信大家对这朝代的了解也不会很深,为了帮助大家更好的了解元朝,让元朝不再陌生,所以网站的主题就选取为“陌生的元朝”。当然此网站的建设只是让大家能对元朝有个初步的认识。总之这是一个以“陌生的元朝”为主题搭建的以资料阅读为主要目的的阅读性网站。2.2网站内容因为这是一个只供基本浏览的网站,而且以文字浏览为主,所以需要大量的经过筛选的文字材料。文字材料需要进行大量的输入,而且本人对元朝也只有了一定的初步了解而已,为避免出现较多错误、节省文字输入的时间、使网站的的内容更加丰富和全面以及提高网站建设的速度,一部分资料就直接从互联网上进行收集与下载。其中的资料图片还有背景图片基本上就是从互联网上采集得到。文字材料从这几个方面收集:简介使浏览者对网站的定位有个有个基本的认识,对是否继续浏览形6成判断,主要目的是吸引浏览者,引起浏览者的兴趣。军事、政治、经济:考察对一个国家的基本认识这几个要素是缺一不可的,就是这几个要素的相辅相成、互相影响构成了一个国家、王朝。至于文化方面的影响由于较为难以说明,就不提供单独资料进行介绍。但网站内提供了经过浏览能对内容提供互补的友情链接供浏览者进行链接更深的了解。疆域:元朝的疆域非常的辽阔可以说是令世界为之一震的真正的前所未有的国家。统治了大半个欧亚大陆。人类历史上也就独此一个王朝,因此,这方面的资料是必不可少的。2.3网站结构网页布局大致可分为“国”字型、拐角型、“T”字型、“L”字型、综合框架型、Flash型、变化型,在这里就不做一一论述了。其实在我们做设计的时候并没有过多的去考虑什么形式,最重要的是抓住客户的需求,把握网站的定位做出合理的框架布局。本网站因为栏目较少而且关联度较高、是相互并列的几个栏目,这一点在上一小节已介绍过,所以采用较为紧凑的结构,使浏览者能快速点击所需栏目进一步浏览。为了能突出每个栏目的主要内容首页另行采用其它结构,对每个栏目进行关键介绍。73网站制作3.1网页制作分辨率:网页的整体宽度可分为三种设置形式:百分比、、像素+百分比。通常在网站建设中以像素形式最为常用,行业网站也不列外。我们在设计网页的时候必定会考虑到分辨率的问题,常用的是1024*768和800*600的分辨率,网络上很多都是用到778个象素的宽度,在800的分辨率下面往往使整个网页很压抑,有种不透气的感觉,其实这个宽度是指在800*600的分辨率上网页的最宽宽度,不代表最佳视觉,不妨试试760~770的像素,不管在1024还是800的分辨率下都可以达到较佳的视觉效果。空间的合理利用:很多的网页都具有一个特点,用一个字来形容,那就是“塞”,它将各种各样的信息如文字、图片、动画等不加考虑的塞到页面上,有多少挤多少,不加以规范,导致浏览时会遇到很多的不方便,主要就是页面主次不分,喧宾夺主,要不就是没有重点,没有很好的归类,整体就像个大杂烩。让人难以找到需要的东西。有的则是一片空白失去平衡,也可以用个“散”字来形容。文字编排:在网页设计中,字体的处理与颜色、版式、图形化等其他设计元素的处理一样。8文字图形化:文字图形化就是将文字用图片的形式来表现,这种形式在页面的子栏目里面最为常用,因为它具有突出,同时又美化了页面,使页面更加人性化加强了视觉效果。是文字无法达到的。对于通用性的网站弊端就是扩展性不强。强调文字:如果将个别文字作为页面的诉求重点,则可以通过加粗、加下划线、加大号字体、加指示性符号、倾斜字体、改变字体颜色等手段有意识地强化文字的视觉效果,使其在页面整体中显得出众而夺目。这些方法实际上都是运用了对比的法则。如果在更新频率低的情况下也可以使用文字图形化。它由域名(domainname俗称网址),网站源程序和网站空间三部分构成。域名(俗称网址);网站空间由专门的独立服务器或租用的虚拟主机承担;网站源程序则放在网站空间里面,表现为网站前台和网站后台。配色:1、用一种色彩。这里是指先选定一种色彩,然后调整透明度或者饱和度,(说得通俗些就是将色彩变淡或则加深),产生新的色彩,用于网页。这样的页面看起来色彩统一,有层次感。2、用两种色彩。先选定一种色彩,然后选择它的对比色再进行微小的调整。整个页面色彩丰富但不花哨。3、用一个色系。简单的说就是用一个感觉的色彩,例如淡蓝,9淡黄,淡绿;或者土黄,土灰,土蓝。也就是在同一色系里面采用不同的颜色使网页增加色彩,而又不花,色调统一。这种配色方法在网站设计种最为常用。4、灰色在网页设计中又称为“万能色”,其特点是可以和任何颜色搭配,在使用时把握量避免网页变灰。在网页配色中,尽量控制在三种色彩以内,以避免网页花、乱、没有主色的显现。背景和前文的对比尽量要大,(绝对不要用花纹繁复的图案作背景),以便突出主要文字内容。网站制作执行的工作类型就业性质Web开发人员可以找到所有类型的企业,包括大型企业和政府部门,中小型企业,或者单独作为自由职业者的工作。有些网络开发人员工作的一个组织作为一个永久的全职雇员,而另一些可能作为独立的顾问公司,职业介绍所或承包商。现代的Web应用程序通常包含三层或更多层,上规模的团队的开发工作,他或她可以专注于一个或多个这些层面或可能需要一个多学科交叉的作用。页面打开速度:打开速度要快如果不能保证每个页面下载速度,至少应该保证主页能尽快的打开,因此,让网页简单化相当重要,尽量将最重要的内容放在首页以及避免使用大量的图片。页面下载速度是网站留住访问者的关键因素,一般人的耐心是有限的,如果10-25秒还不能打开一个网页,就很难让人等待了。在国外,现在已经大大流行使用文字降低了网页的视觉效果,显得有些呆板,但有过专题调查,“网民上网都是为了看什么?”表明网友们上网的时间大多数是看文字资讯。103.2网页测试市面上现在的浏览器有很多主流的有InternetExplorer简称ie,微软公司旗下浏览器,googlechrome浏览器,google旗下浏览器,追求简洁、快速、安全的浏览器,firefox浏览器,简称FF浏览器,mozilla公司旗下浏览器,好用的浏览器,safari浏览器,苹果公司旗下浏览器,在苹果系统下是很优秀的浏览器,已停止对windows系统的支持opera浏览器,挪威厂商opera旗下浏览器,该公司还在研发另一款浏览器operanext。还有360浏览器、搜狗浏览器、QQ浏览器、UC浏览器等国内目前用户较多的浏览器。对于网站开发者来说,开发的网页要适应不同的浏览器,这样对于网民来说,就很方便了。对于开发者来说,不同的浏览器有不同的占有率,并且不同的浏览器对标准的支持程度也有差别,对主流浏览器一定要支持。在开发过程中基本上微软的IE浏览器和火狐浏览器为主。个人电脑软件有限网站只对InternetExplorer11、360浏览器7、QQ浏览器、UC浏览器进行兼容性测试与修改。4总结网站的建设是对一个人综合能力较好的测试,需要有全局意识,能较好把握整个网站的整体规划,还需要动手能力、对各种已存在知识、功能的探索能力。网站的建设对于新手实在不易,以后需要多动手实践实践,学会分析别人的网页。