《第1章初识.ppt》由会员分享,可在线阅读,更多相关《第1章初识.ppt(31页珍藏版)》请在淘文阁 - 分享文档赚钱的网站上搜索。
1、1第第1章章 初识Dreamweaver CS4 网络的兴起及快速发展,已经渗透到各行各业。尤其,促进商业网络化的发展,如改变了产品的销售方式,业务多渠道联系方式,加快信息的获取方式。诸如这些与网站离不开的,因为网站是发布这些信息的平台。而在开发网站过程中,Dreamweaver可以以“所见即所得”的特点,快速创建网页,是组建网站和设计网页的专业工具。本章学习要点:本章学习要点:2Dreamweaver CS4 新增功能Dreamweaver CS4工作环境什么是网页什么是网站网站相关术语了解XHTML1.1 1.1 认识认识Dreamweaver CS4Dreamweaver CS43 Dr
2、eamweaver CS4是Adobe公司发布最新的可视化网页设计工具,较Dreamweaver CS3而言发生较大的变化。尤其,其界面几乎是做了一次脱胎换骨的改进,从中看到了更多的设计元素。1.1.1 Dreamweaver CS41.1.1 Dreamweaver CS4新增功能新增功能41 1新增【实时】新增【实时】视图视图 【实时】视图与传统Dreamweaver设计视图的不同之处,在于它提供页面在某一浏览器中的非可编辑的、更逼真的呈现外观。2 2针对针对AjaxAjax和和JavaScriptJavaScript框架的代码提示框架的代码提示 充分利用Dreamweaver CS4的扩
3、展编码功能和集成包括jQuery、Prototype和Spry在内的流行JavaScript框架,可以快速编辑Ajax和JavaScript代码,53 3新增新增“相关文件相关文件”功能功能 在Dreamweaver CS4中使用“相关文件”功能更有效地管理构成目前网页的各种文件。单击任何相关文件即可在【代码】视图中查看其源代码,在【设计】视图中查看父页面。4 4新增代码导航新增代码导航器器 新增的“代码导航器”功能可显示影响当前选定内容的所有代码源,如CSS规则、服务器端包括、外部JavaScript功能、Dreamweaver模板和iframe源文件等。65 5InContext Edit
4、ingInContext Editing InContext Editing是一种在线寄宿服务,允许用户在Web浏览器中对内容进行简单的更改。6 6CSSCSS最佳做法最佳做法 Dreamweaver CS4属性检查器可以使用户创建新的CSS规则,并对每个属性所适合的层叠样式提供简单明确的解释。77 7HTMLHTML数据集数据集 在网页中集成动态数据,而无需另外学习掌握数据库和XML(可扩展标记语言)编码。8 8PhotoshopPhotoshop智能对象智能对象 在Dreamweaver中插入任何Photoshop PSD图像时,即可创建一个图像智能对象。89 9SubversionSub
5、version集成集成 Dreamweaver CS4集成了Subversion软件(开源的版本控制系统),以提供更为可靠的存回/取出体验。1010新的用户界面新的用户界面 使用共享的用户界面设计可以在Creative Suite组件中更加快速智能地工作。1.1.2 Dreamweaver CS41.1.2 Dreamweaver CS4工作环境工作环境9 启动软件后,会弹出窗口及【欢迎屏幕】对话框。用于打开最近使用过的文档或创建新文档。其中有3个栏目,分别是【打开最近的项目】、【新建】和【从模板创建】。在三个栏中单击任意一个栏中的文字和图标,即可打开相应的窗口。1.2 认识网页和网站认识网页
6、和网站 很多用户都知道,在网络空间中遨游时,是离不开网站的。而Dreamweaver软件也是用来制作网页与开发网站的工具。101.2.1 1.2.1 什么是网站什么是网站 网站(Website)是指在因特网上,根据一定的规则,使用HTML等工具制作的用于展示特定内容的相关网页的集合。简单地说,网站是一种通讯工具,就像布告栏一样,人们可以通过网站来发布自己想要公开的资讯,或者利用网站来提供相关的网络服务。人们可以通过网页浏览器来访问网站,获取自己需要的资讯或者享受网络服务。111.2.2 1.2.2 什么是网页什么是网页 网页(web page)是网站中的一个页面,通常是HTML格式(文件扩展名
7、为.html或.htm或.asp或.aspx或.php或.jsp等)。网页通常用图像档来提供图画。网页要使用网页浏览器来阅读。网页是构成网站的基本元素,是承载各种网站应用的平台。通俗的说,网站是由网页组成的。121 1构成网页的元素构成网页的元素 文字与图片是构成一个网页的两个最主要的元素。其中,文字是传达网页信息的媒介,而图片用于美化网页的。另外,网页的元素还包括动画、音乐、程序等等。132 2网页的类型网页的类型 通常看到的网页,都是以htm或html后缀结尾的文件,俗称HTML文件(静态网页)。不同的后缀,分别代表不同类型的网页文件,如CGI、ASP、PHP、JSP等等。1.2.3 1.
8、2.3 网站建设流程网站建设流程1确定网站主题确定网站主题 网站的主题是一个网站的核心,创建网站前要先确定站点的主题,只有主题确定之后才会有目的地去寻找相关的资料,所以确定网站主题非常重要。2搜集网站素材搜集网站素材 搜集网站素材主要围绕网站主题进行搜集,主 要为满足各页面信息的需求。网站素材是指从现实生活中搜索到的、未经加工提炼的用来建设网站的资料。143确定网站布局确定网站布局 网站布局与绘画非常相似,起始就像一张白纸,需要先勾勒出网站中各页面的轮廓。如网站的结构、栏目的设置、网站的风格、颜色搭配、版面布局、文字图片的运用等,只有在制作网页之前把这些方面都考虑到了,才能在制作时胸有成竹。4
9、制作网页制作网页 已经了解到,网站是由许多不同的网页组成,而在开发网站时其核心就是设计不同的网页。在设计网页时,需要选择一些工具,如Dreamweaver是设计网页很好一个工具。除些之外,还有其他工具,以及一些设计网页的辅助工具。155发布网站信息发布网站信息 网页制作完毕,最后要发布到Web服务器上,才能够让其他网络用户浏览。简单的说,是将本地网站中的文件,放置到服务器指定的文件夹中。因此,如果服务器不是本地计算机,那么需要通过FTP将文件上传到远程服务器中。6网站推广网站推广 网页做好之后,还要不断地进行宣传,这样才能让更多用户该网站,提高该网站的访问率和知名度。推广网站的方法有很多,如搜
10、索引擎排名、网站之间交换链接、加入广告链等。167后期更新与维护后期更新与维护 网站是营销的一个重要的手段,它是将企业或者单位推广出去的一种方法。尤其,商业化的网站,更需要经常性的更新。这样才能不断吸引浏览者再次光临,使潜在的消费者变成客户,如果网站一成不变,是无法获得更多的商业机会的。例如,一个新闻网站,如果网站中的新闻不比陈旧,那么无法吸引浏览者。171.3 1.3 网站相关术语网站相关术语 术语是各学科、行业的专门用语。在网页设计中,经常要使用到术语。了解术语的含义,有助于同行业间的交流,也有助于用户对该专业的理解。网站的术语可以包含两部分,一部分为网络与网站相关的术语,另一部分是网站及
11、网页设计中的相关术语。181.3.1 1.3.1 网络术语网络术语 网站与网络是分不开的,所以在介绍网站的同时,我们先来了解一下网络中与网站密切相关的一些术语。191 1InternetInternetInternet(中文为因特网)又叫做国际互联网。它是由那些使用公用语言互相通信的计算机连接而成的全球网络。一旦连接到它的任何一个节点上,就意味着您的计算机已经连入Internet网上了。202 2电子邮件电子邮件 电子邮件(简称E-mail,标志:,也被大家昵称为“伊妹儿”)又称电子信箱、电子邮政。3 3URLURL URL的中文全称为统一资源定位符,其作用是用于完整地描述Internet上的
12、网页和其他资源。URL标识在Internet中是唯一的,一个URL标识只能表示一个网页或其他资源的位置。214 4域名域名 从技术上讲,域名只是一个Internet中用于解决IP地址对应问题的一种方法。它可以是Internet中的1个服务器或1个网络系统的名称。该名称是全世界唯一的,因此被笼统称为网址。5 5IPIP地址地址 众所周知,在电话通讯中,电话是靠电话号码来识别的。同样,在网络中为了区别不同的计算机,也需要给计算机指定一个号码,这个号码就是“IP地址”。1.3.2 1.3.2 网站术语网站术语1 1浏览器浏览器 浏览器是指可以显示网页服务器或者文件系统的HTML文件内容,并让用户与这
13、些文件交互的一种软件。2 2首页(主页首页(主页)首页是浏览器打开时进入的网站的第一页,或者是网站建站时树状结构的第一页。3 3LogoLogo Logo是徽标或者商标的英文说法,起到对徽标拥有公司的识别和推广的作用,通过形象的logo可以让消费者记住公司主体和品牌文化。224 4BannerBanner 在网页中Banner一般指网幅广告、旗帜广告、横幅广告等。5 5导航导航条条 导航条是网页的重要组成元素。设计的目的是将站点内的信息分类处理,然后放在网页中以帮助浏览者快速查找站内信息。6 6版块版块 网页的内容版块是整个页面的组成部分。237 7版尾版尾信息信息 版尾,亦即页面最底端的版块
14、。这部分位置通常放置网页的版权信息,以及网页所有者、设计者的联系方式等。8 8上传上传/下载下载 上传就是将信息从个人计算机(本地计算机)传递到服务器(远程计算机)系统上,让网络上的人都能看到。241.4 1.4 了解了解XHTMLXHTML XHTML(The Extensible Hyper Text Markup Language),即可扩展的超文本标记语言,是由HTML(Hyper Text Markup Language,超文本标记语言)发展而来的一种网页编写语言,也是目前网络中最常见的网页编写语言。251.4.1 XHTML1.4.1 XHTML的基本语法结构的基本语法结构 相对于
15、HTML而言,XHTML语法更加规范和严格,使用XHTML书写的代码更加简洁、易于判读。编写XHTML文档,必须了解XHTML的基本结构。261XHTML结构结构XHTML编写的文档拥有固定的结构,包括声明、根元素、头部元素、主体元素4个部分。2声明部分声明部分XHTML在HTML的基础上,增加了声明部分,即标签。1.4.2 XHTML1.4.2 XHTML常用标签常用标签 XHTML是根据XML语法简化,并兼容HTML各种标签的网页编写语言。在书写XHTML的标签时,必须注意其与HTML的一些细微的区别。281XHTML标签书写规范标签书写规范2常见的块状标签常见的块状标签3常见的内联标签常见的内联标签4常见的可变标签常见的可变标签命名空间Using XHTML with namespaces类似于词典的功能,该词典通常存放在W3C服务器中,并供用户通过URL调用,其主要用于解释XHTML中标签的类型、属性以及使用规范。大部分浏览器为提高页面执行效率,会把一些常用的命名空间直接建立在本地计算机中。XHTML标签书写规范所有标签必须闭合所有标签和属性必须小写所有标签的属性必须使用引号必须合理嵌套标签所有属性必须被赋值课堂练习熟悉和使用Dreamweaver CS4软件课后阅读和参考XHTML1.0手册课后阅读和参考dreamweaver_cs4_help.pdf创建第一个页面
限制150内