1.1  静态网页和动态网页的区别国内优秀网页界面赏析
网页一般又称HTML文件，是一种可以在WWW上传输、能被浏览器认识和翻译成页面并显示出来的文件。文字与图片是构成一个网页的两个最基本的元素，除此之外，网页的元素还包括动画、音乐、程序等。网页是构成网站的基本元素，是承载各种网站应用的平台。通常看到的网页，大都是以HTM或HTML后缀结尾的文件。除此之外，网页文件还有以CGI、ASP、PHP和JSP后缀结尾的。目前网页根据生成方式，大致可以分为静态网页和动态网页两种。
1.1.1  静态网页
静态网页是网站建设初期经常采用的一种形式。网站建设者把内容设计成静态网页，访问者只能被动地浏览网站建设者提供的网页内容。其特点如下。
●网页内容不会发生变化，除非网页设计者修改了网页的内容。
●不能实现和浏览网页的用户之间的交互。信息流向是单向的，即从服务器到浏览器。服务器不能根据用户的选择调整返回给用户的内容。静态网页的浏览过程如图1-1所示。
图1-1  静态网页的浏览过程
1.1.2  动态网页
网络技术日新月异，许多网页文件扩展名不再只是.htm，还有.php、.asp等，这些都是采用动态网页技术制作出来的。动态网页其实就是建立在B/S架构上的服务器端脚本程序。在浏览器端显示的网页是服务器端程序运行的结果。
静态网页与动态网页的区别在于Web服务器对它们的处理方式不同。当Web服务器接收到对静态网页的请求时，服务器直接将该页发送给客户浏览器，不进行任何处理。如果接收到对动态网页的请求，则从Web服务器中到该文件，并将它传递给一个称为应用程序服务器的特殊软件扩展，由它负责解释和执行网页，将执行后的结果传递给客户浏览器。如图1-2所示为动态网页的工作原理图。
动态网页的一般特点如下。
●动态网页以数据库技术为基础，可以大大降低网站维护的工作量。
●采用动态网页技术的网站可以实现更多的功能，如用户注册、用户登录、搜索查询、用户管理、订单管理等。
●动态网页并不是独立存在于服务器上的网页文件，只有当用户请求时服务器才返回一个完整的网页。
●搜索引擎一般不可能从一个网站的数据库中访问全部网页，因此采用动态网页的网站在进行搜索引擎推广时需要做一定的技术处理才能适应搜索引擎的要求。
图1-2  动态网页的工作原理图
1.2  网站的前期规划
建设网站之前就应该有一个整体的战略规划和目标，规划好网页的大致外观后就可以着手设    计了。
1.2.1  确定网站目标
在创建网站时，确定站点的目标是第一步。设计者应清楚建立站点的目标，即确定它将提供什么样的服务，网页中应该提供哪些内容等。要确定站点目标，应该从以下3个方面考虑。
●网站的整体定位。网站可以是大型商用网站、小型电子商务网站、门户网站、个人主页、科研网站、交流平台、公司和企业介绍性网站以及服务性网站等。首先应该对网站的整体进行一个客观的评估，同时要以发展的眼光看待问题，否则将带来许多升级和更新方面的不便。
●网站的主要内容。如果是综合性网站，那么对于新闻、邮件、电子商务和论坛等都要有所涉及，这样就要求网页要结构紧凑、美观大方；对于侧重某一方面的网站，如书籍网站、游戏网站、音乐网站等，则往往对网页美工要求较高，使用模板较多，更新网页和数据库较快；如果是个人主页或介绍性的网站，那么一般来讲，网站的更新速度较慢，浏览率较低，并且由于链接较少，内容不如其他网站丰富，但对美工的要求更高一些，可以使用较鲜艳明亮的颜，同时可以添加Flash动画等，使网页更具动感和充满活力，否则网站没有吸引力。
●网站浏览者的教育程度。对于不同的浏览者，网站的吸引力是截然不同的，如针对少年儿童的网站，卡通和科普性的内容更符合浏览者的品味，也能够达到网站寓教于乐的目的；针对学生的网站，往往对网站的动感程度和特效技术要求更高一些；对于商务浏览者，网站的安全性和易用性更为重要。
1.2.2  规划站点结构
合理地组织站点结构，能够加快站点的设计，提高工作效率，节省工作时间。当需要创建一个大型网站时，如果将所有网页都存储在一个目录下，当站点的规模越来越大时，管理
起来就会变得很困难，因此合理地使用文件夹管理文档就显得很重要。
网站的目录是指在创建网站时建立的目录，要根据网站的主题和内容来分类规划，不同的栏目对应不同的目录，在各个栏目目录下也要根据内容的不同对其划分不同的分目录，如页面图片放在images目录下，新闻放在news目录下，数据库放在database目录下等，同时要注意目录的层次不宜太深，一般不要超过三层，另外给目录起名的时候要尽量使用能表达目录内容的英文或汉语拼音，这样会更加方便日后的管理和维护。如图1-3所示为企业网站的站点结构图。
图1-3  企业网站的站点结构图
图1-4  电子购物网站页面结构
1.2.3  确定网站风格
站点风格设计包括设计站点的整体彩、网页的结构、文本的字体和大小、背景的使用等，这些没有一定的公式或规则，需要设计者通过各种分析决定。
一般来说，适合于网页标准的颜有3大系：蓝、黄/橙和黑/灰/白。不同的彩搭配会产生不同的效果，并可能影响访问者的情绪。在站点整体彩上，要结合站点目标来
确定。如果是政府网站，就要在大方、庄重、美观、严谨上多下功夫，切不可花哨；如果是个人网站，则可以采用较鲜明的颜，设计要简单而有个性。
如图1-4所示的购物网站，其结构紧凑，布局合理。页面文字和图片完美搭配，并且页面很有层次感，符合人们的审美观，同时总体页面风格是丰富多    彩的。
1.3  选择网页制作软件
设计网页时首先要选择网页制作软件。虽然用记事本手工编写源代码也能做出网页，但这需要对编程语言相当了解，并不适合广大的网页设计爱好者。由于目前可视化的网页设计工具越来越多，使用也越来越方便，所以设计网页已经变成了一件轻松的工作。Flash、Dreamweaver、Photoshop、Fireworks这4个软件相辅相成，是设计网页的首选工具，其中Dreamweaver用来排版布局网页，Flash用来设计精美的网页动画，Photoshop和Fireworks用来处理网页中的图形图像。
1.3.1  图形图像制作工具——Photoshop CS3和Fireworks CS3
网页中如果只有文字，则缺少生动性和活泼性，也会影响视觉效果和整个页面的美观。因
此在网页的制作过程中需要插入图像。图像是网页中重要的组成元素之一。使用Photoshop CS3和Fireworks CS3可以设计出精美的网页图像。
Photoshop是Adobe公司推出的图像处理软件。目前已被广泛应用于平面设计、网页设计和照片处理等领域。随着计算机技术的发展，Photoshop已历经数次版本更新，功能越来越强大。如图1-5所示是Photoshop CS3的工作界面。
在网页制作方面Fireworks能快速地为图形创建各种交互式动感效果，不论在图像制作或是在网页支持上都有着出的表现。
随着版本的不断升级和功能的不断加强，Fireworks受到越来越多图像网页制作者的欢迎。目前的最新版本Fireworks CS3中文版更是以它方便快捷的操作模式，在位图编辑、矢量图形处理与GIF动画制作功能上的优秀整合，赢得诸多好评。
使用Fireworks CS3在制作网页时，除了对相应的页面插入图像进行调整处理外，还可以使用图像进行页面的总体布局，然后使用切片导出。对网页中所出现的GIF图像按钮也可以使用Fireworks CS3创建，以便达到更加精彩的效果，如图1-6所示是Fireworks CS3的工作界面。
   
          图1-5  Photoshop CS3的工作界面                    图1-6  Fireworks CS3的工作界面
1.3.2  网页动画制作工具——Flash CS3
Flash是一款多媒体动画制作软件。它是一种交互式动画设计工具，用它可以将音乐、动画以及富有新意的界面融合在一起，以制作出高品质的动态视听效果。
由于良好的视觉效果，Flash技术在网页设计和网络广告中的应用非常广泛，有些网站为了追求美观，甚至将整个首页全部用Flash方式设计。从浏览者的角度来看，Flash动画内容与一般的文本和图片网页相比，大大增加了艺术效果，对于展示产品和企业形象具有明显的优越性。
Flash动画在网页的制作方面，还可以通过制作Flash导航条使导航菜单更精彩和更具动感，如图1-7所示是Flash CS3的工作界面。
1.3.3  网页编辑工具——Dreamweaver CS3
使用Photoshop制作的网页图像并不是真正的网页，要想使其真正成为能够正常浏览的网页，还需要用Dreamweaver进行网页排版布局、添加各种网页特效。利用Dreamweaver还可以轻松开发新闻发布系统、网上购物系统、论坛系统等动态网页。
Dreamweaver CS3是创建网站和应用程序的专业之选。它组合了功能强大的布局工具、应用程序开发工具和代码编辑支持工具等。Dreamweaver的功能强大而且稳定，可帮助设计人员和开发人员轻松创建和管理任何站点，如图1-8所示为Dreamweaver CS3中文版工作界面。
 
          图1-7  Flash CS3的工作界面                    图1-8  Dreamweaver CS3中文版工作界面
1.4  动态网站技术
仅仅学会了网页制作工具，还是远远不能制作出动态网站的，还需要了解动态网站技术，如网页标记语言HTML、网页脚本语言JavaScript和VBScript、动态网页编程语言ASP。
1.4.1  搭建动态网站平台
动态网页大多是由网页编程语言写成的网页程序，访问者浏览的只是其生成的客户端代码，而且动态网页要实现其功能大多还必须与数据库相连。
目前国内比较流行的互动式网页编程语言有：ASP、PHP、JSP、CGI、ASP.NET。
●HTML网页适用于所有环境，它本身也相当简单。
●ASP页主流环境为：Windows Server（包括NT、2000、2003）的IIS+Access/SQL Server。本书主要讲述这种环境下的网站开发，关于其创建过程，可以参考第5章，这里就不讲述了。
●PHP页主流环境为：Linux/UNIX+Apache+MySQL+PHP4+Dreamweaver。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。