dw网页设计基础.ppt
《dw网页设计基础.ppt》由会员分享,可在线阅读,更多相关《dw网页设计基础.ppt(61页珍藏版)》请在咨信网上搜索。
1、第1章 网页基础知识 w网页构成要素和组成元素w网页相关知识简介w网页的设计理念和配色方案w网站建设流程w典型网站分析1.1网页构成要素和组成元素1.1.1网页构成要素 网页的构成要素主要有站标、导航条、广告条、标题栏和按钮等。站标广告条导航条按钮标题栏1.站标 站标也叫Logo,是网站的标志,其作用是使人看见它就能够联想到企业。因此,网站Logo通常采用企业的Logo。Logo一般采用带有企业特色和思想的图案,或是与企业相关的字符或符号及其变形,当然也有很多是图文组合,如下图所示。2.导航条 导航条是网站内多个页面的超链接组合,它可以引导浏览者轻松找到网站中的各个页面。导航条导航条3.广告条
2、 广告条又称Banner,其功能是宣传网站或替其他企业做广告。Banner的尺寸可以根据版面需要来安排,一般大型商务网站都有自己的标准尺寸和摆放位置。4.标题栏 此处的标题栏不是指整个网页的标题栏,而是网页内部各版块的标题栏,是各版块内容的概括。标题栏可以是文字加单元格背景,也可以是图片,一般大型网站都采用前者,一些内容少的小网站常采用后者。5.按钮 在现实生活中,按钮通常是启动某些装置或机关的开关。网页中的按钮也沿用了这个概念。网页中的按钮被点击之后,网页会实现相应的操作,比如页面跳转,或数据的传输等。1.1.2组成元素 网页的组成元素有文字、图片、动画(gif、flash)、表单(交互功能
3、)、音频、视频、超链接、表格、框架、导航等。1.2 网页相关知识简介 1.2.1互联网互联网(Internet),又叫因特网,它是目前世界上最大的计算机网络,将无数广域网、局域网及单机按照一定的通讯协议组织在一起,方便了计算机之间的信息传递。1.2.2网页的本质 一个网页由多个文件组成,网页文件是“根”,图像文件都是“枝叶”,图像和动画都以链接的形式插入到网页中。打开网站“搜狐网”,在浏览器中选择“文件”“另存为”菜单,将网页保存到磁盘中,然后看看网页及其组成素材。1.2.3 网站、网页和主页 w网站是多个网页的集合,各个网页通过超级链接构成一个网站整体。w网页就是以html语言为基础编写的,
4、能够通过网络传输,并被浏览器翻译成可以显示出来的包含文字、图片、声音、动画等媒体形式的页面文件。网页由主页和其它链接页组成。w主页也叫首页,是网站的入口,即浏览者登录网站时看见的第一个网页。w根据网页能够在服务器端运行,把网页分为动态网页和静态网页。w静态网页:纯粹用html语言编写的网页,不能在服务器端运行,没有数据库支持,交互性相对较差。每个网页都有一个固定的url,且以htm、html、shtml、xml等常见形式为后缀;发布在服务器上的静态网页是事先保存在服务器上的文件,每个网页都是一个独立的文件;内容相对稳定,容易被搜索引擎检索。动态网页:即采用动态网站技术动态生成的网页,以数据库为
5、基础,能在服务器端运行;可以实现的功能较多,如用户注册、登陆、在线调查、用户管理、订单管理、站内搜索、歌曲下载、软件下载、即时更新新闻、可以留言或书写评论等;不是独立存于服务器上的网页文件,只有当用户请求服务器时才返回一个完整的网页。1.2.4 IP地址与域名 wIP地址用来标识每台主机在互联网上的地址,具有唯一性。它由4个小于256的数字组成,数字之间用点间隔。例如,“61.135.150.126”就是一个IP地址。但是IP地址难以书写和记忆。w域名是用字符来表示主机地址的另一种方法,与IP地址对应,在使用过程中易于记忆和书写。域名也是独一无二的。如:和都是域名。1.2.5 网址 网址又叫U
6、RL,它是一种网络上通用的地址格式,用于标识网页文件在网络中的位置。一个完整的网址由通信协议名称、域名或IP地址、网页在服务器中的路径和文件名4部分组成。1.2.6 网页的布局类型1.网站的类型:门户网站、政府部门形象类网站、企业网站、医院网站、科技网站、教育网站、综合网站等。2.布局相关概念w版面指的是浏览器看到的完整的一个页面。因为每个人的显示器分辨率不同,所以同一个页面的分辨率可能出现800*600像素,1024*768像素等,看到的版面效果也不尽相同。w布局就是以最适合浏览的方式将图片和文字摆放在页面的不同位置。w网页版面布局是指定网页内容在浏览器中的显示方式,例如徽标的位置、导航栏的
7、显示、主要内容的排版等。图1 形结构3.常见的布局样式(1)形结构:如图1所示。(2)口(同、国)字形结构:总体分为上、中、下3部分,中间部分又分为3栏,中间是网页的主内容区,如图2所示。图2 口字形结构(3)T(厂)形结构:顶部通常为标志、横幅广告和站内导航菜单,顶部下面分为左、右2栏结构,通常左右不对称,栏宽的是页面的主题内容,如图3所示。图3T形结构(4)上下形结构:页面划分为上下2部分。可以对称,也可以不对称,如图4所示。图4上下形结构(5)左右形结构:页面划分为左右2部分。可以对称,也可以不对称,如图5所示。图5左右形结构1.2.7网站管理与网页制作相关软件 wFireworks:主
8、要用于制作网页图像、网站标志、GIF动画、图像按钮与导航栏等。wFlash:主要用于制作矢量动画,如广告条、网站片头动画、动画短片、MTV等。wPhotoshop:Adobe公司出品的一个优秀而且强大的图形图像处理软件,起初它的应用领域主要是平面设计而不是网页设计,但是它所具有的强大功能完全涵盖了网页设计的需要(除了多媒体)。在进行网页制作时,除需要Dreamweaver外,还会用到Fireworks、Flash、Photoshop等辅助软件。(DW、FW、Flash称作网页三剑客。)1.2.8 HTML基础(1)HTML语言:HTML是网页的主要组成部分,要想精通网页制作,必须对HTML语言
9、有所了解。HTML语言是利用标记(tag)来描述网页的字体、大小、颜色及页面布局的语言,是一种早期的用于网页制作的主要语言;它也是纯文本类型的语言,可以使用任何的文本编辑器对它进行编辑。使用HTML编写的网页文件是标准的纯文本文件,可以用任何文本编辑器打开它。其后缀名为:.html或.htm。(2)HTML文档的基本结构标题标题正文正文(3)主要标记简介w开始和结束标记。在它们中间,包含网页里的所有内容。w主体:页面内容。主体部分包含文本和图像等网页里所有可见部分。w头部:头部的内容 head是除文档标题外的不可见部分,文档标题出现在浏览器的窗口标题栏中,还可以包括META信息、关键字、说明/
10、描述、刷新、基础网页/首页(申请的域名空间或网址)、链接等;若不需头部信息则可省略此标记。【刷新就是在网址发生变化或网页经常更新时,规定在几秒钟内更新当前网页的内容。】w标题:标题:呈现出网页的标题,文档标题出现在浏览器的窗口标题栏中,包含在 标签内部。以下内容(4)(6)为选学内容。(4)网页中的其他常用标记w:分段标记w:换行标记w:w 是空格标记w 空的标签区块w字体标签w表格标签w文字标签w文本缩进的标签 可以使用这些标记在记事本中完成网页的设计。HEAD部分包含的主要元素 标签 描 述title 文档标题meta 描述HTML元信息link 描述当前文档与其它文档之间的链接
11、关系script 脚本程序内容style 指定当前文档的CSS层叠样式表(5)Html的重要标签和属性 头部标签HEAD部分包含的主要元素 标签 描 述title 文档标题meta 描述HTML元信息link 描述当前文档与其它文档之间的链接关系script 脚本程序内容style 指定当前文档的CSS层叠样式表HEAD部分包含的主要元素 标签 描 述title 文档标题meta 描述HTML元信息link 描述当前文档与其它文档之间的链接关系script 脚本程序内容style 指定当前文档的CSS层叠样式表HEAD部分包含的主要元素 标签 描 述title 文档标题meta 描述HTML元
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- dw 网页 设计 基础
1、咨信平台为文档C2C交易模式,即用户上传的文档直接被用户下载,收益归上传人(含作者)所有;本站仅是提供信息存储空间和展示预览,仅对用户上传内容的表现方式做保护处理,对上载内容不做任何修改或编辑。所展示的作品文档包括内容和图片全部来源于网络用户和作者上传投稿,我们不确定上传用户享有完全著作权,根据《信息网络传播权保护条例》,如果侵犯了您的版权、权益或隐私,请联系我们,核实后会尽快下架及时删除,并可随时和客服了解处理情况,尊重保护知识产权我们共同努力。
2、文档的总页数、文档格式和文档大小以系统显示为准(内容中显示的页数不一定正确),网站客服只以系统显示的页数、文件格式、文档大小作为仲裁依据,平台无法对文档的真实性、完整性、权威性、准确性、专业性及其观点立场做任何保证或承诺,下载前须认真查看,确认无误后再购买,务必慎重购买;若有违法违纪将进行移交司法处理,若涉侵权平台将进行基本处罚并下架。
3、本站所有内容均由用户上传,付费前请自行鉴别,如您付费,意味着您已接受本站规则且自行承担风险,本站不进行额外附加服务,虚拟产品一经售出概不退款(未进行购买下载可退充值款),文档一经付费(服务费)、不意味着购买了该文档的版权,仅供个人/单位学习、研究之用,不得用于商业用途,未经授权,严禁复制、发行、汇编、翻译或者网络传播等,侵权必究。
4、如你看到网页展示的文档有www.zixin.com.cn水印,是因预览和防盗链等技术需要对页面进行转换压缩成图而已,我们并不对上传的文档进行任何编辑或修改,文档下载后都不会有水印标识(原文档上传前个别存留的除外),下载后原文更清晰;试题试卷类文档,如果标题没有明确说明有答案则都视为没有答案,请知晓;PPT和DOC文档可被视为“模板”,允许上传人保留章节、目录结构的情况下删减部份的内容;PDF文档不管是原文档转换或图片扫描而得,本站不作要求视为允许,下载前自行私信或留言给上传者【胜****】。
5、本文档所展示的图片、画像、字体、音乐的版权可能需版权方额外授权,请谨慎使用;网站提供的党政主题相关内容(国旗、国徽、党徽--等)目的在于配合国家政策宣传,仅限个人学习分享使用,禁止用于任何广告和商用目的。
6、文档遇到问题,请及时私信或留言给本站上传会员【胜****】,需本站解决可联系【 微信客服】、【 QQ客服】,若有其他问题请点击或扫码反馈【 服务填表】;文档侵犯商业秘密、侵犯著作权、侵犯人身权等,请点击“【 版权申诉】”(推荐),意见反馈和侵权处理邮箱:1219186828@qq.com;也可以拔打客服电话:4008-655-100;投诉/维权电话:4009-655-100。