静态网站论文模板

(2)将页面中所有HTML5标签元素对应的CSS样式表中的margin-right、margin-left、padding-right、padding-left的属性值也用公式——目标元素宽度÷上下文元素宽度=百分比宽度来修改。

(3)将CSS样式表中的font-size属性值的单位用em来代替px。这里依然使用公式——目标元素宽度÷上下文元素宽度=百分比宽度。这里需要提示新手的是：在标签的初始化代码中，如果有font-size:16px;语句，那么在给其他元素的font-size属性上修改值时，公式中的“上下文元素宽度”就等于16px，例如，#logo{font-size:48px;}现在要修改为#logo{font-size:3em;}。

(4)为了实现弹性图片，让图片随视口缩放，图形图像、动画和视频的弹性设置使用“img,object,video,embed{width:100%;max-width:100%;}”。其中，max-width属性是用于确保缩放时不会超出图片最大尺寸。同时，熟手还会使用AdaptiveImages解决方案来实现自适应图片。

(5)媒体查询可以通过判断不同设备终端，提供不同的样式使其实现在不同终端都能获得最佳的用户体验。例如，某个响应式页面用电脑浏览页面时，页面信息会以平铺的形式分布在页面合适的位置;用手机浏览页面时，导航按钮会相继隐藏起来，部分信息变成左右滑动的方式呈现，页面会重新布局，图片相应缩小。媒介查询的语法格式是，例如：设定宽度不超过400像素的屏幕尺寸，代码是：。虽然，HTML5+CSS3提供了良好的媒体查询功能，但当前仍有一些浏览器不支持，你可能需要添加如下基本样式：<!--[ifltIE9&!IEMobile]>

4结束语

对响应式网页设计而言，当前的设计理念和技术方法还不是终点,网站前端设计师需要继续努力找出更好的解决方案。而对新手学习者而言，响应式网页设计开发技能的形成不是一蹴而就的，还需要学习者在多个项目中，利用原型进行多次定向、操作及内化才能真正掌握。

摘 要：版式设计可以说是界面设计的基础部分，网页界面中的版式设计只是其发展应用中的一个方向。如何设计完美有魅力的网页界面，版式设计扮演十分重要的角色，优秀的版式设计可以给浏览者留下深刻的印象，提高页面的访问量。因此，本文将向诸位读者介绍在CDIO工程 教育 模式下，网页设计课程中采用项目为指导的教学实践过程中注意的事项。

关键词：网页设计;版式设计 CDIO教育模式;项目教学

近年来随着经济的高速发展，科技的日新月异，教育领域同样面临革新。引进新的教育理念和教学模式成为教育工作者的关注重心，此时，欧美成熟的工程教育理念慢慢地进入我们的视野之中，CDIO的教学模式(Conceive构思、Design设计、Implement实施、Operate运行)，符合工程人才的培养，提高学生的实践能力、组织能力、创新能力。这一模式更适应当下的教育环境需求。

网页设计这门课程属于交叉学科范畴，兼顾艺术设计、计算机技术及交互设计等多门学科。另外，这门课程作为艺术与技术的结合体，要求学生具备较强实践动手能力与综合运用能力，因而在教学过程中我们依据CDIO的工程教育理念开展教学。

本文重点谈到的是网页设计中的版式设计过程，网页中的版式设计起到信息统一、分割区域和交互导引的作用，是在有限的空间界面内将文字、图形、背景色彩或图案及交互功能集成在方圆之间，根据设计的形式法则，利用艺术美学与科学技术相结合的方式来实现效果展示。下面以教学过程中的“xx艺术系网站”项目为例，以网页设计中的版式设计为内容，展示教学过程中的各个设计阶段。

1 构思阶段

(1)确立目标。

网页设计不是盲目的行为，不是简单使用软件的行为，它是构思由确立到实现的过程，是一种展示到体会的过程。因此，在设计之初，教师需要引导学生了解当前的课题，明确网站要做什么，网站的外观布局是什么样子，网站需要营造何种氛围。我们常见的网站根据用途分类为企业网站、电子商务网站、电子政务网站、文体娱乐网站、教育科学网站等，每种类型的网站都有自己需要传播的信息，根据所需文字与图片选择适合的排版方式，进而营造恰当的氛围。在“xx艺术系网站”项目中，学生会根据实际项目类型，理解项目设计目标为，该学院所属系部信息服务类网站，界面版式方面要求简洁大方，色彩明快，塑造清新、愉悦的氛围，学生可以根据以上内容展开进一步的设计工作。

(2)信息整理。

项目开展前期根据对项目的简单分析，要求学生对客户或相关人士展开访谈，对行业同类网站的资讯开展收集与调研。这一阶段学生会接触网页设计的需求方，在本项目中可以设定为系内行政人员、教师及系内学生，根据访谈或调研可以得到网站相关设计信息，如对整体风格的需求，导航的设计需求，网站类型为静态网站或动态网站，根据需求结果，要求学生设计多样的版式效果，以供客户参考。

(3)交互设计。

我们将网页中的交互分为视觉上的交互和行为功能上的交互设计。在这里我们更侧重说明交互在视觉上的应用。网页中我们常见的交互形态有按钮、导航条、搜索栏和表单等。这些交互形态都会出现在版式的突出及显著位置，这样更引发人们的视觉关注中心，因而，在进行版式设计时，需要考虑这些交互元素的设置，友好的版式也是一种界面与人的情感交互。在我们的项目中学生应该考虑交互按钮的外观设计，排放位置等因素;导航条的设置应在醒目位置，清晰明确发挥导引作用;搜索栏帮助浏览者快捷搜索，放置在易发现的位置，搜索一般出现在网页右上角;表单设计是学生所忽略的环节，因为可以使用插件添加，导致学生认为无须设计，在此建议信息表单设计时可考虑细节设计，提高友好度与舒适度等交互设计。

2 设计阶段

版式设计是网页设计中重要的设计引导规划环节，在这个过程中学生可以根据自己的项目主题展开艺术美感的设计。一般进行页面版式设计我们从以下几个方面入手。

(1)版式结构设计。

网页设计中的版式设计与传统媒介中的版式设计略有不同，前提是他们都遵循版式设计五原则，[1]内容与形式，简洁与简约，设计与艺术，趣味与独特，局部与整体。为了设计富有形式法则和艺术美感的网页作品，版式设计方面通常会采用黄金比例和三分法排列原则。黄金比例法是初学者易于掌控的方法，将视窗可用区域分成两个部分，也可以根据设计比例需求，将数字录入到相关计算网站，得出合适的黄金比例分配方案。三分法构图排版方式，是将排版界面分成三份，根据内容的不同，选择不同的三分法排列位置。

网页设计中由于要考虑显示器视窗显示水平不同，我们的总体版式设计会采用固定格式或非固定格式两种形式。固定格式的版面是固定的界面版式，而非固定格式的版面设计是变化的，这种变化的版式很难把握的，变化的视窗将改变既定的字体形式和图形排列位置，这个课题也是我们今后要深入探讨的方向。

(2)字体、图像、色彩设计。

版式设计是界面设计的骨架，字体设计是界面设计的血肉，富媒体技术的全面发展，网站这一综合载体也得到了极大的发展，版式与字体的结合构成了网页的不同风貌。在网页中常见字体分为中英文两类和图形化的艺术字体，字号一般选用12pt。在中文网页常常出现的字体为宋体或黑体，字号为12pt/14pt的文字展示，另外也会有些超大字体以图像的形态出现，并通过视觉效果的调整，创建三维空间的视觉展示效果。图形化的艺术字体，在诸多网站中得到应用。在设计中我们题材保有传统的 文化 性，中国元素的运用，如书法、图腾、建筑等富有中国色彩的艺术形态都应得到我们的思考与关注，中西文化的比较与融合也是我们要探索的方向。图形与色彩部分在排版中应适合主题，响应设计氛围，为整体版式服务。

(3)视频展示设计。

网页界面排版中还需考虑一种新兴的展示手段，视频信息展示，页面中利用大量的视频信息排版，减少文字、图片信息的输入，信息传达方式由静态转换为动态，提供有趣而新颖的排版展示方式。

3 技术实施

(1)界面版式视觉设计。

网页设计中对静态界面的布局，我们通常会使用Photoshop和Illustrator图像处理软件开展设计，首先我们会根据 思维导图 绘制基础模板，然后根据设计需求在模板中添加设计好的文字、图形、视频、声音等设计元素。

(2)交互功能视觉设计。

在网页设计中我们会考虑将静态样稿转换为简单的静态网页，这种转换我们会使用Dreamweaver软件进行操作，由于网页展示设备的不同我们也会考虑采用一些相关的模型制作软件来处理交互设计部分。

4 运行阶段

将确定好的静态草稿通过切图生成为静态网站，测试效果及功能，当运行时根据需要和视觉效果进行调整直到理想状态。

5 小结

网页设计课程将实际项目导入课堂，根据CDIO工程教育模式教学，打造有效、有趣、实用的教学方式，使学生在学习操作中锻炼宏观思考的能力，获得团队合作的能力，养成终身学习的能力。学生对设计流程的掌握就是对知识体系的掌握和运用，达到理论与实践相结合，通过对版面的全面掌控，更好地为静态网页设计打下坚实的基础。

参考文献：

[1] 沈卓娅，王汀.字体与版式设计实训[M].中国出版集团东方出版中心，2011：74.

1. 网站设计毕业论文范文

2. 网站类毕业设计论文

3. 浅谈广告设计毕业论文范文

4. 关于网络工程毕业论文范文

5. 关于计算机毕业论文范文大全

6. 计算机毕业论文范文大全

求一篇个人静态网页设计的论文(急用)我的邮箱suhaifeng123@163.com

毕业论文

网站设计与制作
所 属 系：计算机
专 业：应用技术
学生姓名：***
学 号：************
指导老师：****
二〇一一年五月

第1章 网站总体分析及概要设计
1.1 模块功能分析
1.1.1 引导首页模块
引导首页使用整体颜色背景，配合图片或Flash构成，顶部为导航首页链接。
1.1.2 班级形象模块
该模块功能主要是展示班级的形象，同时作为网站的导航首页，在用户登录后就可以看到班级的整体形象，班级的展示及班级动态，用户还可以通过顶部和左侧的导航栏进入网站，更深入的了解该班级。
1.1.3 用户模块
用户注册与登录：网络上的用户通过填写ID、密码等信息可以注册成为会员，并获得相应的用户权限。系统自动把用户的注册信息存储到服务器端的数据库中。如果用户ID重复或者填写错误，系统会给出提示信息，而通过用户注册与登录、可以自由发布与查看各种信息。
用户信息维护：系统的注册用户可以随时修改自己的注册信息，这些修改后的信息将自动更新到服务器端的数据库中。
用户登录/退出：系统的注册用户可以登录系统并且获得相应的权限，登录了的用户也可以选择退出登录。
1.1.4 留言板模块
该模块功能主要是提供用户与网站主之间的交流平台及站长收集用户反馈信息以改善站点。
1.2 网站导航功能结构
网站主要实现的功能有：网站首页导航，各页面导航以及其他模块。
1.3 论文可行性分析
1.3.1 社会可行性分析
可行性分析主要分析现有技术条件能否顺利完成开发工作，软硬件配置能否满足开发者的需要等。随着计算机硬件和软件技术的飞速发展，为网站的建设提供了有利的技术条件，由此看来技术基础也已非常成熟，因而技术上是可行的。
1.3.2 软件可行性分析
1.3.2.1 ASP技术介绍
ASP（Active Server pages）即“动态服务器网页”，ASP之所以能受到大家的重视与使用的原因，只要在于脚本在服务器上而不是在客户端运行，传送到浏览器上的Web页是在Web服务器上生成的。所以不必担心浏览器能否处理脚本，Web服务器已经完成了所有脚本的处理，并肩标准的HTML传输到浏览器。由于只有脚本的结果返回到浏览器，所有服务器端脚本不易复制。用户看不到创建他们正在浏览的页的脚本命令。所以在客户端看到的只能是经过解析之后的数据，而无法获得源代码，故编写者不用担心自己的代码会被别人剽窃。
ASP的主要特点：容易产生，无需Compile变异或Link链接即可执行，集成于HTML中，使用常规文本编辑器，如Windows的记书本，即可设计，用户端只要使用常规的可执行HTML码的浏览器，即可浏览ASP所设计的主页内容，Script语言（Vbscript ，Jscript）是在站点服务器执行，用户不需要执行这些语言，可通过ActiveX服务器组件来扩充功能。ActiveX Server component，可使用visual Basic，Java，Visual C++，COBOL等语言来实现，任何AcTiveX scripting语言兼容。可使用Vbscript或Jscript等语言来设计，一个应用程序，可以在多个主页之间保留和使用一些共同的信息，也就是说一个用户，可以在多个主页之间保留和使用一些共同的信息，在多个主页之间共享信息。
1.3.2.2 DREAMWEAVER
Dreamweaver、FLASH以及在DREAMWEAVER之后推出的针对专业网页图像设计的FIREWORKS，三者被MACROMEDIA公司称为DREAMTEAM(梦之队)，足见市场的反响和MACROMEDIA公司对它们的自信。说到DREAMWEAVER我们应该了解一下网页编辑器的发展过程，随着互联网(Internet) 的家喻户晓，HTML技术的不断发展和完善，随之而产生了众多网页编辑器，从网页编辑器基本性质可以分为所见即所得网页编辑器和非所见即所得网页编辑器（则原始代码编辑器），两者各有千秋。所见则所得网页编辑器的优点就是直观性，使用方便，容易上手，您在所见即所得网页编辑器进行网页制作和在WORD中进行文本编辑不会感到有什么区别。
Dreamweaver可以用最快速的方式将Fireworks，FreeHand，或Photoshop等档案移至网页上。使用检色吸管工具选择荧幕上的颜色可设定最接近的网页安全色。对于选单，快捷键与格式控制，都只要一个简单步骤便可完成。Dremweaver能与您喜爱的设计工具，如Playback Flash，Shockwave和外挂模组等搭配，不需离开Dreamweaver便可完成，整体运用流程自然顺畅。除此之外，只要单击便可使Dreamweaver自动开启Firework或Photoshop来进行编辑与设定图档的最佳化。
使用网站地图可以快速制作网站雏形、设计、更新和重组网页。改变网页位置或档案名称，Dreamweaver 会自动更新所有连结。使用支援文字、HTML码、HTML属性标签和一般语法的搜寻及置换功能使得复杂的网站更新变得迅速又简单。
Dreamweaver是唯一提供Roundtrip HTML、视觉化编辑与原始码编辑同步的设计工具。它包含HomeSite和BBEdit等主流文字编辑器。帧(frames)和表格的制作速度快的令您无法想像。进阶表格编辑功能使您简单的选择单格、行、栏或作未连续之选取。甚至可以排序或格式化表格群组，Dreamweaver 支援精准定位，利用可轻易转换成表格的图层以拖拉置放的方式进行版面配置。所见即所得 Dreamweaver成功整合动态式出版视觉编辑及电子商务功能，提供超强的支援能力给Third-party厂商，包含ASP， Apache，BroadVision， Cold Fusion，iCAT， Tango与自行发展的应用软体。当您正使用Dreamweaver在设计动态网页时，所见即所得的功能，让您不需要透过浏览器就能预览网页。梦幻样版和XML Dreamweaver将内容与设计分开，应用于快速网页更新和团队合作网页编辑。建立网页外观的样版，指定可编辑或不可编辑的部份，内容提供者可直接编辑以样式为主的内容却不会不小心改变既定之样式。您也可以使用样版正确地输入或输出XML内容。
　　Dreamweaver还集成了程序开发语言，对ASP、.NET、PHP、JS的基本语言和连接操作数据库，都是完全支持的。
1.3.2.3 SQL 2000
SQL Server 2000是为迅速提供可伸缩性电子商务、企业及数据仓库解决方案而开发的完整数据库与分析软件产品。SQL SERVER 2000定位于Internet背景下的数据库应用，它为用户的Web应用提供了一款完善的数据管理和数据分析解决方案。同时SQL SERVER 2000还是Windows DNA（Distributed Internet Architecture）架构的一个核心组件。它极大地缩短了用户开发电子商务、数据仓库应用的时间。SQL SERVER 2000还提供对XML(Extensible Markup Language扩展标示语言支持)和HTTP的全方位支持。
　　在高性能和企业级可伸缩性领域，SQL Server 2000 设计成利用 Windows 2000 对更多处理器、更大的系统内存的支持，最终达到支持 64 位硬件平台。在不断提升可用性的努力过程中，SQL Server 2000 采用 Windows 2000 四路群集，提供了大大改进的群集支持。SQL Server 7.0 已经在可管理性和易用性方面在行业内领先，SQL Server 2000 通过与 Windows 2000 活动目录紧密结合进一步改进了这些功能。而且，SQL Server 2000 还包含对现有管理工具和实用程序的重大改进，并引入更具自我调节和自我管理的引擎功能。
　　SQL Server 2000 按照设计可以为部署和维护强大的、易于管理、支持商务活动的 Web 站点提供最好的性能，这些站点可以从事商家和商家之间或商家与客户之间的交易。在寻求一个支持您的电子商务解决方案的数据库时，需要考虑的项目包括：可用性、性能、可管理性和价格。
1.3.2.4 PHOTOSHOP
Photoshop是Adobe公司推出的一款功能十分强大、使用范围广泛的平面图像处理软件。拥有多种选择工具，极大地方便了用户的不同需求。而且多种选择工具还可以结合起来选择较为复杂的图像。它不仅拥有多种内置滤镜可供用户选择使用，而且还支持第三方的滤镜。目前Photoshop是众多平面设计师进行平面设计，图形，图像处理的首选软件。
1.3.2.5 FLASH
Flash被大量应用于互联网网页的矢量动画设计。 因为使用向量运算﹙Vector Graphics﹚的方式，产生出来的影片占用存储空间较小。 使用Flash创作出的影片有自己的特殊档案格式﹙SWF﹚， 该公司声称全世界97%的网络浏览器都内建Flash播放器﹙Flash Player﹚ 。Flash是Macromedia提出的“富因特网应用”（RIA）概念的实现平台。
1.4 开发环境介绍
操作系统：Windows XP professional；
开发的软件环境：IIS 5.1 ，Dreamweaver CS4 ，SQL server 2000 ，Photoshop CS5，Flash 8
开发的硬件环境：Pebtium（R） Dual-Core CPU T4200 @ 2.00GHZ
内存：2 GB

参考文献及引用内容
网站建设教程（金旭亮、吴彬），高等教育出版社；
ASP动态网页编程/工作过程导向新理念从事（丛林编委会），清华大学出版社；
Flash ActionScript 3 殿堂之路（孙颖）电子工业出版社；
站长之家 : ；
站长网 : ；

结束语
在该网站制作的过程中利用了各种软件或程序设计语言完成网站的设计，完成前台基本操作与后台的数据处理，浏览器向WEB服务器代理提出访问请求，可以通过浏览器直接看到网站内容，同时给班级在网络上带来了一个很好的宣传窗口。本网站也方便了班级同学间的联系及交流。上述就是我制作该网站所想要视线的目标。相信通过一个多月的毕业论文对该网站的制作完善，能使我对网站制作有了一个比较清楚的认识，也加深了对数据库原理、程序设计的学习，能提高资深的程序设计能力，到那时我得到的将是终生的财富，必将给我今后的学习和工作带来更多的收益。

致 谢
大学生活进入尾期，即将离开美丽的校园，心中难免有着种种不舍，这里的三年生活，存在了我太多美好的回忆。
在这里，首先要感谢银涛老师在我完成该毕业论文过程中给予的悉心指导。同时通过互联网在网上收集大量的资料并且及时向指导老师、同学请教。在他们的帮助下，我顺利的完成了此次毕业论文的任务。通过此次设计，使我学到了很多有使用价值的只是，开阔了知识面，积累了对网站制作的经验，在遇到困难时，去寻求解决的方法，去克服它，并学会自己找资料进行参考，直到问题最终得到解决。在制作学习中，我领悟到了很多道理——学习在于不断探索、思考、质疑，在举一反三中创新。更重要的是要有持之以恒的毅力。
在为期1个多月的毕业设计过程中使自己真正的学习到很多的东西，无论是自己的动手能力是是心智的开发都是一个很大的提高。更重要的是学到了一种严谨的学习态度。在整个毕业设计中三年的大学学习老师所教授的知识无疑是最大的帮助，指导老师细心的指导更加速了本人的提高。在此，我衷心的感谢及祝福老师们。

如何用PHP制作静态网站的模板框架

分离功能和布局的基本思想就是使得这两组人能够各自编写和使用独立的一组文件：程序员只需关心那些只包含PHP代码的文件，无需关心页面的外观；而页面设计人员可以用自己最熟悉的可视化编辑器设计页面布局，无需担心破坏任何嵌入到页面的PHP代码。 如果你曾经看过几个关于PHP模板的教程，那么你应该已经明白模板的工作机制。考虑一个简单的页面局部：页面的上方是页头，左边是导航条，其余部分是内容区域。 可以看出页面如何由这些模板构造而成：main模板控制着整个页面的布局；header模板和leftnav模板控制着页面的公共元素。花括号“{}”里面的标识符是内容占位符。使用模板最主要的好处在于界面设计者能够按照自己的意愿编辑这些文件，比如设置字体、修改颜色和图形，或者完全地改变页面的布局。界面设计者可以用任何普通HTML编辑器或者可视化工具编辑这些页面，因为这些文件都只包含HTML代码，没有任何PHP代码。 PHP代码全部保存到单独的文件中，这个文件也就是由页面URL实际调用的文件。Web服务器通过PHP引擎解析该文件，然后把结果返回给浏览器。一般地，PHP代码总是动态地生成页面内容，比如查询数据库或者执行某种计算等。下面是一个例子： // 此处的PHP代码设置 $content使其包含合适的页面内容 $tpl->assign('CONTENT', $content); $tpl->parse('HEADER', 'header'); $tpl->parse('LEFTNAV', 'leftnav'); $tpl->parse('MAIN', 'main'); $tpl->FastPrint('MAIN'); ?>这里我们使用的是流行的FastTemplate模板类，但其基本思路对于其他许多模板类来说都一样。首先你实例化一个类，告诉它到哪里去寻找模板文件以及哪一个模板文件与页面的哪部分对应；接下来是生成页面内容，把结果赋予内容的标识符；然后，依次解析各个模板文件，模板类将执行必要的替换操作；最后把解析结果输出到浏览器。 这个文件完全由PHP代码构成，不包含任何HTML代码，这是它最大的优点。现在，PHP程序员可以集中精力编写生成页面内容的代码，而不必为了如何生成HTML去正确地格式化最终页面而担心。 很容易看出采用模板还有第二个好处。如上例所示，页面左边的导航条单独保存为一个文件，我们只需编辑这一个模板文件就可以改变网站所有页面左边的导航条。 避免页面元素重复 “这确实不错”，你也许会想，“我的网站主要就是由大量的静态页面构成。现在我可以从所有页面中删除它们的公共部分，要更新这些公共部分实在太麻烦了。以后我就可以用模板制作出很容易维护的统一页面布局。”但事情并非这么简单，“大量的静态页面”道出了问题的所在。 请考虑上面的例子。这个例子实际上只有一个example.php页面，它之所以能够生成整个网站的所有页面，是因为它利用了URL中的查询字符串从数据库之类的信息源动态地构造出页面。 我们之中的大多数人所运行的网站并不一定都有数据库支持。我们的网站大多数由静态页面构成，然后用PHP在这里、那里加上一些动态功能，比如搜索引擎、反馈表单等。那么，如何在这种网站上应用模板呢？ 最简单的方法是为每一个页面复制一份PHP文件，然后在每一个页面中把PHP代码里代表内容的变量设置成合适的页面内容。例如，假设有三个页面，它们分别是主页（home）、关于（about）和产品（product），我们可以用三个文件分别生成它们。这三个文件的内容都类如： 希望你能够喜欢本网站"; $tpl->assign('CONTENT', $content); $tpl->parse('HEADER', 'header'); $tpl->parse('LEFTNAV', 'leftnav'); $tpl->parse('MAIN', 'main'); $tpl->FastPrint('MAIN'); ?>显然，这种方法有三个问题：我们必须为每一个页面复制这些复杂的、牵涉到模板的PHP代码，这与重复公共页面元素一样使得页面难以维护；现在文件又混合了HTML和PHP代码；为内容变量赋值将变得非常困难，因为我们必须处理好大量的特殊字符。 解决这个问题的关键就在于分离PHP代码和HTML内容，虽然我们不能从文件中删除所有的HTML内容，但可以移出绝大多数PHP代码。静态网站的模板框架： ob_end_clean(); $tpl->assign('CONTENT', $content); $tpl->parse('HEADER', 'header'); $tpl->parse('LEFTNAV', 'leftnav'); $tpl->parse('MAIN', 'main'); $tpl->FastPrint('MAIN'); } ?>ageStart函数首先创建并设置了一个模板实例，然后启用输出缓存。此后，所有来自页面本身的HTML内容都将进入缓存。pageFinish函数取出缓存中的内容，然后在模板对象中指定这些内容，最后解析模板并输出完成后的页面。 这就是整个模板框架全部的工作过程了。