网页制作工具实训一
Web开发(本)形考实训任务1结果
Web开发(本)形考实训任务1结果本文档旨在总结和介绍Web开发形考实训任务1的结果。
任务概述
实训过程
实训任务1的过程包括以下几个步骤：
1. 熟悉任务要求：学员首先需要仔细阅读任务要求，了解任务
的背景和目标。
2. 设计网页结构：学员需要根据任务要求设计网页的整体结构，确定网页所包含的主要元素和功能。
4. 样式设计：学员需要使用CSS样式来美化网页的外观，包括颜色、字体、布局等。
5. JavaScript交互：学员可以选择性地使用JavaScript来增加网
页的交互性和动态效果，例如表单验证、轮播图等。
6. 测试和优化：学员完成网页设计和开发后，需要进行测试来
确保网页在不同浏览器和设备上的兼容性，并对可能存在的问题进
行优化和修复。
结果总结
通过Web开发形考实训任务1，学员可以获得以下收获和成果：
2. 掌握网页设计和开发的基本流程和步骤，能够按照任务要求
进行系统的设计和实施。
3. 培养对网页设计和开发的兴趣和认识，为进一步深入研究和
实践打下基础。
总的来说，Web开发形考实训任务1为学员提供了一个初步的
实践机会，帮助他们掌握基本的网页设计和开发技能，并为日后的
研究和实践奠定了基础。
以上是Web开发形考实训任务1的结果总结，希望对您有所帮助。
实验一 基础网页制作
实验一基础网页制作一、实验目的：通过上机操作，使学习者熟悉Dreamweaver工作界面、对工作环境进行设置；掌握如何使用Dreamweaver创建、保存或打开一个网页文档；了解使用Dreamweaver 可以创建和打开哪些文档；掌握如何创建本地站点；掌握如何使用历史面板撤消或重复操作。
二、实验内容：1.熟悉Dreamweaver工作界面并进行首选参数设置；2.创建本地站点3.创建网页文档；4.设置头文件标签；5.使用历史记录面板。
6.将实验一的唐诗文件整理，放入站点内。
三、实验要求：1.熟悉Dreamweaver工作界面并进行首选参数设置认识Dreamweaver界面的组成、各个菜单项包含哪些命令，并根据个人的喜好和需要进行首选参数设置。
2.创建本地站点完成站点的创建、修改、删除等操作，并理解站点在网站设计中的重要性。
3.创建网页文档采用两种方式：直接向网页中添加文本；将word文档导入网页中，并对文本进行属性设置。
3.设置头文件标签认识各项头文件标签的作用，向头文件中添加说明信息，并在“代码”面板中查看说明信息。
5.使用历史记录面板使用历史面板重复或者撤消操作。
四、实验学时：4学时五、实验步骤：练习一：熟悉Dreamweaver工作界面并进行首选参数设置1.启动Dreamweaver（1）选择【开始】|【程序】|Macromedia |Dreamweaver命令，打开Dreamweaver 的初始工作界面（如图1.1），第一次启动Dreamweaver需要选择工作界面。
其中【代码编辑者】是纯代码编辑界面，适合对网页编程有很高水平的设计者。
选择【设计者】是本实验后面所介绍的使用界面。
（2）选择【设计者】工作界面，单击【确定】按钮，将进入图1所示的工作界面。
图1.1 Dreamweaver欢迎界面2．熟悉Dreamweaver的工作界面启动Dreamweaver，一个包含空白文档的Dreamweaver的工作界面就呈现在你工作区属性面板图1.2 Dreamweaver的工作界面注：各个工作区的作用参考教材P8 “1.4Dreamweaver的工作区”这一节。
《网页设计与制作》综合实训
《网页设计与制作》综合实训第一篇：《网页设计与制作》综合实训《网页制作》期末大作业一、概述：要求设计并制作一个表达某个主题的网站，通过网站的制作，综合运用本课程各单元所学的知识。
网站的内容不能是一些素材如图片、音乐等的堆积，必须有鲜明的主题。
可以从网上下载部分资料，但不能超过整个内容的30%，更不要指望从网上下一个完整的网站应付老师。
总的页数应超过10页（一个包含主题内容的htm文件算一页）。
请同学们注意不要下载相同的资料，如果出现网页内容雷同，双方都要扣分，严重的必须重做。
二、网站内容：自行选择如下内容：科普、科幻知识；公益形象宣传；大、中、小学教学用动画形象；奥林匹克体育；环境保护；战争与和平；求职；校园生活；诚信、传统美德；交通安全；卫生与健康；爱心；教育；新青年；管理；实用工具等。
自己确定一个主题，整个网站要突出主题，信息分类合理，导航清晰。
要求必须有自己创作的内容，这些原创内容可以是文字、图片、动画等。
三、版面及格式：l、要求图文并茂，颜色搭配合理，但是图片及声音文件不要太大。
如果能加入自己创作的动态元素(如Flash，Gif动画等)将获得加分。
希望充分发挥自己的创作能力。
2、要求每个网页都使用表格布局。
3、要求网页中插入有Web组件，包括悬停按钮、滚动字幕、横幅广告管理器等。
4、导航设计简洁明了，不能有“死链接”，要保证能够在网络上浏览。
5、自创内容越多越好，得分越高。
四、递交方式：1、每个同学以自己的学号姓名建一个文件夹，上交时间为18周2、所做网页的首页文件名必须为index.htm3、所有文件名和目录名全部使用英文字母和数字，不得使用汉字或全角符号，否则，网络将出现死链接。
4、递交时必须把网页中所有用到的图片、声音、动画等都一起上传到服务器。
网页的总容量一般不要大于3MB5、建议将网页中的素材分类，建立不同的子目录存放。
五、网页评分标准:整个网页的评分强调“自己的创意”，不管主题是什么，也不论是哪一个栏目的内容，如果创意独特，有自己鲜明的个性、观点，得分较高。
制作网页的实训报告
一、实训背景随着互联网技术的飞速发展，网页设计已经成为现代信息技术领域的一个重要组成部分。
为了提高我的网页制作技能，我参加了本次网页制作实训。
通过本次实训，我学习了网页设计的基本理论、实践技能，并成功制作了一个具有实用功能的网页。
二、实训目标1. 掌握网页设计的基本理论和方法。
2. 熟练运用HTML、CSS、JavaScript等网页制作技术。
3. 培养良好的网页布局和美工设计能力。
4. 提高网页制作效率，提升网页性能。
三、实训内容1. 网页设计基本理论在实训初期，我学习了网页设计的基本理论，包括网页设计原则、网页布局方式、色彩搭配、字体选择等。
通过学习，我明白了网页设计要遵循简洁、美观、实用、易用等原则。
2. HTML、CSS、JavaScript技术实训过程中，我重点学习了HTML、CSS、JavaScript等网页制作技术。
HTML用于构建网页的基本结构，CSS用于美化网页样式，JavaScript用于实现网页的交互功能。
3. 网页制作实践在掌握基本理论和技术的基础上，我开始进行网页制作实践。
以下是我制作的网页内容：（1）网页结构我制作的网页结构包括头部、导航栏、内容区、侧边栏和底部。
头部展示网站标题和logo，导航栏提供网站的主要分类，内容区展示网页的主要内容，侧边栏提供相关链接，底部展示网站版权信息。
（2）网页布局我采用响应式布局设计网页，确保网页在不同设备上均能正常显示。
在布局过程中，我运用了HTML的div标签进行页面划分，CSS进行样式设置。
（3）网页美化在网页美化方面，我注重色彩搭配和字体选择。
我选择了与网站主题相符的配色方案，并选用易于阅读的字体。
此外，我还运用了CSS3的动画效果，使网页更具动感。
（4）网页交互为了提高网页的交互性，我运用JavaScript实现了以下功能：- 点击导航栏切换内容区域；- 滚动页面时，侧边栏跟随滚动；- 点击侧边栏链接，实现页面跳转。
四、实训成果通过本次实训，我成功制作了一个具有实用功能的网页。
网页制作实训报告
网页制作实训报告第一篇：网页制作实训报告《网站设计与制作》实训报告X学院XX班XXX号一．实训时间：2010年6月7日到2010年6月13日二．实训地点：XXX学院XXX班级三．实训组员：XXX、XXX四．实训目标：运用网页设计方法，设计一个网站，提高综合应用所学知识的能力，积累Web网站的制作经验，培养团队协作精神。
本次实训的具体目标为:了解网站制作的一般流程;熟练使用网页制作工具Dreamweaver、Flash、Fireworks设计网页;能灵活运用表格、层和框架布局页面;熟练使用CSS样式表美化网页;正确使用JavaScript添加网页特效;灵活使用模板和库来制作网页；学会申请免费域名空间和正确上传站点的方法。
五．实训策划：这一周，我们要进行《网站设计与制作》实训，我们认为做网站前最主要的是确定主题、框架和标题栏的设计。
因此我们相互讨论之后，确定制作以“婚纱”为主题的“喜多坊时尚婚纱网”。
在之后的资料收集和网页的框架的建设中，我们发现了许多问题，某些关键点无法做出心中的效果，这让我们有些遗憾。
通过自身及组员的共同探索，我们已尽权利将以下是我们的策划内容：1.确定主题。
制作网页,首先是确定主题，冬天很冷,却冷得很幸福，刚刚过去的圣诞的热闹劲还在心头。
于是我们从幸福出发，想到了结婚-婚纱，建立一个简单的介绍婚纱的网站并取名喜多坊时尚时尚婚纱,专业介绍一些喜多坊婚纱的特色等。
我们本次间的网站基本以粉红为基点，粉红是可爱清纯的颜色，粉红代表着幸福温馨，所以本站以粉红为风格，让整个网站充满爱的力量。
2.设计主页。
主页的设计是整个网站的灵魂，构思导航栏的分类，然后是整体规划，每一版块都有其个性的色彩，清晰明了，便于阅读浏览，我们构思大致分几部分，首页，关于我们，婚纱礼服，量体裁衣，婚纱选购，公司门市，与我联系，在线论坛8大板块，每一板块又分几小部分，内容比较充分，多样。
确定导航栏的各个分类标题之后对于建立二级子网尤为重要，我们运用Photoshop CS3技术来设计出导航栏，制作切片，建立导航栏，将整体的主页效果建立起来。
实训一制作一个简单的网页
实训一制作一个简单的网页第一篇：实训一制作一个简单的网页实训一创建和管理站点、制作站点首页实训目标：用Dreamweaver制作一个简单的网页一、用Dreamweaver创建和管理站点（一）在D盘上创建“畅想未来”站点在菜单栏中选择“站点”→“新建站点”，在文本框中输入网站的名称“畅想未来”。
（二）对站点进行规划1．在文件面板中搭建站点的结构（1）在站点根文件夹下建立4个子文件夹“city”、“novel”、“outspace”和“travel”。
在文件面板中右单击站点“畅想未来”，选择“新建文件夹”命令。
2）在文件夹“city”中建4个子文件夹“images”、“sound”、“swf”和“webpages”。
3）将文件夹“city”中的4个子文件夹分别复制到“novel”、“outspace”和“travel”中。
6（（方法：依次选中“images”、“sound”、“swf”和“webpages”，然后按住Ctrl键，分别将其拖动到“novel”、“outspace”和“travel”中。
结果如下图所示。
（二）设置网站首页，重新搭建站点结构1．设置网站首页（1）右单击站点的根文件夹，从弹出的快捷菜单中选择“新建文件”命令。
（2）将文件重命名为“index.html”。
（3）将其设置成首页。
2．重新搭建站点结构（1）将站点的根文件夹下的4个子文件夹“city”、“novel”、“outspace”和“travel”删除。
（2）在站点的根文件夹下新建2个子文件夹“images”和“webpages”，如下图所示。
在Dreamweaver中打开文件“txt3_1.txt”，并将其另存为index.html。
二、设置index.html网页属性选择“修改”→“页面属性”，打开“页面属性”对话框。
（一）设置页面外观在“分类”→“外观”中按下图设置“页面字体”：宋体、“文本颜色”：#034881、“背景颜色”：#B8DCF4。
《网页设计与制作》-实训指导书
目录实训1 站点创建实训2 搜集素材实训3 用表格设计主页布局实训4 在主页制作中插入文本操作实训5 在主页制作中插入图像操作实训6 在主页制作中超级的设置实训7 制作动感网页实训8 表单制作实训9 CSS样式表的使用实训10 JavaScript技术实训11 应用行为实训12 利用框架制作“公司简介”网页实训13 利用布局表格制作“新书推介”网页实训14 模板和库的使用实训15 利用层的布局制作“技术支持”网页实训16 网页设计与管理实训17 开发综合实训实训1 站点创建实训目的为了让学生能熟练掌握创建站点的方法，掌握设置网页的页面属性，掌握创建目录结构、栏目文件夹、网页文件的基本操作方法。
实训环境硬件环境：考核用机为奔腾以上兼容机，存不少于 32M ，最好 64M 或128M ；硬盘不小于 500M ； VGA 彩显，带鼠标器。
操作系统：Windows95/98/me/2000/XP软件环境：Dreamweaver MX 2004特殊要求：必须将IIS配置好，能正常进行WEB浏览素材准备准备制作网页所需的文字素材。
实训课时2学时实训容创建站点：创建目录结构：创建栏目文件夹：创建网页文件：掌握设置网页的页面属性实训要求要求学生能掌握如何创建站点，正确创建目录结构及栏目文件夹，创建主页文件index.htm,并正确命名，掌握设置网页的页面属性的方法。
实训步骤1、在E盘中新建本地根文件夹，命名为bookman，并在该文件夹中新建image 文件夹以存放中所要用到的图片。
2、定义站点：设置 "站点名称"，命名为 "博客人";设置本地根文件夹,指定为E盘下的bookman文件夹;设置 "HTTP地址"为localhost。
3、创建目录结构及栏目文件夹(如下图):4、E盘下的bookman文件夹创建主页文件index.htm5、设置网页的页面属性。
网页制作上机练习
实验一使用Dreamweaver创立简单页面一、实验目的1、掌握HTML的根本构造2、熟悉Dreamweaver的工作环境3、掌握不同的视图下的操作及面板的使用4、会使用Dreamweaver创立、管理站点二、实验内容1、在Dreamweaver中创立一个站点〔1〕新建一个以自己学号或姓名拼音命名的文件夹〔2〕在Dreamweaver中新建站点，把站点设为新建的文件夹〔3〕观察创立站点前后的区别2、利用所学知识创立一个个人信息页面〔1〕新建一个HTML页面，添加标题为“个人简介〞〔2〕利用文字、程度线、特殊符号、背景颜色、背景图片等制作简单的个人信息页面3、制作一个中转页面〔1〕制作一个简单页面，添加标题和简单内容〔2〕通过设置<meta>标记，实现10秒后自动跳转到个人信息页面实验二超级链接与文本修饰一、实验目的1、掌握超级链接的不同创立方法2、理解锚点链接的作用，并会创立锚点链接3、熟悉文本的不同修饰方法二、实验内容1、创立“大话西游〞页面〔1〕字体与背景颜色等自行设计，要求搭配合理〔2〕第一行右上角有“联络我们〞，点击链接到dahuaxiyou@163 〔3〕第二行为标题，居中显示〔4〕内容要求不使用空格或换行等，居中显示如下：曾经有一份真诚的爱情放在我面前，我没有珍惜，等我失去的时候我才懊悔莫及，人世间总痛苦的事莫过于此。
……〔5〕下面有“下载〞两字，创立一个下载链接2、创立“我的影院〞主页面〔1〕字体与背景颜色等自行设计，要求搭配合理〔2〕第一行为标题〔3〕第二行为影院分类，例如：欧美电影、港台电影、大陆电影、……等，格式为“标题1〞，要求自左向右滚动显示，鼠标挪动时停顿滚动，移开时继续滚动〔4〕以下为电影名字，每个类型电影下都有相应的电影，要求每个名字单独一行，必须超过一屏；点击第二行的电影类型会自动跳转到下面相应的地方；同时港台电影中包括“大话西游〞，点击它可以转到“大话西游〞详细介绍页面。
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
《网页制作工具》实训一：网页文件编辑与发布
1．实训目的：
练习使用记事本编辑网页文档，使用FTP工具发布上传文件到服务器网站目录。
2．实训任务：
（1）“网页制作实训网站”首页文件Index.html页面显示如图所示，使用Windows“记事本”编辑网站首页文件，使用自己的班级、姓名、学号替换页面中的示例班级、姓名、学号，使用FTP 工具将该网站首页文件上传到自己的服务器网站目录中。
网页制作实训网站首页
（2）使用FTP工具将网页中使用的图片及文件夹上传到自己的服务器网站目录中。
3．实训指导：
（1）从Ftp://网站“《网页制作工具》课程教学资源”目录中下载Index.html 文件和Images文件夹到本地E:\。
（2）使用Windows的“记事本”打开Index.html文件。
在Index.html文件中找到如下内容：班级：计1022班
<br>
姓名：王彩霞
<br>
学号：31002002205
使用自己的班级、姓名、学号将相应内容替换掉（注意不要修改其他内容），保存文件。
在浏览器中检查显示是否正确。
（3）打开/zy网站，提交Index.html文件。
（4）从Ftp://网站上下载CuteFTP工具安装到本地计算机上。
（5）启动CuteFTP，将Web站点加入到CuteFTP站点中(包括IP地址、用户名、密码)。
（6）使用CuteFTP工具将Images文件夹上传到Web服务器的站点根目录下。
（7）在浏览器地址栏中输入：
http://网站域名/班号/学号
浏览自己发布的网站，检查显示是否正确。