《《网页设计基础》PPT课件.ppt》由会员分享，可在线阅读，更多相关《《网页设计基础》PPT课件.ppt（24页珍藏版）》请在taowenge.com淘文阁网|工程机械CAD图纸|机械工程制图|CAD装配图下载|SolidWorks_CaTia_CAD_UG_PROE_设计图分享下载上搜索。
1、第 1 章 网网页设计基基础 1.1 网页中的常见元素网页中的常见元素1.2 常用网页制作工具常用网页制作工具 1.3 常用的网页美化工具常用的网页美化工具 1.4 建立网站的基本流程建立网站的基本流程 1.5 网网 页页 艺艺 术术 设设 计计 1.1 网页中的常见元素网页中的常见元素 1.1.1 文本文本文本是最重要的信息载体与交流工具，文本是最重要的信息载体与交流工具，是网页发布信息所用的主要形式。是网页发布信息所用的主要形式。1标题标题2字号字号3字型字型 1.1.2 图形图形这里的图形概念是广义的，它可这里的图形概念是广义的，它可以是普通的绘制图形，可以是各种图以是普通的绘制图形，可
2、以是各种图像，还可以是动画。像，还可以是动画。1菜单按钮菜单按钮2背景图形背景图形3动画动画1.1.3 超链接超链接超链接是从一个网页指向另一个目的超链接是从一个网页指向另一个目的端的链接，这个目的端通常是另一个网页，端的链接，这个目的端通常是另一个网页，也可以是一幅图片、一个电子邮件地址、也可以是一幅图片、一个电子邮件地址、一个文件、一个程序或者相同网页的不同一个文件、一个程序或者相同网页的不同位置。位置。超链接是网页中一种非常重要的功能，超链接是网页中一种非常重要的功能，是网页中最重要、最根本的元素之一。是网页中最重要、最根本的元素之一。1.1.4 表格表格表格用来控制网页中信息的布局方式
3、。表格用来控制网页中信息的布局方式。1.1.5 表单网页区别于其他媒体的一个重要标志网页区别于其他媒体的一个重要标志就是它的交互功能。就是它的交互功能。通常网页的交互功能都是利用表单来通常网页的交互功能都是利用表单来实现的。实现的。1.1.6 声音和视频声音和视频声音是多媒体网页的一个重要组成部分。声音是多媒体网页的一个重要组成部分。网页的声音文件格式很多，常用的有网页的声音文件格式很多，常用的有MIDI、WAV、MP3和和AIF等。等。1.2 常用网页制作工具常用网页制作工具 1.2.1 超文本标识语言超文本标识语言超文本标识语言（超文本标识语言（Hypertext Markup Langu
4、age，HTML）是一种专门用于）是一种专门用于Web页制作的编程语言，它能够对网页内容、页制作的编程语言，它能够对网页内容、页面的格式以及超链接进行描述，形成页面的格式以及超链接进行描述，形成HTML文档。文档。1.2.2 DreamweaverDreamweaver是是Macromedia公司推公司推出的一款大众化的网页制作软件，它具有出的一款大众化的网页制作软件，它具有可视化编辑界面，用户不必编写复杂的可视化编辑界面，用户不必编写复杂的HTML源代码就可以生成跨平台、跨浏览源代码就可以生成跨平台、跨浏览器的网页，不仅适合于专业网页编辑人员器的网页，不仅适合于专业网页编辑人员的需要，同时也
5、容易被业余网页制作人员的需要，同时也容易被业余网页制作人员所掌握。所掌握。Dreamweaver支持动态支持动态HTML技术，技术，并采用了并采用了Roundtrip HTML技术，从而奠技术，从而奠定了在网页高级设计功能方面的领先地位。定了在网页高级设计功能方面的领先地位。1.2.3 FrontPageFrontPage是是Microsoft公司推出的网公司推出的网页制作工具。页制作工具。1.3 常用的网页美化工具常用的网页美化工具 1.3.1 FireworksFireworks是由是由Macromedia公司开发公司开发的基于的基于RGB颜色模式的图形处理工具，它颜色模式的图形处理工具，
6、它的出现使的出现使Web作图发生了革命性的变化。作图发生了革命性的变化。Fireworks具有如下的优点。具有如下的优点。（1）Fireworks可以用较少的步骤生成占可以用较少的步骤生成占用空间很小、质量很高的用空间很小、质量很高的JPEG和和GIF图像图像。（2）利用）利用Fireworks修改图像非常方便。修改图像非常方便。（3）Fireworks无需借助其他工具就可以无需借助其他工具就可以完成将一个图像转化为网页元素的全过程。完成将一个图像转化为网页元素的全过程。（4）Fireworks具有文件导出功能。具有文件导出功能。1.3.2 FlashFlash是是Macromedia公司开发
7、的用于矢公司开发的用于矢量图形编辑和动画创作的专业软件，它是一量图形编辑和动画创作的专业软件，它是一种交互式动画设计工具，用它可以将音乐、种交互式动画设计工具，用它可以将音乐、声效、动画以及富有新意的界面融合在一起，声效、动画以及富有新意的界面融合在一起，以制作出高品质的网页动态效果。以制作出高品质的网页动态效果。Flash的优点可以归纳为以下几点。的优点可以归纳为以下几点。（1）Flash创建的图像体积小、质量高。创建的图像体积小、质量高。（2）Flash采用的是插件工作方式。采用的是插件工作方式。（3）Flash采用采用“流式流式”动画播放技术。动画播放技术。（4）Flash支持多种不同格
8、式文件的导入。支持多种不同格式文件的导入。1.3.3 PhotoshopPhotoshop是是Adobe公司开发的图形处公司开发的图形处理软件，它是目前公认的理软件，它是目前公认的PC上最好的通用上最好的通用平面美术设计软件，它功能完善、性能稳平面美术设计软件，它功能完善、性能稳定和使用方便，所以在几乎所有的广告、定和使用方便，所以在几乎所有的广告、出版和软件公司，出版和软件公司，Photoshop都是首选的平都是首选的平面制作工具。面制作工具。1.4 建立网站的基本流程建立网站的基本流程 图图1-2所示的是一个网站的完整制作流程。所示的是一个网站的完整制作流程。图1-2 网站的制作流程 1.
9、4.1 确定主题网站的主题也就是网站的题材，是网网站的主题也就是网站的题材，是网站设计首先遇到的问题。站设计首先遇到的问题。网站的定位要小，内容要精。网站的定位要小，内容要精。网站的题材最好选自己擅长或者喜爱网站的题材最好选自己擅长或者喜爱的内容。的内容。网站名称，是网站设计的一部分，而网站名称，是网站设计的一部分，而且是一个关键的要素，和现实生活中一样，且是一个关键的要素，和现实生活中一样，网站名称是否正气、响亮、易记，这对网网站名称是否正气、响亮、易记，这对网站的形象和宣传推广也有很大影响。站的形象和宣传推广也有很大影响。1.4.2 搜集资料搜集资料1.4.3 网站的整体规划网站的整体规划
10、进行网站的整体规划也就是组织网站进行网站的整体规划也就是组织网站的内容并设计其结构。的内容并设计其结构。1.4.4 网页设计与制作网页设计与制作1静态网页的设计与制作静态网页的设计与制作2为网页添加动态效果为网页添加动态效果1.4.5 测试与发布网页测试与发布网页当当网网页页设设计计人人员员制制作作完完所所有有网网站站页页面面之之后后，需需要要对对所所设设计计的的网网页页进进行行审审查查和和测测试试，测测试试内内容容包包括括功功能能性性测测试试和和完完整整性性测测试两个方面。试两个方面。所所谓谓功功能能性性测测试试就就是是要要保保证证网网页页的的可可用用性性，达达到到最最初初的的组组织织设设计
11、计目目标标，实实现现所所规规定定的的功功能能，读读者者可可以以方方便便快快速速地地寻寻找找到到所需的内容。所需的内容。网页的完整性测试就是保证页面内容网页的完整性测试就是保证页面内容显示正确，链接准确，无差错无遗漏。显示正确，链接准确，无差错无遗漏。1.4.6 网站的宣传与推广网站的宣传与推广1.4.7 网站的反馈与评价网站的反馈与评价1.4.8 网站的更新与维护网站的更新与维护网站要注意经常维护更新内容，网站要注意经常维护更新内容，保持内容的新鲜保持内容的新鲜。1.5 网网 页页 艺艺 术术 设设 计计 1.5.1 网页版式设计1版式设计原则版式设计原则（1）统一）统一（2）平衡）平衡（3）连贯和呼应）连贯和呼应（4）分割）分割（5）对比）对比（6）和谐）和谐2版式设计技巧版式设计技巧3常见的网页布局常见的网页布局（1）表格布局）表格布局（2）框架布局）框架布局（3）层布局）层布局（4）自由式布局）自由式布局1.5.2 网页色彩设计网页色彩设计1网页色彩定义网页色彩定义在网页中是以在网页中是以RGB方式来表示颜色的方式来表示颜色的。2在网页中合理运用色彩在网页中合理运用色彩