《网页设计与制作》自学指导计划Word文件下载.docx
《《网页设计与制作》自学指导计划Word文件下载.docx》由会员分享，可在线阅读，更多相关《《网页设计与制作》自学指导计划Word文件下载.docx（23页珍藏版）》请在冰豆网上搜索。
第四章，主要介绍如何进行网页的版面布
第五章，详细讲解应用FlashMX2004和FireworksMX2004制作网站动画
第六章，详细讲解CSS技术在网页中的应用
第七章，Javascript语言特效
第八章至第九章，利用ASP进行动态交互及动态数据库的运用
第十章，介绍如何测试站点，如何定义个人Web服务器，以及上传与后期维护全过程。
课程教材：
《网站全程设计技术（修订本）》出版社:
清华大学出版社/北京交通大学出版社系列名:
高等学校计算机科学与技术教材作者:
吴涛等
参考资料：
①《机电一体化系统设计》（第2版，“十五”规划教材），张建民主编，高等教育出版社，2001
②《机械系统设计》（“十五”规划教材），赵韩主编，高等教育出版社，2004
③《机电一体化》，高森年（日）主编，科学出版社，2001
课程教学大纲：
规定了课程的框架与结构；
多媒体课件：
凝练课程内容，诠释重点和难点；
自学指导计划：
梳理课程的知识点，介绍学习方法和步骤，帮助有效使用多媒体课件；
习题分析及练习：
通过习题和联系加深对课程内容的理解，并将课程知识运用于解决实际问题；
答疑与辅导：
是一种辅助教学手段，及时有针对性地解决学习过程中出现的疑难问题。
通过本课程的学习，应使学生掌握如何用系统的观点进行机电系统的系统分析和总体设计的方法，具备部件子系统的设计能力。
上述两大知识模块的有机结合，构成了机械电子工程设计的规律、方法和体系结构。
二、学习计划
第一章网站设计概述
1.1基本要求
掌握超链接的概念和URL概念，了解网站主题、名称和CI形象的定位、网站风格和创意设计、网站设计的主要工具以及网站设计流程。
1.2内容概要
1．2．1基本概念
WWW：
中文名“万维网”，也称“全球信息网”，它作为Internet上的新一代用户界面，摒弃了以往纯文本的信息交互手段，而采用超文本方式。
网页的组成：
文字、图片、动画、超链接、特殊组件
超链接：
网页中的一段文字、一幅图象、或者图象中的一部分都可以进行超链接，当用户单击这些对象时，浏览器会根据其指示或链接地址转到页面相应位置或载入新的页面。
URL：
每个站点及站点上的每个网页都有一个唯一的地址，这个地址称为统一资源定位器。
1．2．2网站类别
门户类网站、信息发布类网站、电子商务类网站、资源服务类网站、娱乐游戏类网站、远程教育类网站。
1．2．3网站主题、名称盒CI形象的定位
a.题材盒内容的选择
1、主题要小而精
2、内容要新颖
3、题材是自己擅长或者爱好的内容
4、题材不要太滥，目标不要太高
b.网站民称和域名的选择
1、名称要准确
2、名称要有特色
3、名称要易记
c.网站CI形象的定位
1、标志
2、色彩
3、字体
4、标语
1．2．4网站的整体风格和创意设计
a.网站风格
b.网站的创意
1.准备期2.孵化期3.启示期4.验证期5.形成期
1．2．5网站设计的主要工具
a.网站设计的应用软件
1.Frontpage2.Photoshop3.Dreamweaver4.Fireworks5.Flash
b.网站设计的编程语言
1.HTML2.XML3.VRML4.CSS5.JAVASCRIPT6.DHTML
1．2．6网站设计流程
1.3自学要点
1．本章主要为了解内容，超链接和URL需要掌握。
2．www简介、网页组成为常识性内容
3．网站主题、名称、CI形象定位以及网站风格和创意属于我们在网站规划前需要考虑的主要问题。
4．网站设计流程是告诉我们一个良好的工作习惯，能起到事半功倍的作业。
第二章网站设计基础语言HTML
2.1基本要求
1．掌握HTML语言结构
2．掌握文件标签
3．排版标签中常用标签<
p>
、<
br>
div>
需要掌握
4．字体标签中<
b>
font>
5．表格标签<
table>
6．表单标签<
form>
input>
select>
option>
textarea>
7．超链接标签需要掌握
2.2内容概要
2．2．1HTML简介
a.HTML语法：
由标签和属性组成，标签都由“<
>
”括起来，大多标签都成对出现。
大部分标签还包括一些属性，以提供更多的相关信息，对标签作用的内容进行更详细控制。
通常属性都有一个值。
b.HTML语言结构：
HTML是标准的ASCII文件。
一个Web页就是一个HTML文档，其基本的架构可以分为3部分：
HTML标签<
html>
和<
/html>
，首部标题声明标签<
head>
/head>
，以及文件主体标签<
body>
/body>
。
c.HTML标签的结构形态
1．<
标签>
元素<
/标签>
2．.<
标签属性名＝“属性值”>
/>
3．<
2．2．2创建HTML文档
a.用编辑软件创建HTML文档
b.用工具软件创建HTML文档
2．2．3文件标签：
<
title>
a.text属性：
用于设定文字的颜色
b.bgcolor属性：
设定背景颜色
c.link属性：
设定访问之前的超链接颜色
d.alink属性：
设定正在按下的超链接颜色
e.vlink属性：
设定访问之后的超链接的颜色
f.background属性：
设定背景图片
g.scroll属性：
可以用来隐藏浏览器滚动条
2．2．4排版标签
a.<
!
__>
：
注释标签
b.<
段落标签
c.<
换行标签
d.<
hr>
水平线标签
e.<
区段标签
2．2．5框架标签
框架标签允许设计者在多个视图内放置页面，这些视图可以以独立窗口的形式或子窗口的形式存在。
框架标签有3种：
frameset>
frame>
noframes>
标签
1.rows属性可以是一系列值，值与值之间以逗号分隔。
它代表每个窗口的高度，这个高度可以是绝对高度（像素为单位），也可以是相对高度（以百分比为单位）
2.3自学要点
1．了解HTML语法结构
2．掌握创建HTML文档的几种方法
3．熟悉常用的HTML标签。
文件标签：
；
排版标签：
框架标签：
字体标签：
表格标签：
tr>
td>
表单标签：
texearea>
超链接标签：
a>
多媒体标签：
img>
第三章网站设计软件基础
3.1基本要求
1．熟悉DreamweaverMX的工作界面。
特别是要熟悉插入栏和属性面版。
2．利用构建本地站点管理来规范自己的网站建设工作。
3．熟练应用创建和保存网页
4．熟练使用文本格式化
5．熟练应用图片插入
6．熟练应用表格和图层
7．熟练使用表单
8．了解应用模版和库提高网页制作效率
9．了解制作网页特效
3.2内容概要
1．界面熟悉，熟练使用插入栏和属性栏。
2．构建本地站点，掌握整个构建过程。
3．创建和保存网页，熟悉页面属性设置。
4．通过属性面版对文本格式化设置。
5．图片。
网页图象的格式通常有GIF、JPEG和PNG3种。
6．表单的功能主要是为了实现浏览网页的用户同服务器之间的交流。
表单对象有文本框、文本区域、复选框、单选框、列表与按钮。
7．可以通过模版和库来提高网页制作效率。
3.3自学要点
1．结合DreamWeaverMX软件操作来完成知识点的学习。
2．工具栏和属性面版要会熟练使用。
3．图片插入要注意相对路径与绝对路径。
4．通过制作特效来练习本章知识。
第四章网页版面布局
4.1基本要求
1．了解常规和常见的版面布局类型
2．掌握用表格进行布局设计。
3．了解用图层布局。
4．熟练使用布局模式进行布局
4.2内容概要
方案设计其实就是画出页面的结构草图。
需要确定如何把功能模块安排到页面上。
进一步解决各部分的技术问题，在确定了功能模块的大致位置后，需要对一些网站标志、题头和背景图进行设计，然后把设计好的模块放在初步设计中确定的位置上，这样一个网页的布局基本完成。
将初步的页面布局精细化、具体化，“”型布局是指页面顶部为横条网站标志与广告条，下方左面为主菜单，右面显示内容的布局，因为横条与菜单背景颜色相对深些，整体效果类似“”型，页面结构清晰，主次分明，是初学者最容易上手的布局方法。
“”型布局其页面顶部为横条网站标志与广告条，左面是主菜单，右面放友情链接等，中间是主要内容。
充分利用版面，信息量大，缺点是页面拥挤，不够灵活。
其它布局其优点显而易见，即漂亮、吸引人；
缺点就是速度慢。
由于页面尺寸与显示器大小及分辨率有关系，网页本身受显示器的范围限制，而且浏览器也占去不少空间，剩下的页面范围变得越来越小。
一般分辨率在800×
600的情况下，页面的显示尺寸为780×
428像素；
分辨率在1024×
768的情况下，页面的显示尺寸为1007×
600像素。
向下拖动页面是唯一增加页面尺寸的方法。
如果需要在同一页面显示超过3屏的内容，那么最好能在上面做页面内部联接，以方便访问者浏览。
为了使图片能够显示在文件中，图片文件必须保存在一个已经定义的本地站点中，让DreamweaverMX根据表格单元中的内容长度自行调节列的宽度。
框架是在同一浏览器窗口中显示多个相互隔离的HTML页面的结构，使用框架组织页面时，每个框架可显示一个不同的独立页面或者图像，可以将一些框架中的内容保留在浏览器窗口中，而使其余窗口的内容发生改变。
框架的布局主要用于在一个浏览器窗口中显示多个HTML文档。
通过构建这些文档之间的相互关系，实现文档导航、文档浏览及文档操作等目的。
在网页上创建框架有两种方法：
一是通过菜单中的命令来生成框架，二是插入一个预定义的框架。
[修改]菜单中的[框架集]命令，插入栏的[布局]选项卡，选择框架下拉按钮创建各类框架。
框架的属性面板，框架集的属性面板，框架本身的属性和框架体属性，框架名、源文件、页边空白、滚动条及单个框架尺寸。
[框架名称]：
用于超级链接目标及脚本中的当前框架名。
是一个单词，允许使用下划线“-”；
在框架中加入链接即可实现在框架中轻松地跳转，通过链接可改变另一个框架的内容。
在要链接的文件中指定一个锚，在锚的名字前加一个井号
升级会员 