新媒体理论与技术（第四章）网页设计原理.pptVIP

? XXXXXXXXXXXXXXXXXX 第二节 网页设计工具分析与选择 二、编程型 理论上，所有的通用程序设计语言均可用来编写网页；而实际上，用编程方法制作网页，要采用CGI(公共网关界面)以及Java。非专业人员要掌握它们尚有一定难度。 ? XXXXXXXXXXXXXXXXXX 第二节 网页设计工具分析与选择 三、“所见即所得”型 所谓“所见即所得”(What you see is what you get，WYSIWYG)，是指创建中的文件在编辑过程中的显示与文档最终在浏览器中的显示是一样的。“所见即所得”即可视化(visual)制作工具的成功开发，是网页制作技术发展中的重大进展。 ? XXXXXXXXXXXXXXXXXX 第二节 网页设计工具分析与选择 四、混合型网页制作工具 “所见即所得”编辑器虽然比HTML标记编辑器使用简便，但却不如HTML标记编辑器所能做的多。理想的网页制作工具应该是两者兼而有之的混合型制作工具。新一代的网页制作工具“织梦者”(Dreamweaver)就是其中的代表。 ? XXXXXXXXXXXXXXXXXX 第二节 网页设计工具分析与选择 五、图形工具 （一）通用图形工具 （二）专用图形工具 （三）自带图形工具 * * * * * * * 网页设计原理 第4章 本章目录 第1节 第2节 网页设计原则与注意事项 网页设计工具分析与选择 第3节 动画制作知识 ? XXXXXXXXXXXXXXXXXX 第一节 网页设计原则与注意事项 一、网站的结构模型 构建网站之前，制作者首先要明确选择结构模型。目前常用的结构模型有以下三种。 ? XXXXXXXXXXXXXXXXXX 第一节 网页设计原则与注意事项 一、网站的结构模型 （一）层次树 层次树描述的是这样的结构：整个站点有一个“树根”(也就是主页)，在主页中列出整棵“树”的“主干”，建立站点的主要超链接，在每个网页中又有次一级的“树枝”。主页里设立若干主要栏目，每个栏目里的信息再分成一些子栏目，以此类推。用导航系统将所有内容组成一棵由主页出发的“树”，用户的浏览过程是沿着“树”上下流动的过程(见图4-1)。 图4-1 层次树模型 ? XXXXXXXXXXXXXXXXXX 第一节 网页设计原则与注意事项 一、网站的结构模型 （二）线性 所有页面具有同等的地位，用户的浏览过程是从一个页面到另一个页面的水平流动。 （三）网状结构 网状结构有一个中心的网页，称为主页，在主页中又有各个网页的超链接。进入每个网页，都可以找到其他网页的超链接。依托这种结构可以设计丰富多彩的站点。这种结构下，页面之间没有明显的结构，而是据内在的逻辑关系而存在(见图4—2)。网状结构是目前最常用的模型。 图4-2 网状结构模型 ? XXXXXXXXXXXXXXXXXX 第一节 网页设计原则与注意事项 二、网页的布局形式 在网页设计中，需要对网页进行划分与布局，使每部分发挥其各自的功能。 ? XXXXXXXXXXXXXXXXXX 第一节 网页设计原则与注意事项 二、网页的布局形式 （一）“T”结构布局 图4-3“T”形版式案例 资料来源： 图4-4 2013年usnews版式，继续坚持“T”形版式 资料来源： ? XXXXXXXXXXXXXXXXXX 第一节 网页设计原则与注意事项 二、网页的布局形式 （二）“口”形布局(亦称“门”形布局) 图4-5“口”(“门”)形版式案例 资料来源：. 图4-6 2013年新浪网版式，向“T”形版式靠拢 资料来源：. ? XXXXXXXXXXXXXXXXXX 第一节 网页设计原则与注意事项 二、网页的布局形式 （三）对称对比布局 顾名思义，这种网页采取左右或者上下对称的布局，一半深色，一半浅色，一般用于设计型站点。其优点是视觉冲击力强，缺点是将两部分有机地结合比较困难。 ? XXXXXXXXXXXXXXXXXX 第一节 网页设计原则与注意事项 二、网页的布局形式 （四）POP布局 图4-7 POP布局案例 资料来源： 图4-8 2013年榕树下网站放弃了坚持很久的POP布局 资料来源： ? XXXXXXXXXXXXXXXXXX 第一节 网页设计原则与注意事项 二、网页的布局形式 （五）自由版式 图4-7 自由版式案例：星空卫视网站 图4-8 2013年星空卫视网站版式，继续坚持自由版式 ? XXXXXXXXXXXXXXXXXX 第一节 网页设计原则与注意事项 三、文字与图像的使用 （一）文字 语言作为信息最重要的传播方式在网页中具体表现为文字的处理。文字和图形的大小比例相当悬殊，在网页中哪怕是整篇的文章也不过几十KB，所以在浏览网页时速度相当快。在当今的网站中，新闻、政府、信息交流等站点的