第1章网页设计基础

《第1章网页设计基础》由会员上传分享，免费在线阅读，更多相关内容在行业资料-天天文库。

1、主讲：周改云Dreamweaver8.0网页设计与制作内容要点：1.Dreamweaver的课程定位（重点）2.网页设计理念3.网页的结构、组成和网页的类型（重点）４.Internet基础知识和网页开发工具（难点）５.网站的开发流程（重点）６.典型网站分析第1章　网页设计基础1.Dreamweaver的课程定位什么是网页？（1）网页就是以html语言为基础编写的，能够通过网络传输，并被浏览器翻译成可以显示出来的包含文字、图片、声音、动画等媒体形式的页面文件。网页由主页和其它链接页组成。（2）主页：也叫首页，打开一个网站时

2、，在屏幕上显示的第一个综合界面，它相当于网站的目录或封面，集成了指向下一级网页或进入其它网站的链接，用户进入主页就可以浏览到网站的重要信息，通过单击链接就可以进入到其它网页。主页的名称一般为index.html或default.html,index.asp或default.asp。什么是网站？网站：一组具有共同属性（相关主题、类似的设计或共同目的）的链接文档和资源。平时所说的yahoo、sohu等都是网站。主要是通过超级链接的形式将若干网页组织在一起，形成一个逻辑上的整体，网页包含在网站中。一个网站中的网页数>=1。根据

3、网页能否在服务器端运行，把网页分为静态和动态两种。补充：服务器是专指某些高性能计算机，安装不同的服务软件，能够通过网络，对外提供服务(如数据、文件的共享等)；作为网络的节点，存储、处理网络上80％的数据、信息。客户机：用于访问服务器资料的计算机。静态网页：纯粹用html语言编写的网页，不能在服务器端运行。其特点有：（参看p290）1、每个网页都有一个固定的url，且以htm、html、shtml、xml等常见形式为后缀。2、发布在服务器上的静态网页是保存在服务器上的文件，每个网页都是一个独立的文件。内容相对稳定，容易被搜

4、索引擎检索。3、没有数据库支持，制作和维护需要的工作量较大。4、交互性相对较差。动态网页：即采用动态网站技术动态生成的网页，能在服务器端运行，其特点有：1、以数据库为基础2、可以实现的功能较多，如用户注册、登陆、在线调查、用户管理、订单管理、站内搜索、歌曲下载、软件下载、即时更新新闻、可以留言或书写评论等。3、不是独立存于服务器上的网页文件，只有当用户请求服务器时才返回一个完整的网页。Dreamweaver可以做什么？做静态网页。Dreamweaver作为专业的网页制作工具，主要完成两大工作。一是制作网页，二是管理网站。

5、利用网站管理功能使网页开发人员能够非常轻松的管理网站，并能保证在多人对网站进行维护时不会产生冲突，通过“登记/注销”系统可对站点内的文件的状态进行管理，避免了多人同时修改同一文件的可能性，保证了合作开发的安全、正常进行。若要完成一个带有数据库的动态网站的制作，需要具备以下知识ASP.NetAccessDreamweaver不容忽视的下载速度合理的版面布局网页内容要精彩精美的网站标志注重色彩搭配网页内容便于浏览能适应不同浏览器及分辨率简约、美观2.网页设计理念2.1网页中的平衡、对比和连贯平衡如果你的页面是平衡的，当用户浏

6、览这个页面的时候就会感觉它们是一个整体，浏览时候目光的跳转也会很自然。对称平衡非对称平衡辐射平衡实战平衡通过一个LOGO设计实例观察平衡的多种变化这是初稿判断其是否平衡的方法用色块代替LOGO中的元素对比如果说平衡搭起了一个稳定的页面框架，那么对比就是这个框架中的动态点缀。动态的因素包括：大小、颜色、字体、重心、形状、纹理等等底版字体、大小、颜色都一样，单调枯燥通过变化字体的大小来形成对比将字体大小对比和颜色对比结合起来使用连贯对比会给页面带来活力，然而如果对比太多，页面就会显得零乱，因此在一个成功的页面设计中，有很多要

7、素是必须保持一致的，这就是“连贯”。这些要素通常包括：布局页面的上下、左右，页面与页面中间要保持布局一致字体字体的大小、颜色应当基本保持一致导航栏导航栏应当保持完全一样，通常应单独为导航栏建立一个框架页，这样就可以保证更新导航栏的时候，所有网页都会被自动更新。显然，连贯和上面说的对比是彼此矛盾，因此在进行网页设计时必须把握好度这是一个名片设计字体风格相似、颜色不繁杂2.2网页中的色彩搭配（教材p352）：总体要求过渡自然色彩的三要素色相：色彩的相貌，是区分色彩种类的名称，知识纯粹的表示色彩相貌的差异，这种差异由光波的波长

8、决定。明度：色彩的强度，只色彩的明暗度。纯度：色彩的饱和度，即颜色的深浅程度或浓淡程度。色彩心理与网页表现（p９-１０）不同的颜色有着不同的含义，给人各种丰富的感觉和联想。记住常用纯色的十六进制代码。#ff0000为红色，#00000为黑色，#ffffff为白色#0000ff为蓝色，#00ff00为绿色红色：热情、奔