第一篇：网页设计与制作总结
网页设计与制作
实训报告
班级：多媒体152
姓名：张莉钧
学号：201501032118
指导老师：薛杨 王淑惠
实训时间：6.20——6.24
一、实训目的：
1、进一步熟悉和掌握网站建设的基本流程和技术规范；
2、巩固运用Dreamweaver网页制作软件制作网页、特别是制作复杂网页的知识；
3、巩固运用PS图像处理软件进行网页中图形制作和运用flash动画制作软件设计网页中动画的知识；
4、巩固综合运用Dreamweaver、PS、flash三个软件完成网站建设任务的方法，能独立设计一个内容完整、图文并茂、技术运用得当的网站；
5、具备独立撰写实训报告基本能力；
6、在网页设计的实践中培养分析问题、解决问题的能力，培养协作、交流的能力，培养创新能力和团队意识；
7、紧紧围绕网页制作的流程：规划、设计、开发、发布、维护来进行网站的开发，制作出具有较高水准的静态网页。以此作为学生学习这门课程的阶段性总结，使学生复习、巩固所学过的理论，并予
以适当的深化，进一步训练学生的基本技能（如：搜集资料、整理数据、发现与分析问题、寻求解决问题的方案等），为今后从事网站开 发、维护和管理奠定基础
二、实训项目——特色美食餐厅网站设计
1、网站主题
我的网站的主旨在于从各个方面全面的介绍特色美食餐厅，包括它的菜品、餐厅的环境以及促销活动。另外，网站里还包括餐厅资料和联系方式，网站里的每一个网页都有统一的风格，每一个网页的主题色彩都是橙色和白色搭配，用以展示餐厅特色的效果。其实最重要的是要做出自己的风格，给浏览者好的欣赏感受。
2、网站材料
主要在网站上搜集所要的网页信息，包括图片、文字。同时，查
询相关的书籍、百度等方式收集所需的文字资料,图象资料,flash动画和网页特效等，用以得来更加具有说服力的页面。要想做好自己的网站，能够给浏览者好的欣感受，就要尽量搜集材料，搜集得材料越多，以后制作网站就越容易。精选自己收集的材料，作为自己制作网页的素材，这样就可以做好一个好的网站。
3、网站规划
我的网站共有７个主页面：首页、美食介绍、优惠活动、商品促销、宴会定制、会员中心和关于我们。每一个页面用统一的模块，以保证网站统一的页面风格。网页布局主要用框架和表格，用框架定位内容的大体结构，再用表格具体定位。位子的设计也是重要的一个部分，根据具体内容决定字体风格，相同的风格多次调用是CSS设计一个样式，以保证随时、准确的调用。
三、网页设计工具使用
1、Dreamweaver——我们使用它做网页的主要布局。
2、Photoshop——我们使用它做网页图片的处理以及logo的制作。
3、Flash——我们使用它制作动画
四、网站设计流程
1、主页设计
2、色彩搭配
五、网站测评
网站建成后为了出现不必要的错误，需对它进行测评，测评的主要内容为
1、链接有效性，静态网页只要保证每一个网页正常浏览保证页面信息不缺失就可以了。
2、网页语言的正确性，检查网页中英文拼写与html语言是否正确，在静态网页中语言都是自动生成的所以语言的正确性一般不会有太大的问题。
3、网站便用性，检查网站的整体结构是否清晰以及网站页面的导航是否清晰。
最终效果图
总结：
通过学习一学期的网页设计，我们收获了不少，我们这次实训虽然只做了一个网站，但这个里面包括的内容很多，主要包括网站主页的布局设计，建立站点，网页与网页之间的连接，以及模板和css样式表的应用。
收获：通过一个星期的网页设计实训，从中学到了不少的网页设计知识，之前都是老师讲得比较多，总以为很难实现，但自己做起来其实也并不是想象中那么苦难。虽然代码看起来复杂，但是慢慢学会分析就会懂。
不足：当然这次实训我也有不足，比如css样式表不能灵活应用，网页布局也不够完美，不过多亏了王老师和薛老师的细心指导，我才能完成这次实训。
Flash实训总结
班级：多媒体152
姓名：张莉钧
学号：201501032118
指导老师：薛杨
实训时间：2.flash培训实训总结提要：
这次实训过后，对flash有了基础的了解，想在这方面学习的话有了初步的基础，主要是学习了flash中各种工具的使用，1、确定动画剧本及分镜头；
2、设计出不同字母间的完美转换。、一、实训目地：让我们更熟练的应用flash制作动图
二、实训项目——不同字母间的形状变换
1、先要确定使用的字母w o r l d
2、再给每个字母使用不同的颜色以及给它们变形
3、最后再给每个字母做不同的变换方式
三、总结 实训收获: 通过这次实训我更加巩固了对flash的应用，虽然这中间有很多失误和很多不必要犯的错误，但更多的是收获，这次实训过后，对flash有了基础的了解，想在这方面学习的话有了初步的基础，主要是学习了flash中各种工具的使用，1、确定动画剧本及分镜头；
2、设计出字母形状；
3、导入到flash进行制作；
4、剪辑配音。在分镜头画面脚本绘制过程中，应养成填表的好习惯，在表格中注明画面的景别，画面景别使用的专业术语有：大特写、特写、近景、中景、全景、远景、全远景、纵深景等。画面镜头号景别秒数内容摘要对白效果音乐。存在的问题及解决思路: 这几个星期我学习的flash大多是比较基础的，Flash中字母刻画不够完善，很多动作，变形都需要有一定的美术功底及Flash基础，对于初学的我很困难，所以在此只做了一些简单的变形。在Flash中的一些脚本语言初学时无从下手，只好从大量的视频、书籍里寻找答案。4．结束语
为了对Flash的现况有更好的了解，主要是对于网上一些MV做了参考。现在的FlashMV已经逐渐成熟了。MV的制作从开始的大量使用位图，转换为矢量后让它们移动来制造动画效果，或者是一些简单的闪入、闪出来丰富画面，发展到现在的广泛使用矢量图甚至手工作图，一些费心思的逐帧动画让我看到了Flash的日渐成熟；从以前的生硬呆板，发展到今天的生动、逼真。Flash动画说到底就是“遮罩+补间动画+逐帧动画”与元件（主要是影片剪辑）的混合物，通过这些元素的不同组合，从而可以创建千变万化的效果。我不仅复习熟练了相关的课程、专业，还学习掌握了很多知识，同时也认识到还有很多基础知识要去学习，去巩固。在以后的时间里，我将花费大量的时间用于学习Flash及相关知识，在Flash之路上我会走的更远。
第二篇：网页设计与制作教学总结
教学总结
2010年7月5日
本学期承担0450821,04A0801班的网页设计与制作课程的教学任务。教学目的：通过课程的教学,使学生掌握该软件的操作方法和操作技巧,学会运用其创建个人网站.具备一定的网站设计能力,学会网站的测试、维护、发布及推广等。
教学内容：通过实例的讲解，让学生掌握网页制作和网站开发的知识。从如何策划网站、收集网站资料、准备素材、各个页面的逻辑关系和链接的建立到网站动态系统的开发，如何申请空间和域名，如何上传网站以及网站测试、维护、发布及推广等。
教学方法：多媒体教学时，准备好教学课件和教学素材，采用项目教学法，围绕实例，掌握相关知识点和操作方法，增强学生学习兴趣，掌握网页的制作和处理方法，提高学生解决和处理问题的能力。通过实践课程环节，加强技能培训，学会举一反三，融会贯通，提高综合运用能力。增强学生探究和创新意识,学习科学探究的方法,发展综合运用知识的能力,增进学校与社会的密切联系,培养学生的社会责任感。
教学课时：60学时。多媒体教学占三分之一，实践教学占三分之二。教学评价：本课程为考试科目。平时成绩占40%，期末考试占60%。平时成绩包括：迟到、早退、旷课，上课纪律，书面练习，平时上机实践作品完成情况（此项为重点）。
通过本学期的教学,顺利地完成了教学目标。总之，一学期的教学工作，取得了良好的教学效果。
第三篇：网页设计与制作-论文（本站推荐）
第一章
绪论
摘 要
本论文将对个人网页设计与制作的方法、工具等展开研究和探讨。在介绍网页设计与制作语言的基础上，着重使用JavaScript作为工具语言进行网页设计与制作的实际操作，分别对基于对象的JavaScript语言、内部对象系统的使用及WEB页面信息交互——窗口和框架进行详细描述，并利用具体的实例进行验证。
本论文主要章节如下，第一章：绪论，本章主要介绍网页设计的相关知识。第二章：网页设计语言概述，本章主要介绍网页设计的语言——HTML，以及用于编辑HTML语言的软件，为后续工作奠定基础。第三章：基于对象的JavaScript语言，本章介绍了基于对象的JavaScript中常用内部对象属性、方法的使用。第四章：内部对象系统的使用，本章主要介绍使用浏览器的内部对象系统，可实现与HTML文档进行交互。第五章：WEB页面信息的交互——窗体与框架，本章主要介绍实现网页的动态交互，必须掌握有关窗体对象（Form）和框架对象（Frames）更为复杂的知识。
关键词： 网页制作；网页设计；HTML；ASP
第一章
绪论
第一章 绪论
随着21世纪的到来，人们更深切地感受到计算机在生活和工作中的作用越来越重要，越来越来的职业需要具有计算机的应用技能。掌握计算机是职业的需要，更是事业发展的需要。网页设计与制作是计算机能力的具体表现，本章主要介绍网页设计的相关知识。
1.1 网页设计概述
网站是企业向用户和网民提供信息(包括产品和服务)的一种方式,是企业开展电子商务的基础设施和信息平台，离开网站（或者只是利用第三方网站）去谈电子商务是不可能的。企业的网址被称为“网络商标”，也是企业无形资产的组成部分，而网站是INTERNET上宣传和反映企业形象和文化的重要窗口。
1.2 网页设计的要素
网页设计的两大要素是：整体风格和色彩搭配。
一、确定网站的整体风格
在这里，我提供给大家一些参考经验：
1．将你的标志logo，尽可能的放在每个页面上最突出的位置。2．突出你的标准色彩。
3．总结一句能反映贵站精髓的宣传标语！
4．相同类型的图像采用相同效果，比如说标题字都采用阴影效果，那么在网站中出现的所有标题字的阴影效果的设置应该是完全一致的！
二、网页色彩的搭配
1．用一种色彩。这里是指先选定一种色彩，然后调整透明度或者饱和度，这样的页面看起来色彩统一，有层次感。
2．用两种色彩。先选定一种色彩，然后选择它的对比色。
3．用一个色系。简单的说就是用一个感觉的色彩，例如淡蓝，淡黄，淡绿；或者土黄，土灰，土蓝。
1.3 大作业目的和意义
本大作业主要是对网页设计与制作的语言基础上进行探讨，主要内容如下：通过已经做好的网页，分析html网页设计技术、XML技术、Java Applet技术和Javascript技术在网页设计中的应用。
第一章
绪论
1.4 要分析的网页
第一章
绪论
第一章
绪论
第二章
HTML网页设计技术的应用
第二章 HTML网页设计技术的应用
2.1 HTML语言介绍
HTML（HyperText Mark-up Language）即超文本标记语言或超文本链接标示语言，是目前网络上应用最为广泛的语言，也是构成网页文档的主要语言。
HTML文本是由HTML命令组成的描述性文本，HTML命令可以说明文字、图形、动画、声音、表格、链接等。HTML的结构包括头部（Head）、主体（Body）两大部分，其中头部描述浏览器所需的信息，而主体则包含所要说明的具体内容。
2.1.1 HTML语言的特点
HTML文档制作不是很复杂，且功能强大，支持不同数据格式的文件镶入，这也是WWW盛行的原因之一，HTML语言的特点如下：
1、简易性，HTML版本升级采用超集方式，从而更加灵活方便。
2、可扩展性，HTML语言的广泛应用带来了加强功能，增加标识符等要求，HTML采取子类元素的方式，为系统扩展带来保证。
3、平台无关性。虽然PC机大行其道，但使用MAC等其他机器的大有人在，HTML可以使用在广泛的平台上，这也是WWW盛行的另一个原因。
2.1.2 HTML语言的编辑软件
HTML的本质是文本，需要浏览器的解释，HTML的编辑器大体可以分为三种：
1、基本编辑软件，使用WINDOWS自带的记事本或写字版都可以编写，当然，如果你用WPS来编写，也可以。不过存盘时请使用.htm或.html作为扩展名，这样浏览器就可以解释执行了。
2、半所见即所得软件，这种软件能大大提高开发效率，它可以使你在很短的时间内做出Homepage，且可以学习HTML，这种类型的软件主要有HOTDOG，还有国产的软件网页作坊。
3、所见即所得软件，使用最广泛的编辑器，完全可以一点不懂HTML的知识就可以做出网页，这类软件主要有Frontpage，DREAMWEAVER、Delphi、Eclipse、UltraEdit。
2.1.4 html语言在网页设计中的应用
第二章
HTML网页设计技术的应用
2.2.3JavaScript技术在网页设计中应用
一、JavaScript概述
JavaScript是一种基于对象(Object)和事件驱动(Event Driven)并具有安全性能的脚本语言。使用它的目的是与HTML超文本标记语言、Java 脚本语言（Java小程序）一起实现在一个Web页面中链接多个对象，与Web客户交互作用。从而可以开发客户端的应用程序等。它是通过嵌入或调入在标准的HTML语言中实现的。它的出现弥补了HTML语言的缺陷，它是Java与HTML折衷的选择，具有以下几个基本特点：
1、是一种脚本编写语言
JavaScript是一种脚本语言，它采用小程序段的方式实现编程。像其它脚本语言一样,JavaScript同样已是一种解释性语言,它提供了一个易的开发过程。
它的基本结构形式与C、C++、VB、Delphi十分类似。但它不像这些语言一样，需要先编译，而是在程序运行过程中被逐行地解释。它与HTML标识结合在一起，从而方便用户的使用操作。
2、基于对象的语言。
JavaScript是一种基于对象的语言，同时以可以看作一种面向对象的。这意味着它能运用自己已经创建的对象。因此，许多功能可以来自于脚本环境中对象的方法与脚本的相互作用。
3、简单性
JavaScript的简单性主要体现在：首先它是一种基于Java基本语句和控制流之上的简单而紧凑的设计, 从而对于学习Java是一种非常好的过渡。其次它的变量类型是采用弱类型，并未使用严格的数据类型。
4、安全性
JavaScript是一种安全性语言，它不允许访问本地的硬盘，并不能将数据存入到服务器上，不允许对网络文档进行修改和删除，只能通过浏览器实现信息浏览或动态交互。从而有效地防止数据的丢失。
5、动态性的
JavaScript是动态的，它可以直接对用户或客户输入做出响应，无须经过Web服务程序。它对用户的反映响应，是采用以事件驱动的方式进行的。所谓事件驱动，就是指在主页(Home Page)中执行了某种操作所产生的动作，就称为“事件”(Event)。比如按下鼠标、移动窗口、选择菜单等都可以视为事件。当事件发生后，可能会引起相应的事件响应。
6、跨平台性
JavaScript是依赖于浏览器本身，与操作环境无关，只要能运行浏览器的计算机，并支持JavaScript的浏览器就可正确执行。从而实现了“编写一次,走遍天下”的梦想。
实际上JavaScript最杰出之处在于可以用很小的程序做大量的事。无须有高性能的电脑，软件仅需一个字处理软件及一浏览器，无须WEB服务器通道，通过自己的电脑即可完成所有的事情。
总之，JavaScript 是一种新的描述语言，它可以被箝入到 HTML 的文件之中。JavaScript语言可以做到回应使用者的需求事件(如：form的输入)，而不用任何的网路来回传输资料，所以当一位使用者输入一项资料时，它不用经过传给伺服端(server)处理，再传回来的过程，而直接可以被客户端(client)的应用程式所处理。
第二章
HTML网页设计技术的应用
第五章
色彩在网页中的应用
第五章 色彩在网页中的应用
5.1色彩在网页中的应用
色彩是艺术表现的要素之一。在网页设计中，我们的设计师根据和谐、均衡和重点突出的原则，将不同的色彩进行组合．搭配来构成美丽的页面。根据色彩对人们心理的影响，合理地加以运用。
先选定一种色彩，然后调整透明度或者饱和度，这样的页面看起来色彩统一，有层次感。简单的说就是用一个感觉的色彩，例如淡蓝，淡黄，淡绿；或者土黄，土灰，土蓝。
在网页配色中不要将所有颜色都用到，尽量控制在三至五种色彩以内。背景和前文的对比尽量要大以便突出主要文字内容。
5.2主页色彩的处理
色彩是人的视觉最敏感的东西。主页的色彩处理得好，可以锦上添花，达到事半功倍的效果。色彩总的应用原则应该是“总体协调，局部对比”，也就是：主页的整体色彩效果应该是和谐的，只有局部的、小范围的地方可以有一些强烈色彩的对比。在色彩的运用上，可以根据主页内容的需要，分别采用不同的主色调。因为色彩具有象征性，例如：嫩绿色、翠绿色、金黄色、灰褐色就可以分别象征着春、夏、秋、冬。其次还有职业的标志色，例如：军警的橄榄绿，医疗卫生的白色等。色彩还具有明显的心理感觉，例如冷、暖的感觉，进、退的效果等。另外，色彩还有民族性，各个民族由于环境、文化、传统等因素的影响，对于色彩的喜好也存在着较大的差异。充分运用色彩的这些特性，可以使我们的主页具有深刻的艺术内涵，从而提升主页的文化品位。
5.3常用的配色方案
1.暖色调。即红色、橙色、黄色、赭色等色彩的搭配。这种色调的运用，可使主页呈现温馨、和煦、热情的氛围。
2.冷色调。即青色、绿色、紫色等色彩的搭配。这种色调的运用，可使主页呈现宁静、清凉、高雅的氛围。
3.对比色调。即把色性完全相反的色彩搭配在同一个空间里。例如：红与绿、黄与紫、橙与蓝等。这种色彩的搭配，可以产生强烈的视觉效果，给人亮丽、鲜艳、喜庆的感觉。
第五章
色彩在网页中的应用
最后，还要考虑主页底色（背景色）的深、浅，这里借用摄影中的一个术语，就是“高调”和“低调”。底色浅的称为高调；底色深的称为低调。底色深，文字的颜色就要浅，以深色的背景衬托浅色的内容（文字或图片）；反之，底色淡的，文字的颜色就要深些，以浅色的背景衬托深色的内容（文字或图片）。这种深浅的变化在色彩学中称为“明度变化”。当然，色彩的明度也不能变化太大，否则屏幕上的亮度反差太强，同样也会使读者的眼睛受不了。
5.4合理搭配网页色彩
网页的色彩是树立网站形象的关键之一，网页的背景、文字、图标、边框、超链接等都要用到色彩。不同的色彩会使浏览者有不同的心理感受。合理的搭配色彩，会更好的表现主题，吸引用户的注意力。网页色彩涉及到艺术知识，让美术教师参加网页色彩设计，可能会出现比较理想的效果。在色彩搭配上要注意色彩的鲜明性、独特性、合适性、联想性。背景色和前景色对比要大，以突出主要内容
网站给人的第一印象来自视觉冲击，不同的色彩搭配产生不同的效果，并可能影响到访问者的情绪。“标准色彩”是指能体现网站形象和延伸内涵的色彩，要用于网站的标志，标题，主菜单和主色块。给人以整体统一的感觉。至于其它色彩也可以使用，但应当只是作为点缀和衬托，绝不能喧宾夺主。一般来说，一个网站的标准色彩不超过3种，太多则让人眼花缭乱。适合于网页标准色的颜色有：蓝色，黄/橙色，黑/灰/白色三大系列色。
第五章
色彩在网页中的应用
第六章 WEB页面信息的交互——窗体与框架
要实现网页的动态交互，必须掌握有关窗体对象（Form）和框架对象（Frames）更为复杂的知识。
6.1窗体基础知识
窗体对象可以使设计人员能用窗体中不同的元素与客户机用户相交互，而用不着在之前首先进行数据输入，就可以实现动态改变Web文档的行为。
6.1.1窗体对象
窗体（Form）：它构成了Web页面的基本元素。通常一个Web页面有一个窗体或几个窗体，使用Forms[]数组来实现不同窗体的访问。
在Forms[0]中共有三个基本元素，而Forms[1]中只有两个元素。窗体对象最主要的功能就是能够直接访问HTML文档中的窗体，它封装了相关的HTML代码：
6.1.2 窗体对象的方法窗体对象的方法只有一个--submit()方法，该方法主要功用就是实现窗体信息的提交。如提交Mytest窗体，则使用下列格式：
document.mytest.submit()
第五章
色彩在网页中的应用
6.1.3 窗体对象的属性
窗体对象中的属性主要包括以下：elements name action target encoding method。除Elements外，其它几个均反映了窗体中标识中相应属性的状态，这通常是单个窗体标识；而elements常常是多个窗体元素值的数组，例：
elements[0].Mytable.elements[1] 6.1.4 访问窗体对象
在JavaScript中访问窗体对象可由两种方法实现：（1）通过访问窗体
在窗体对象的属性中首先必须指定其窗体名，而后就可以通过下列标识访问窗体如：document.Mytable()。
（2）通过数组来访问窗体
除了使用窗体名来访问窗体外，还可以使用窗体对象数组来访问窗体对象。但需要注意一点，因窗体对象是由浏览器环境的提供的，而浏览器环境所提供的数组下标是由0到n。所以可通过下列格式实现窗体对象的访问：
document.forms[0] document.forms[1] document.forms[2]...6.1.5 引用窗体的先决条件
在JavaScript中要对窗体引用的条件是：必须先在页面中用标识创建窗体，并将定义窗体部分放在引用之前。
6.2 窗体中的基本元素
窗体中的基本元素由按钮、单选按钮、复选按钮、提交按钮、重置按钮、文本框等组成。
在JavaScript中要访问这些基本元素，必须通过对应特定的窗体元素的数组下标或窗体元素名来实现。每一个元素主要是通过该元素的属性或方法来引用。其引用的基本格式见下：
formName.elements[].methadName(窗体名.元素名或数组.方法)formName.elemaent[].propertyName(窗体名.元素名或数组.属性)下面分别介绍：
（1）Text单行单列输入元素
功能：对Text标识中的元素实施有效的控制。基本属性：
Name：设定提交信息时的信息名称。对应于HTML文档中的Name。Value：用以设定出现在窗口中对应HTML文档中Value的信息。defaultvalue：包括Text元素的默认值 基本方法：
blur()：将当前焦点移到后台。
第五章
色彩在网页中的应用
select()：加亮文字。主要事件：
onFocus：当Text获得焦点时，产生该事件。OnBlur：从元素失去焦点时，产生该事件。Onselect：当文字被加亮显示后，产生该文件。onchange：当Text元素值改变时，产生该文件。例：
...（2）textarea多行多列输入元素功能：实施对Textarea中的元素进行控制。基本属性
name：设定提交信息时的信息名称，对应HTML文档Textarea的Name。Value：用以设定出现在窗口中对应HTML文档中Value的信息。Default value：元素的默认值。方法：
blur()：将输入焦点失去 select()：将文字加亮后 事件：
onBlur:当失去输入焦点后产生该事件 onFocus:当输入获得焦点后，产生该文件 Onchange:当文字值改变时，产生该事件 Onselect:当文字加亮后，产生该文件（3）Select选择元素
功能：实施对滚动选择元素的控制。属性：
name:设定提交信息时的信息名称，对应文档select中的name。Length:对应文档select中的length options:组成多个选项的数组 selectIndex;该下标指明一个选项
select在中每一选项都含有以下属性： Text:选项对应的文字
selected:指明当前选项是否被选中 Index:指明当前选项的位置 defaultselected:默认选项 事件：
第五章
色彩在网页中的应用
OnBlur：当select选项失去焦点时，产生该文件。onFocas:当select获得焦点时，产生该文件。Onchange:选项状态改变后，产生该事件。（4）Button按钮
功能：实施对Button按钮的控制。属性：
Name:设定提交信息时的信息名称，对应文档中button的Name。Value:用以设定出现在窗口中对应HTML文档中Value的信息。方法：
click()该方法类似于一个按下的按钮。事件：
onclick当单击button按钮时，产生该事件。例 ：
........（5）checkbox检查框功能：实施对一个具有复选框中元素的控制。属性：
name:设定提交信息时的信息名称。
Value:用以设定出现在窗口中对应HTML文档中Value的信息。Checked:该属性指明框的状态true/false.defauitchecked:默认状态 方法：
click()该方法使得框的某一个项被选中。事件：
Onclick：当框的选被选中时，产生该事件。（6）radio无线按钮
功能：实施对一个具单选功能的无线按钮控制。属性：
Name：设定提交信息时的信息名称，对应HTML文档中的radio的name相同 Value：用以设定出现在窗口中对应HTML文档中Value的信息，对应HTML文档中的radio的name。
length：单选按钮中的按钮数目。defalechecked:默认按钮。
checked:指明选中还是没有选中。
第五章
色彩在网页中的应用
index:选中的按钮的位置。方法：
chick():选定一个按钮。事件：
onclick:单击按钮时，产生该事件。（7）hidden:隐藏
功能：实施对一个具有不显示文字并能输入字符的区域元素的控制。属性：
name:设定提交信息时的信息名称，对应HTML文档的hidden中的Name。
Value:用以设定出现在窗口中对应HTML文档中Value的信息，对应HTML文档hidden中的value。
defaleitvalue:默认值（8）Password口令
功能：实施对具有口令输入的元素的控制。属性：
Name:设定提交信息时的信息名称，对应HTML文档中password中的name。Value:用以设定出现在窗口中对应HTML文档中Value的信息，对应HTML文档中password中的Value。
defaultvalu:默认值 方法：
select():加亮输入口令域。
blur():使这丢失passward输入焦点。focus():获得password输入焦点。（9）submit提交元素
功能：实施对一个具有提交功能按钮的控制。属性：
name:设定提交信息时的信息名称，对应HTML文档中submit。
Value:用以设定出现在窗口中对应HTML文档中Value的信息，对应HTML文档中value。
方法
click()相当于按下submit按钮。事件：
onclick()当按下该按钮时，产生该事件。
6.3窗体对象实例
下面我们演示通过点击一个按钮（red）来改变窗口颜色，点击“调用动态按钮文档”调用一个动态按钮文档。
test8_1.htm
调用动态按钮文档第四篇：网页设计与制作报告书
电子商务2班201341440213孙岩
网页设计与制作报告书
课程名称:网页设计与制作
专业班级：电子商务2班
学 号:201341440213 姓 名：孙岩
指导教师：王康哲
电子商务2班201341440213孙岩
目录
一．概要……………………………………………………………
二．网站开发……………………………………………………
三．应用工具方案……………………………………………
四．栏目划分……………………………………………………
五．代码表……………………………………………………….六．截图……………………………………………………………
七．结论…………………………………………………………… 2 6 7 13 14
电子商务2班201341440213孙岩
摘要：
在Internet飞速发展的今天，互联网成为人们快速获取、发布和传递信息的重要渠道，它在人们政治、经济、生活等各个方面发挥着重要的作用。因此网站建设在Internet应用上的地位显而易见，它已成为政府、企事业单位信息化建设中的重要组成部分，从而倍受人们的重视。
一、网页制作开发背景
Dreamweaver以其功能强大、容易上手、界面亲切而著称。它采用所见即所得的方式编辑网页，利用它可以轻松的组织、编辑网页并将其发布到指定的站点上，而且在发布之后还能对更新情况进行监控以更新站点的内容。现在流行的网页制作软件有很多，如Macromedia公司的Dreamweaver、微软公司的Dreamweaver、还有Adobe Pagemill 3.0--制作多框架，表单和Image map 图像的网页工具、Netscape等等。其中Dreamweaver更以其功能强大、容易上手、界面亲切而著称。它采用所见即所得的方式编辑网页，利用它可以轻松的组织、编辑网页并将其发布到指定的站点上，而且在发布之后还能对更新情况进行监控以更新站点的内容。工具准备好了，可根据你的个人喜好来选择一些素材，如图片、喜欢的文章等。
二、网页制作设计技巧
首先，我们来看一下创建一个只包含一个网页的站点。选择“文件”菜单的“新建”选项，单击“站点”命令，这时新建站点对话框就弹出来了，在“指定新站点位置”文本框中输入新站点的位置，单击“只有一个网页的站点” 图标，单击“确定”按钮。这就建立好站点了，我们现在来看一下新的站点里有什么，单击“视图”工具条的“文件夹”按钮。在文件夹列表里有一个网页文件，名字叫做“index.htm”。我们知道，每一个站点都要有一个主页，这个主页也是一个网页文件。浏览者访问站点时首先进入的就是站点的主页。主页的名字在一般情况下就叫做“index.htm”。就是说我们新建只包含一个网页的站点时，DREAMWEAVER就自动为我们创建了站点的主页了。这个新建的站点主页时空的，我们可以向里面添加内容。
在文件列表里除了主页之外，还有文件夹。新建站点时，DREAMWEAVER都会在站点所在位置下新建两个文件夹，一个是“images”另一个是“_private”。我们在编辑站点时可以在“image”文件夹里放置站点用到的图片。“private”
电子商务2班201341440213孙岩
文件夹比较特殊，其中的文件对浏览者来说是隐含的，我们可以把一些不想让浏览者看到的网页文件放在这个文件夹里，比如：我们可以在这个文件夹里存放注册用户的个人信息。
尽管每一个站点都要有一个主页，不过创建站点时我们仍然可以从一个空站点开始：选择“文件”菜单的“新建”命令，单击“站点”选项，在“新建站点”对话框里，我们可以选择“空站点”图标来创建一个空站点。“新建站点”对话框中还有许多其他图标，这是DREAMWEAVER提供的用来创建站点模板或向导。我们创建只有一个网页的站点或者创建空站点，都是从头开始来创建一个站点，这就好像盖房子一样，首先画图纸。然而，有许多的房子都具有相似的结构和用途，所以我们可以用一张图纸盖很多相似的房子，这样就节省了许多工作。
基于表格的设计：表格布局使网页设计师制作网站时有了更多选择。在 HTML 中表格标签的本意是为了显示表格化的数据，但是设计师很快意识到可以利用表格来构造他们设计的网页，这样就可以制作较以往作品更加复杂的，多栏目的网页。表格布局就这样流行了起来，融合了背景图片切片技术，常给人以看起来较实际布局简洁得多的结构。
结构设计：这个时期的网页设计还不太关注语义化和可用性方面的问题，主要还在追求良好的结构美学。同一时期也是大量应用 GIF 占位图片控制留白的时期。一些主流的公司甚至训练设计师如何使用 GIF 占位;如微软的“关于 HTML 表格中的 GIF 占位”。第一批主要应用表格布局的“所见即所得”网页设计软件的发展助长了表格的应用。另外，某些软件自动生成的表格如此复杂以至于许多设计师不可能从头手写代码(例如每行只有 1px 高却包含了几百列的表格)。即使是稍微复杂一点儿的网页(比如多栏目页面)，设计师们都要依赖于表格来创建。
三、网站结构
网站结构是指网站中页面间的层次关系;按性质可分为逻辑结构及物理结构。网站结构对网站的搜索引擎友好性及用户体验有着非常重要的影响。
（一）网站结构整体先用DIV和CSS来进行构造，对整个网站进行布局，(二)网站结构是衡量网站用户体验好坏的重要指标之一。清晰的网站结
电子商务2班201341440213孙岩
构可以帮助用户快速获取所需信息;相反，如果一个网站的结构极其糟糕的话，用户在访问时就犹如走进了一座迷宫，最后只会选择放弃浏览。
（三）网站结构还直接影响搜索引擎对页面的收录，一个合理的网站结构可以引导搜索引擎从中抓取更多有价值的页面。
网站结构对网站及网站中页面的影响。搜索引擎对重要页面的抓取
由于互联网中信息量极其庞大，为了向用户展示更多有价值的信息，搜索引擎会优先抓取每个网站中相对重要的页面(即权重较高的页面),然而，搜索引擎是怎样发现这些重要页面的呢?根据重要页面的链接指向的页面可能是重要页面的思路;搜索引擎首先会从权重相对较高的页面(即源页面)出发跟踪其中的链接，从而抓取其他相对重要的页面(即目标页面)。
网页设计的要素
四、应用工具方案
DreamWeaver自制动态HTML动画的网页。
DreamWeaver是一个很酷的网页设计软件，它包括可视化编辑、HTML代码编辑的软件包，并支持ActiveX、JavaScript、Java、Flash、ShockWave等特性，而且它还能通过拖拽从头到尾制作动态的HTML动画，支持动态HTML(Dynamic HTML)的设计，使得页面没有plug-in也能够在Netscape和IE 4.0浏览器中正确地显示页面的动画。同时它还提供了自动更新页面信息的功能。
DreamWeaver还采用了Roundtrip HTML技术。这项技术使得网页在DreamWeaver和HTML代码编辑器之间进行自由转换，HTML句法及结构不变。这样，专业设计者可以在不改变原有编辑习惯的同时，充分享受到可视化编辑带来的益处。DreamWeaver最具挑战性和生命力的是它的开放式设计，这项设计使任何人都可以轻易扩展它的功能。
版面布局：在你开始设计之前，你必须仔细地为站点挑选色彩组合。千万不要出现紫色的背景加上黑蓝色的文字的组合。要使整个站点保持同一种色彩组合，因为不同颜色组合的背景或字体可能会是非常令人讨厌的。你也可以选用一个背
电子商务2班201341440213孙岩
景图，而不是仅用一种颜色。背景图案可以自己绘制，也可以从因特网上下载。通过模糊背景图案，就可以使文字更容易被阅读。要记住的是，图片不会被浏览器重画的，而背景色彩则是要被重新画的，因此，在上传你的图片之前，必须检查不同的浏览器是如何显示这些网页的。当增加文字时，尽量设置容易被阅读的字体和大小。如果你使用背景图片，那么，当网页被浏览时，背景色和字体将会先于背景图片被下载，因此，如果背景色和文本的颜色没有鲜明的对照的话，那么浏览者会有几秒钟的时间看到一个充满了不可阅读的文本的网页。解决这个问题的简单的方法就是，使背景色与背景图的颜色相类似。
浏览导航：站点的浏览导航必须被设计成非常容易。如果需要，把站点分割为几个部分。最容易的方法，就是在整个网站的所有的网页的左边放置一个菜单条。当然，除此以外，还有许多可选的方法。对于具有大量信息的站点，使用一个可扩展的菜单条会是一个不错的选择。无论你使用何种导航模式，在每一页都放置一个主页链接，那会是一种不错的设计思想；浏览者必须知道，无论何时，当他们迷失在你的站点浏览中时，都可以通过简单的一次点击就能准确地知道目前所处的位置。
Frame(帧,框架)的问题：Frame—— 你也许会喜欢它，也许不喜欢。如果你在你的网站上使用帧，你很可能使一个帧用于导航目的，另一个帧用于放置内容。你可以看见在同一页上有两个被分割的浏览窗口，你点击左边的帧，只会改变右边的内容。用帧来组织网站的内容，显然是非常容易的。
检验你的HTML代码 ：不要在你的网站上放置浏览计数器。计数器会让你的网站看起来不够专业化，如果浏览量不够的话，还会起到相反的宣传作用。最后，内容是金，如果能给的浏览者一些有价值的东西，如，信息，建议，或软件，那么就能吸引浏览者经常光顾你的网站。为你的站点增加消息板和聊天室，从而提高网站的交互性，使你和你的访问者交流，让访问者彼此交流。
五、频道栏目划分
图1
电子商务2班201341440213孙岩
六、代码段
content=“text/html;charset=gb2312” />
点击咨询 