网页设计基础、设置文本详解.ppt

授课教师：黄彩霞 E-MAIL：906037985@ 第1章 网页设计理论 1.1 网页的来源与本质 上网演示 1.1 网页的来源与本质 最早的网页 /Historyhypertext/hypertext/www/ theproject.html 1.1 网页的来源与本质 网页（Web Page），顾名思义就是网站中的页面。 网页的本质就是用HTML(超文本标记语言)语言来表述的文档，与传统的记事本文本或Word文本相比，网页文本最大的区别在于加入了超链接的应用，同时阅读网页还需要浏览器支持。 互联网上传输和通信需要相应的协议支持，网页文本传输和通信所遵守的协议是超文本传输协议，即HTTP协议。 1.2 网页的组成元素 网页元素有：文字、图片、动画、声音、视频等元素； 一个网页实际上不是由单独文件组成，往往有多个文 件组成； 网页中显示的图片、动画、声音等文件都是单独存放的； 网页通常成组出现，并且这组网页之间通过超链接相互组织成为反映某个主题的网站。 1.3 网页的尺寸 像素（Pixel，简写为px），是一种用来计算图形尺寸的单位。当图片的尺寸以像素为单位时，需要指定其固定的分辨率，才能将图片尺寸与现实中的实际尺寸相转换。 大多数网页在制作时，图片分辨率常为72px，即每英寸像素为72个。1英寸等于2.54厘米，1厘米等于28px，比如15cm×15cm的图片，相当于420×420px。像素也是网页设计中的标准长度单位。 1.3 网页的尺寸 对于IPAD移动设备，网页宽度一般设置为768px，页面高度视版面和内容决定。 对于手机，网页宽度一般设置为480px，页面高度视版面和内容决定。 对于电脑，网页宽度一般设置在1002px以内，这样就不会出现水平滚动条，高度同样视版面和内容决定。 1.4 网页的布局 网页布局的方式有两种：一种是自适应布局又叫流动性布局，另外一种是固定布局。 网页布局的技术实现有两种常用的方法：表格布局和DIV+CSS布局。 1.5 网页的色彩 网页中的色彩分为无彩色系和有彩色系，一般把黑、白以及黑白相间的灰阶色称为无彩色系，除此之外的颜色称之为彩色系。 网页色彩中有一个非常重要的概念就是色环，将色彩分为三大色系，依次为红（Red）、绿（Green）、蓝（Blue），也称三原色。 计算机采用“#”符号加上6位十六进制代码来表示不同颜色，例如：#02d234。 1.5 网页的色彩 网页安全色是各种浏览器各种机器都可以无损失无偏差输出的色彩集合。 00、33、66、99、CC 或 FF （RGB 值分别为 0、51、102、153、204 和 255）十六进制值组合的颜色都代表网页安全色。 在设计网络作品的时候尽量使用网页安全色，这样不会让观看的人看到的效果与你制作时相差太多。否则一旦你的色彩文件与观看者不同可能会出现偏色很严重的情况。 1.5 网页的色彩 常用的色彩搭配方法有单色搭配、类比色搭配、补色搭配、分离补色搭配、原色搭配、二次色搭配、全色相搭配等。 1.5 网页的色彩 色彩和风格 1.5 网页的色彩 在色彩上二种颜色的衔接有些生硬，所以需要使用灰色进行中和，这样颜色过渡得更自然、使整个画面和谐统一。 1.6 网页设计与开发过程 简单来说，网站开发的全过程大致可为策划与定义、设计、开发、测试和发布5个阶段。 1.6 网页设计与开发过程 网页的基本概念 www（World Wide Web)万维网：是一种建立在Internet上的、全球的、交互的、多平台的、分布式的信息资源系统； 什么是“服务器”与“浏览器” 网页的基本概念 做好的网站需要上传到远程服务器上（用FTP工具文件传输），并申请对应的域名，才能被浏览器浏览。 第2章 HTML语言 2.1 网页与HTML 网页文件是用一种被称为HTML的标记语言书写的文本文件； HTML（Hypertext Markup Language）超文本标记语言是一种专门用于网页制作的描述性 的标记语言； HTML的发展经历了如下很多版本。 （1）HTML 2.0：1995年11月发布，于2000年6月之后被淘汰。 （2）HTML 3.2：1996年1月14日发布，W3C推荐标准。 （3）HTML 4.0：1997年12月18日发布，W3C推荐标准。 （4）XHTML 1.0：2000年1月26日发布，W3C推荐标准，2002年8月1日修订后发布。 （5）XHTML 2.0：W3C工作草案，因为改动过大，学习这个新技术的成本过高，现在最常用的还是XHTML1.0的标准。 （6）HTML 5：2008年，W3C取消了对XHTML的开发，将HTML5规范纳入W3C的框架中。