课件：dreawmeaver.ppt

准备知识： （1）HTML标签：标识HTML文件的开始和结束 （2）head标签：网页属性信息，包含了许多网页的属性信息 （3）title标签：标识当前网页的标题 （4）body标签：主体标签，body标签和/body标签之间包括文档中所有文本、图像等网页元素的内容。 （5）p标签： 段落标签，p标签和/p标签之间是一个段落的内容 （6）font标签：字体标签，用来设置文字的格式 （7）img标签： 图像标签，设置网页中图像的来源、尺寸、对齐方式等属性 （8）a标签： 设置超级连接目标和名字等 活动二：认识HTML HTML是Hyper Text Markup Language的简称 一、网页的属性（背景与标题） 二、网页中的文字 三、网页中的图片 四、网页中的链接 活动二：认识HTML 活动引导： 通过直接修改网页中的代码可以很快地改变网页中各个网页元素的属性，但要记住如此众多的标签和相关属性的代码，却不是一件容易的事情。那么让我们来通过对Dreamweaver的学习，利用它所见即所得的优势，来轻轻松松地做自己的网页吧！ 活动二：认识HTML 活动小结 THANK YOU SUCCESS * * 可编辑 1.3.1 站标 站标也叫LOGO，是网站的标志，其作用是使人看见它就能够联想到企业。因此，网站LOGO通常采用企业的LOGO。 LOGO通常采用带有企业特色和思想的图案，或是与企业相关的字符或符号及其变形，当然也有很多是图文组合。 1.3.2 导航栏 导航栏实际上是网站内多个页面的超链接组合。导航栏也是网站中所有重要内容的概括，可以让浏览者在最短时间内了解网站的主要内容。 设计导航栏时，有几点需要注意。 如果网站内容不多，并且导航栏不超过两排，可以根据网站风格尝试灵活摆放，如放在网页的左侧或者放在页面上方等。 页面左侧 页面上方 如果网站的栏目很多，可以将导航栏分为多排放置在主页LOGO的下方或右侧，为便于观看，可为各排设置不同的底色。 LOGO右侧 LOGO下方 如果导航栏内容较多的话，尽量使用文字超链接而不用图片。不过，如果导航栏内容不多，或者网页内容比较活泼的话，多采用图片或Flash制作导航栏。 图片导航栏 Flash导航栏 广告条又称Banner，其功能是宣传网站或替其他企业做广告，以赚取广告费。 1.3.3 广告条 在Banner的制作过程中有一些要点需要注意： Banner可以是静态的也可以是动态的。 Banner的体积不宜过大，尽量使用GIF格式的图片与动画或Flash动画。 Banner中的文字不要太多，只要达到一定的提醒效果就可以。 Banner中图片的颜色不要太多，尤其是GIF格式的图片或动画，要避免出现颜色的渐变和光晕效果。 这里的标题栏不是指整个网页的标题栏，而是网页内部各版块的标题栏，是各版块内容的概括。 标题栏可以是文字加单元格背景，也可以是图片，一般的大型网站都采用前者，一些内容少的小网站采用后者。 1.3.4 标题栏 标题栏 标题栏 网页中的按钮被点击之后，网页会实现相应的操作，比如页面跳转，或数据的传输等。 设计按钮时，要保证按钮与页面的协调，不能太抢眼，如果按钮上有字则尽量使用单色或渐变色背景，保证字迹清晰。当页面上有多个按钮的时候，应分清主次，根据网页的需要改变按钮的颜色或者大小。 1.3.5 按钮 按钮 按钮 THANK YOU SUCCESS * * 可编辑 实 训 搜索五个著名网站，分别把各网站的：站标、导航栏、广告条、标题栏用截图方式保存为图片到“网页元素.doc”文件中。 如： 图片导航栏 1.4.1　常用网站管理与网页编辑软件 1.4 常用网站管理与制作软件 Dreamweaver：网页制作软件三剑客之一，该软件是现在使用最多的网页编辑工具，它支持DHTML动态网页、Flash动画、插件，能实现很多FrontPage无法实现的功能，如动态按钮、下拉菜单等。另外，它还可以用来作为动态网站的开发环境。 FrontPage：该软件是目前最简单、最容易上手，且功能强大的网页制作利器，特别适合网页初学者使用。不过，Frontpage也有不少缺点：首先是兼容性不好，利用FrontPage做出来的网页往往不能用Netscape浏览器正常显示；其次，生成的垃圾代码多；此外，FrontPage对动态网页支持不好，不支持Flash，显得有点落伍了。 1.4.2 网页设计辅助软件 在进行网页制作时，除了需要Dreamweaver、FrontPage等软件外，还会用到Fireworks、Flash、Photoshop等软件，这些软件的主要功能与特点如下： F