大学计算机基础-第5章.ppt

大学计算机基础,主讲人联系方式,武汉科技大学城市学院,第5章 网页设计,通过本章的学习，您将会掌握以下知识5.1 网页制作的语言和工具5.2 网页制作步骤5.3 网页中的文本和超链接5.4 网页中的图像和多媒体5.5 表单的制作5.6 网页版面设计5.7 网页的特效制作5.8 站点发布与管理,武汉科技大学城市学院,5.1.1 网页制作语言,HTML(Hyper Text Maker Language)是一种超文本标记语言，用来描述WWW上的超文本文件。,武汉科技大学城市学院,HTML文本的基本结构,武汉科技大学城市学院,HTML文本的基本结构,武汉科技大学城市学院,5.1.2 网页制作工具之一,武汉科技大学城市学院,网站与网页,万维网(WWW)上用浏览器观看的每个屏幕页面都是“网页”；网站是能够被人用浏览器访问并包含组织好的一组网页，也称为“站点”；网站一般由硬件和软件两部分组成，我们教材中主要讨论这“组织好的一组网页”的软件部分；例如：“google.htm”是网页加上”google.files”才是完整的；演示无”google.files”打开网页的情况；,武汉科技大学城市学院,网站与网页,网站需要服务器驱动，网页则只需要服务器空间。网站支持邮件服务器，网页无法提供该功能。综上所述网站是以数据为核心，以服务器为基础的浏览者-管理员-系统管理员相互关联、相互促进、有机制约的信息化整体。网页则是静态页面各自为政，仅仅提供链接的HTML文件。,武汉科技大学城市学院,网站的制作流程,武汉科技大学城市学院,网页内容及版面布局的设计,武汉科技大学城市学院,网页内容的设计,HTML文件名：index.htm网页名称：网页的设计和制作网页背景：带有纹理的灰色大理石网页上有文字：计算机应用基础课程展示自己的风采、显示自己的能力上面两句话之间插入一张恰当的图形滚动的字幕内容：自己制作网页超级勾链文字：“HTML和网页的关系”勾链到另一网页：html和网页.htm超级勾链文字：“网页的设计和制作”勾链到另一网页：设计和制作.htm超级勾链文字：“个人网页的发布”勾链到另一网页：网页发布.htm”,武汉科技大学城市学院,布局注意的原则,页面布局的平衡，不要太挤也不要太空；页面色彩的平衡，重点突出，不要太单调，也不要太花里胡哨；页面不宜过长，不便于观察；选用的图像内容要恰当，应该有助于内容的展开；适当使用动画可以增加网页页面的美观和生动；等等,武汉科技大学城市学院,收集素材,网上下载一些材料，特别是适用的图片或者从一些光盘的资料库、图片库中挑选，在本例中：背景采用文件bg.gif；动画采用文件0861.gif；为了使文字比较美观，采用艺术字表现文字可以预先在Word软件或PowerPoint软件中制作好，以备使用艺术字被粘贴到网页中将变成一张图片素材选用的内容在网页制作过程中可以不断改变，以期达到最好的效果。,武汉科技大学城市学院,背景用的bg.jpg,动画用的0861.gif,用艺术字写的标题文字,用艺术字写的左右用文字,收集素材,武汉科技大学城市学院,注意事项,一般来说这些素材所涉及的文件应该放在同一个子目录以及它的下级子目录中便于调用和管理便于该网页的浏览便于向Web Server上传发布,武汉科技大学城市学院,5.3 网页中的文本格式与超链接,文本的输入;关于软回车和硬回车文本的粘贴;超连接的类型:内部链接：同一站点内不同页面之间的超级链接;外部链接：当前页面链接到Internet上其他站点;书签（锚点）链接：链接到该网页自身某个特定位置;热区的制作和链接;链接路径：网址或本地链接的文件夹或文件名。,武汉科技大学城市学院,添加文本,创建文本插入特殊文本元素换行符、水平线、特殊符号、段落缩进空格和注释编辑文本 添加项目列表和编号列表,武汉科技大学城市学院,5.3.2 字符格式标记,1、设置字体2、添加字体3、设置大小,4、设置颜色5、设置样式6、段落格式,武汉科技大学城市学院,2、添加字体的过程,武汉科技大学城市学院,5.4网页中的图像与多媒体,5.4.1 在网页中插入图像5.4.2 为图像增加替代文本5.4.3 图像处理5.4.4 插入网页背景图5.4.5 在网页中加入多媒体,武汉科技大学城市学院,网页布局的原则,醒目性：指用户把注意力集中到网页的内容创造性：有鲜明个性，有新的创意造型性：维持整体外型上的稳定感和均衡性明快性：指准确、快速转达网站的构成内容可读性：指网页的内容让人明了归结为统一、协调、流动、强调、均衡。,武汉科技大学城市学院,谢,谢,！,