还剩15页未读,继续阅读
本资源只提供10页预览,全部文档请下载后查看!喜欢就下载吧,查找使用更方便
文本内容:
《网页设计与制作》教学大纲课程名称网页设计与制作课程编号适用专业艺术类本科生课时学时/学分40/
2.5实验上机学时/学分24/
1.5审定人开课部门
一、课程的性质与目的为了适应迅速发展的互联网技术开设了《网页设计与制作》课程该课程位于计算基础机教育体系的第二层次,是《计算机应用基础》的扩展课程本课程坚持理论与实践结合,知识与技能并重原则,向学生介绍互联网、网站和网页设计与制作的基本知识,并通过网页设计软件drcamwcaverCC的学习,掌握和使用网页设计与制作的方法和流程进一步提升学生计算机应用能力,以及艺术设计与计算机技术相结合的能力本课程采用课堂讲授与上机实践等相结合的教学方式,授课对象是艺术类本科生本课程的教学目的使学生.理解计算机万维网的基本工作方式,了解HMTL语言和CSS样式的基本概念和构成,以及网页设计的基本知识;.掌握网站本地站点的创立、编辑与管理;.掌握静态网页设计与制作的基本方法和流程;.能够在网页设计软件drcamwcaverCC环境下,独立完成设计、制作简单的静态网站的工作
二、课程主要内容第1章网页设计基础理论教学内容互联网基础Internet与Web服务URL路径服务器与客户机互联网数据中心L2网页设计知识
1.
2.1色彩122网页设计元素
1.
2.3页面布局
1.3网页标准化技术
3.完成练习案例的制作第11章HTML5和弹性布局理论教学内容
11.1HTML5概述
11.
1.1HTML5简介
11.
1.2HTML5特性
11.2HTML5布局
11.
2.1HTML5语义结构标签
11.
2.2课堂案例一在线课程
11.3弹性盒子布局
11.
3.1弹性盒子概念
11.
3.2弹性容器属性
11.
3.3弹性容器项目属性
11.
3.4课堂案例-尚品家居
11.4媒体查询应用
11.
4.1媒体查询
11.
4.2课堂案例-健康大步走5练习案例1练习案例一优胜企业网站
5.2练习案例一雅派服饰实践教学内容
1.练习HTML5语义标签的应用方法;
2.练习弹性盒子的应用方法;
3.练习媒体查询的应用方法;
4.完成练习案例的制作第12章jQueryMobile理论教学内容1jQueryMobile概述
1.1JQueryMobi1e简介
1.2jQueryMobile框架
1.3Data-属性
1.4jQueryMobile样式2使用jQueryMobile
102.1课堂案例一服装定制I
2.2JQueryMobile页面
2.3JQueryMobile列表视图
2.4jQueryMobi1e布局网格
2.5jQueryMobi1e可折叠区块
2.6jQueryMobile表单3jQueryMobile应用
3.1jQueryMobile版本
3.2面板Pannel
3.3弹窗Popup
3.4课堂案例一服装定制II.
3.5视口Viewport.
3.6自定义jQueryMobile主题
3.7打包jQueryMobile应用4练习案例
4.1练习案例一男人会装I
4.2练习案例一男人会装II实践教学内容
1.练习jQueryMobile应用方法;
2.练习jQueryMobile进阶应用方法
3.完成练习案例的制作第13章动态网页技术理论教学内容1动态网页技术概述2开发环境设置
2.1安装Wamp
2.2设置Wamp3设计数据库
3.1MySQL数据库
3.2使用PhpMyAdmin创建数据库4在Dreamweaver中创建PHP环境
4.1建立动态站点
4.2创建数据库连接
13.5数据库使用
1113.
5.1定义记录集
13.
5.2数据绑定
13.
5.3添加服务器行为
13.6课堂案例一美容美发
13.
6.1设计数据库
13.
6.2创建动态站点
13.
6.3创建数据库连接
13.
6.4发表留言页面
13.
6.5留言详细内容页面
13.
6.6留言列表页面
13.7练习案例一电子商务第14章综合实训理论教学内容网站规划网站设计logo设计banner设计页面设计主页制作主页面切图前期工作主页布局分析header区域制作导航栏区域制作banner区域制作内容区域制作footer区域制作子页面制作家园简介子页面切图制作子页面模板新建家园简介子页面其他子页面制作页面超链接设置实践教学内容:
12.独立制作小型网站
三、课程教学基本要求第一章网页设计基础.理解Internet基本工作方式;.了解网页设计的基本特点和方法;.了解网页标准技术的基本内容;.理解网站设计与制作的流程第二章DreamweaverCC基础.了解Dreamweaver的主要功能和特点;.掌握站点创建与管理方法;.掌握页面代码的使用方法;.了解网页文件头的设置方法第三章页面与文本.掌握页面属性的设置方法;.掌握文本属性的设置方法;.掌握无序列表和有序列表的使用方法第四章图像、多媒体和表格.掌握图像插入及其属性设置的方法;.掌握多媒体的插入及其属性设置的方法.掌握表格的基本使用方法;.掌握利用表格进行网页布局的方法.了解表格的其他应用方法第五章超链接.理解超链接概念;.掌握创建和使用各种超链接的应用方法;.掌握站点链接的管理方法第六章CSS样式.理解CSS样式表的概念和组成;.掌握CSS样式表定义、创建、编辑和使用方法:.掌握利用CSS样式制作导航条的原理和方法.了解CSS属性分类和内容;
13.了解CSS过度效果和动画的使用方法第七章CSS+Div布局.理解和掌握盒子模型的概念和方法;.掌握CSS布局的基本技术;.掌握页面“上中下”布局的应用方法;.掌握页面“左中右”布局的应用方法第八章行为.理解行为和事件的概念;.掌握行为面板的使用方法;.掌握行为主要属性为网页添加特效的使用方法第九章模板和库.了解模板和库的概念;.基本掌握模板的使用方法;.基本掌握库的使用方法第十章表单和jQueryUI.理解表单概念;.基本掌握表单的创建及其使用方法;.基本掌握jQueryUI基本插件使用方法第H■•一章HTML5和弹性布局.了解HTML5的基本知识;.掌握HTML5语义标签的使用方法.掌握弹性盒子的概念和技术;4掌握网页弹性布局的使用方法.理解和掌握媒体查询的使用方法第十二章jQueryMobile.了解jQueryMobile的基本知识.基本掌握jQueryMobile基本使用方法;.基本掌握jQueryMobile进阶使用方法第十三章动态网页技术了解开发环境的设置方法;了解数据库的设计和连接的基本方法;14了解开发动态网页的基本方法第十四章综合实训
1.掌握完成简单网页制作的流程和方法
四、教学环节学时分配.总学时分配.实验项目的设置及学时分配15
五、本课程与其它课程的联系与分工本课程是《计算机应用基础》的后续课程,是《计算机动画基础》的关联课程,《计算机应用基础》的知识和实践是学习《网页设计与制作》的基础
六、实验应配备的主要设备、工具、器具名称上机实验所使用的设备是微型计算机
七、课程考核方式与成绩评定方式(实验部分单独列出)课程考核方式期末理论考试、平时上机实验考查以及综合实践大作业评定相结合的方式成绩评定方式结业成绩=期末理论考试x40%+上机实验考查X10%+综合实践大作业X50%
八、参考教材及实验指导书《网页设计与制作DreamweaverCC标准教程(微课版)(第4版)》修毅洪颖邵熹雯编著执笔人编写或修订日期年月日16超文本标记语言CSS样式脚本语言PHP技术前端UI框架技术Bootstrap框架MUI框架网站制作流程前期准备工作方案实施后期工作第2章DreamweaverCC基础理论教学内容DreamweaverCC工作界面工作环境工作区布局多文档的编辑界面创建网站站点创建新站点222新建和保存网页管理站点文件和文件夹课堂案例一慈善救助中心管理站点打开站点编辑站点复制站点删除站点页面代码HTML语言课堂案例一瑜伽会所使用代码
2.4网页文档头部信息设置设置搜索关键字设置描述信息设置版权信息设置刷新时间第3章页面与文本理论教学内容页面属性课堂案例一中国经济峰会网页标题文本分段与换行输入空格设置页面文字属性显示或隐藏不可见元素设置页边距设置背景属性文本属性课堂案例一百货公司设置文本属性文本段落插入日期插入特殊字符无序列表和有序列表课堂案例一咨询网站设置无序列表或有序列表练习案例练习案例一大学生国际电影节练习案例一移动银行网站练习案例一化妆品网站实践教学内容.练习页面属性设置的基本方法;.练习文本属性设置的基本方法;.完成练习案例的制作第4章图像、多媒体和表格理论教学内容图像插入课堂案例一茶叶网站插入图像图像源文件图像宽度和高度替换文本Html5网页多媒体课堂案例一米克音乐插入HTML5Video元素插入HTML5Audio元素表格简单操作表格的组成插入表格表格属性表格单元格属性在表格中插入内容选择表格元素合并和拆分单元格表格排版课堂案例一融通室内装饰复制和粘贴表格删除表格和清除表格内容增加或减少表格的行和列表格应用课堂案例一远景苑小区细线表格和带状表格练习案例练习案例一五金机械练习案例一古典音乐网练习案例一爱丽丝家具练习案例一逸购鲜花速递网实践教学内容.练习图像设置和应用的方法;.练习多媒体设置和应用的方法.练习表格的应用方法;.练习利用表格进行布局的方法;.练习表格其他应用方法.完成练习案例的制作5章超链接理论教学内容超链接的概念与路径知识按超链接端点分类按超链接路径分类文本超链接课堂案例-婚礼公司创建文本链接页面文本链接状态下载文件链接电子邮件链接空链接图像超链接课堂案例-手机商城创建图像超链接鼠标经过图像链接热点链接课堂案例-儿童课堂创建热点链接锚点超链接课堂案例-数码商城创建锚点链接链接管理课堂案例一百适易得商城自动更新链接链接检查564修复链接练习案例练习案例-室内设计网练习案例-多美味餐厅573练习案例-生物科普网实践教学内容.练习超链接的应用方法;.练习超链接的管理方法.完成练习案例的制作第6章CSS样式理论教学内容CSS样式CSS样式标准SS样式构造规则CSS样式种类CSS样式应用范围CSS样式设计器CSS样式选择器课堂案例一美好摄影CSS样式的使用CSS样式的编辑CSS属性课堂案例一走进台湾用<ul>和vli>设置导航条布局文字边框背景CSS过渡效果CSS样式私有属性课堂案例-墙体装饰CSS过渡属性CSS动画课堂案例一校园统一认证animation属性和@key「rames规则练习案例练习案例一航空旅游练习案例一狗狗俱乐部练习案例一养生美容实践实践教学内容.练习CCS样式创建和选择方法;.练习CSS属性编辑和使用方法;.练习利用vul>和vli>设置导航条方法;.练习设置CSS过度效果方法;.练习设置CSS动画方法;.完成练习案例的制作第7章CSS+Div布局理论教学内容盒子模型盒子结构盒子属性布局方法<div>标签position属性浮动方式“上中下”布局课堂案例一网页设计大赛在Dreamweaver中插入<div>标签“左中右”布局课堂案例一连锁餐厅使用CSS样式布局练习案例练习案例一电子产品练习案例一装修公司实践教学内容.练习<div>标签和position属性的应用方法;.练习“上中下”页面布局的方法;.练习“左中右”页面布局的方法.完成练习案例的制作第8章行为理论教学内容:
8.1行为
8.
1.1事件
8.
1.2动作
8.
1.3行为面板
8.2制作图像特效
8.
2.1课堂案例一吉太美食
8.
2.2交换图像
8.
2.3显示-隐藏元素
8.3改变属性
8.
3.1课堂案例一绿野网站建设
8.
3.2改变属性
8.4打开浏览器窗口
8.
4.1课堂案例一儿童摄影
8.
4.2打开浏览器窗口
8.5Javascript代码
8.6练习案例
8.
6.1练习案例一甜品饮料吧
6.2练习案例一校园信息中心实践教学内容.练习行为面板的使用方法;.练习利用各种行为属性为网页添加特效的方法;.完成练习案例的制作第9章模板和库理论教学内容1模板课堂案例一花仙子园艺
1.2创建模板
1.3定义可编辑区域
1.4定义可编辑重复区域
1.5创建基于模板的网页
1.6管理模板2库项目
2.1课堂案例一时尚女性网
2.2创建库项目
2.3向页面添加库项H
2.4更新库文件3练习案例
3.1练习案例一旗袍文化
3.2练习案例一恒生国际老年公寓实践教学内容
1.练习制作模板的方法;
2.练习制作库项目的方法
3.完成练习案例的制作第10章表单和jQueryUI理论教学内容1表单
1.1课堂案例一网页设计
1.2表单及属性
1.3文本元素
1.4单选按钮和单选按钮组
1.5:选框和复选框组
1.6选择
1.7文件元素
1.8按钮.9其他表单元素jQueryUI
2.1课堂案例一创意家居
2.2折叠面板Accordion
2.3选项卡Tabs
2.4日期选择器Datepicker
2.5对话框Dialog3练习案例
3.1练习案例一咖啡餐厅
3.2练习案例一网上生活超市实践教学内容.练习表单制作的方法.练习jQueryUI的应用方法章次讲课内容学时第一章网页设计基础1第一早DreamweaverCC基础3第三章页面与文本4第四章图像、多媒体和表格4第五章超链接4第六章CSS样式6第七章CSS+Div布局4第八章行为4第九章模板和库4第十章表单和jQuoryII4第十一章HTML5和弹性布局6第十二章jQueryMobile4第十三章动态网页技术2第十四章综合实训12综合测验2合计64序号实验项目名称学时实验类型每组人数必开/选开1DreamweaverCC基础1验证性实验1必开2页面与文本2验证性实验1必开3图像、多媒体和表格2验证性实验1必开4超链接2验证性实验1必开5CSS样式2验证性实验1必开6CSS+Div布局2验证性实验1必开7行为2验证性实验1必开6模板和库2验证性实验1必开7表单和jQucryUI2验证性实验1必开8HTML5和弹性布局3验证性实验1必开9jQueryMobile2验证性实验1必开10综合实践8综合性实验1必开。