网页设计大纲20141201(3).docVIP

PAGE28 / NUMPAGES62 《网页设计》教学大纲 编写人： 全体网页教师 课 时： 80课时 课程教学内容及目标 知识目标 掌握html 和 css的基本语法； 掌握html常用标记的含义、标记所具有的属性及含义； 掌握html标记在网页布局中的应用，了解基本的标记语义； 掌握css 常用属性及属性值 熟练应用html和css 编写常见静态网页。 掌握代码规范，兼容主流浏览器。 能力目标 通过本课程的学习要求学生掌握html基础、网页设计，为今后计算机软件的学习打好基础。 掌握html标记及其属性的含义，对标记的作用有深刻的理解。掌握常用的css样式，能够使用html+css进行常见的网页布局，符合代码规范，兼容主流浏览器，达到手写代码的能力。通过辅助大量的实战练习，锻炼学生的思考能力和动手的熟练程度。 掌握网站的基本概念，构成，建站流程。 在2小时内完成1.5屏企业网页。 参考教材 《精通HTML+CSS网页布局与样式》，刘增杰,史艳艳,刘玉萍编著， 清华大学出版社，2013年11月第一版 课程教学内容及考核要求 Html标签 第一单元：HTML基础 （4课时） 网页设计的重要性及案例展示 概念的重要性 Photoshop的基本操作 常用快捷键 选区工具的使用 切片工具的使用 图片的输出 格式的设置、优化和特点 标尺和参考线 吸管工具 图像的缩放 什么是网页 什么是网站 动态网页格式 什么是超文本 HTML简介 （重点） HTML标记 HTML基本标记 Html标记 Head标记 Body标记 Html基本标记结构（重点） Doctype[定义文档类型]及Meta 语言编码 站点的建立 （重点） 站点文件的操作 【考核要求】 掌握ps常用快捷键 保存 CTRL+S 复制 CTRL+C 粘贴 CTRL+V 自由变换 CTRL+T 放大 CTRL++ 缩小 CTRL+- 显示标尺 CTRL+R 临时使用抓手工具 【空格】 显示/隐藏“信息”面板 【F8】 取消选区：Ctrl+D 掌握选区工具的使用（注：会测量宽度和高度） 了解吸管工具使用（注：灵活运行吸管工具吸颜色） 掌握切片工具的使用（注：灵活运用切片工具切图） 掌握输出格式的设置及特点 网页中图片的常用格式gif、jpg、png和相应格式的特点 Gif格式只有256种颜色、支持透明、动画 Jpg格式颜色丰富、文件小 Png格式是无损压缩，文件大，支持透明。【半透明】 了解标尺和参考线（注：不需要考核） 掌握图像的缩放（注：快捷键） 掌握网页的概念：网页是网站中的任何一页面，通常文件扩展名为html、或htm(见教材p1页) 了解动态网页格式 .php .asp .jsp 掌握网站的概念：网站用于展示相关内容的网页的集合。 掌握超文本的概念：超文本是用超链接的方法，将各种不同空间的文字信息组织在一起的网状文本。 掌握标记的概念：“标记”是一些符号，用来区分文档中的不同部分。比如标题、段落、列表、图像等。(见教材p12页) 掌握标记也称标签，分为双标签和单标签。双标签是成对出现的如：head/head、body/body。单标签单个出现，如：img/、br/ 掌握html的概念：HTML（HyperText Markup Language,超文本标记语言）是用来描述网页的一种语言。 了解HTML简介(见教材p10页) html是一种标记语言，而不是编程语言，它是制作网页的基础语言，主要用于描述超文本中内容的显示方式。 掌握HTML基本标记(见教材p10页) Html标记以html开头，以/html结尾，文档的所有内容书写在开头和结尾的中间部分。html/html之间通常包含两部分，分别为head/head和body/body Head标记定义网页的头部 Body标记定义网页的主体 Title标记，用来设置网页的标题，放在head与/head之间。 掌握HTML基本标记结构：(见教材p12页) html head title/title /head body/body /html 了解Doctype[定义文档类型]及Meta 语言编码【uft-8 gb2312】 !DOCTYPE声明位于文档中的最前面的位置，处于html标签之前。此标签可告知浏览器文档使用哪种HTML或XHTML规范 掌握站点的概念：一个站点存储了一个网站包含的所有文件。 掌握利用高级方法建立站点：(见教材p17页) 站点中常见的三个文件夹分别为html（存放html文档），css（存放css文件）、images（存放图像） Flash（放动画） js(有特效) 了解网页文件夹、文件的命名规范：字母数字下划线组成，且不以数字开头。 项目及步骤 项目1 项目1