网页设计与制作 教学课件 作者 李广武张逸昀梁平 主编 第1章 网页设计基础.pptVIP

尚辅网 尚辅网 尚辅网 第1章 网页设计基础知识 尚辅网 第1章 网页设计基础知识 1.1 什么是网页 1.2 网页的设计原则 1.3 网站的主题风格 1.4 本章小结 通过本章的学习，用户将了解到关于网页和网站的基础知识、掌握Dreamweaver CS5的基本知识和界面构成等内容。为后续的章节的学习做好铺垫工作。 尚辅网 网页是一种可以在WWW上传输，并被浏览器识别、翻译并能显示的特殊文件。一般我们常用到的网页文件是HTML文件，HTML是“Hypertext Markup Language”的缩写，可翻译为“超文本标记语言”。“超文本”就是页面内除文本外，还可以包含图片、链接、音频甚至视频等非文字的组成部分。 。 1.1.1 网页的基本介绍 1.1 什么是网页 尚辅网 1、文字 文字是网页中的主要内容，一个网页向外界传递信息，介绍网站的内容，主要通过文字来实现。 2、图片 一个比较成功的网页，文字信息固然不可少，但是加入图片后能使网页更为增色。 3、多媒体 所谓多媒体,主要是指文字、图形、图像、声音、动画等人的器官能直接感受到和理解的多种信息类型。 4、超链接 超链接，通过已定义好的关键字和图形，由当前页的标题或内容索引信息指向别的页面的连接点。 1.1.2 网页的组成 1.1什么是网页 尚辅网 网页观众使用什么平台？ 虽然网页是不分平台的，但不同平台间还是会有些差异的，这些差异通常不是网页本身，而是来自于系统间的差异，如系统颜色、字体等等，因此先分清楚网络观众使用的电脑是PC还是Macintosh?还是两者皆有？考虑到不同的平台，然后设计一个适合网页观众的网站。 网页观众以什么方式上网？ 作为网页设计者，你可能有一个很棒的上网环境，不过你的网页观众就不一定了，我们可以根据大多数网络观众的上网环境，决定网页设计时可以使用多少数量的图片，或是在网页中多使用文字，当然，也可以决定选择很占资源的声音、音乐、影片等等，还可以使用让网页内容更丰富的多媒体组件。 1.2 网页的设计原则 尚辅网 网页观众可能采用什么浏览器版本？ 如果你使用一些比较新的网页技术，像CSS等。那么有些低版本浏览器的用户，在使用时可能会受到影响，无法达到预期的效果。 网页观众可能使用的屏幕尺寸与显示分辨率？ 身为一个专业的设计者，你可能会有一个非常专业的屏幕，然而大多数的网页观众则并非这样，因此你的设计应该符合网页观众的显示分辨率，设计出适合大多数网络观众浏览的网页。 网页观众需要什么内容？ 这里涉及你的网站内容了，在你了解你的网页观众之前，综合你的网站目标，你可以开始编辑你想要提供给网页观众的各项内容，只要有一个轮廓架构就可以了，将其罗列出来，这个阶段会影响到整个网站的结构，因此非常重要。 1.2网页的设计原则 尚辅网 1、页面整体色调 网站给人的第一印象来自视觉冲击，不同的色彩搭配产生不同的效果，并可能影响到访问者的情绪。 “标准色彩”是指能体现网站形象和延伸内涵的色彩，要用于网站的标志，标题，主菜单和主色块。给人以整体统一的感觉。至于其它色彩也可以使用，但应当只是作为点缀和衬托，绝不能喧宾夺主。一般来说，一个网站的标准色彩不超过3种，太多则让人眼花缭乱。 1.3 网站的主体风格 尚辅网 2. 目录结构与链接结构 一般建议站点采用如下的方式建立目录结构。 （1）按栏目内容建立子目录： 子目录的建立，首先按主栏目建立。例如：假设站点有一些栏目，内容较多并需要经常更新，所以可以建立独立的子目录。而一些相关性强，不需要经常更新的栏目，可以合并放在一个统一目录下。所有程序一般都存放在特定目录，例如：ASP程序放在ASP目录，便于维护管理。 （2）在每个主目录下都建立独立的Images目录： 一般来说，一个站点根目录下都有一个默认地Images目录。将所有图片都存放在这个目录里很是不方便，比如在栏目删除时，图片的管理相当麻烦。所以为每个主栏目建立一个独立的Images目录是方便管理的。 1.3网站的主体风格 尚辅网 3、链接结构 常用的链接结构有： （1） 树状链接结构（一对一） 这类似DOS的目录结构，首页链接指向一级页面，一级页面链接指向二级页面。这样的链接结构浏览时，一层一层进入，一层一层退出，条理比较清晰，访问者明确知道自己在什么位置，不会“不知身在何处”，但浏览效率低，一个栏目下的子页面到另一个栏目下的子页面，须先回