1网站设计基础一.doc

课 题Dreamweaver网站设计基础一授课日期2012年8月27日课型专业技术课时 数4节【教学目标及要求】知识目标: （1）了解网站的分类（2）掌握网站基本概念网页、主页与网站（3）认识网页的基本元素（4）认识网站设计的工具能力目标:通过网站赏析，能了解网站设计中应考虑到的一些要素，能了解优秀网站应具备的一些特征要素，能够对网站提出自己的观点，阐述其优点和不足， 掌握网站的基本概念和初步认识网站设计的工具。德育目标:l 了解当前社会网站制作的需求，了解本课程对日后职业的影响。【教学重点与难点】l 网页、主页与网站l 网页的基本元素【教学方法】演示法、案例教学法【教学教具或教学媒体形式】5号多媒体机房教学过程教学内容时间分配及互动设计【导入新课】1、明确本门课程在当前的应用2、明确本门课的任务与内容10分钟【新课讲授】一、网页制作的发展趋势（网站的分类）1、 门户网站：以搜索引擎为特征的门户网站，如：新浪、雅虎、搜狐等。2、 行业网站：一般含有行业内的新闻及最新动态、行业政策法规、行业内的技术交流及新产品介绍等。3、 企业网站：是企业宣传产品和服务的窗口。4、 个人网站：网站的内容及风格因人而异。二、网页、主页与网站1、 网页：也称为web页，一般指浏览时出现在地址栏中以及.htm、.html、或.asp结尾的文档，即浏览网页时所看到的每个页面。2、 主页：或称为首页，是进入网站后所看到第一个页面，即进入一个网站的门户。3、 网站：是一系列网页的有机集合，通常通过超级链接把网站中的各网页联系起来。三、网页的基本元素1、 文本：是网页传导信息的主体，网页上的大部分内容都是用文本表现的。在制作网时，可以根据需要设置文本的字体、字号、颜色及其他格式。2、 图像：图像在网页中可以起到提供信息、展示作品、美化网页以及体现风格的效果。图像可以用作标题、网站标志（Logo）、网页背景、链接按钮、导航栏、网页主图等。3、 超级链接：是从一个网页指向另一个目的端的链接。4、 导航栏：导航栏能够使访问者方便返回主页或者进一步访问。5、 表格：是一种用来控制网页布局的有效方式。6、 表单：是一种特殊的网页元素，它通常用来收集信息或实现一些交互式的效果。其主要功能是接收用户在浏览器的输入，然后将这些信息发送到用户设置的目标端。例如：申请电子邮箱就需要填写一系列的表单。7、 多媒体：声音、动画、视频等多媒体元素。四、了解网页制作的常用工具1、 网页布局软件：常用的网页布局软件有Dreamweaver和FrontPage。Dreamweaver是由Micromedia公司开发研制的，它的排版能力较强、功能全面、操作灵活、专业性强，因而受到广大网站专业设计人员的青睐。本课程主要学习DreamweaverCS3。2、 网页图像处理软件：Fireworks、Photoshop3、 网页动画制作软件：Flash五、安装Dreamweaver CS4认识Dreamweaver CS41、 安装Dreamweaver CS42、 认识Dreamweaver CS4的工作环境请学生了解以下工作界面组成, 不要求掌握其功能：标题栏，菜单栏，插入面板，工具栏，工作窗口，状态栏，属性面板，组合面板3、新建一个站点，新建一个网页，添加图片和文本，预览网页，体会网页制作的成功的喜悦。4、常用面板：简单浏览插入面板（选择不同按钮）与属性面板（输入一行文字并定义）。5、面板的调整 打开和关闭面板：关闭： 关闭面板组；打开： 组合面板： 调整组合面板的大小：按鼠标左键拖动 还原面板的位置：窗口排列面板6、辅助工具u 打开网格线（查看网格显示网格）u 标尺（查看标尺显示标尺）分钟问题一：按网站的功能来分，网站有几大类？15分钟30分钟问题二：总结给定网页上的基本元素？4分钟问题三：简单规划制作一班级网页问题四：Dreamweaver软件的基本操作与以往学习的软件有什么不同？【课堂小结】由于本课时实践内容较多，教师主要通过多媒体教学工具向学生生动形象的讲述有关理论知识及操作注意事项，并演示操作过程，随后学生完成课堂练习及课后习题，以巩固本课时所学的知识。（20分钟）【课堂练习】1、dreamweaver主要功能有哪些2、如何更改dreamweaver的界面风格3、规划建立班级网页。(20分钟)【布置作业】1、 网页的主要元素有哪些？2、 预习1.2网站建设？板书设计:（略）教学后记：