个人网站设计八步骤

个人网站设计八步骤 一 确定个人网站主题 所谓个人网站主题就是我建立的个人网站所要包含的主要 内容, 一个个人网站必须要有一个明确的主题 .特别是对于个人网站, 你不可能像综合网站那样做的内容大而全,包罗万象. 你没有那个能力,也 没这个精力,所以必须要找准一个自己最感兴趣内容, 做深,做透, 办出 自己的特色.总的来说个人网站的主题无定则 ,只要是你感兴趣的,任 何内容都可以,但主题要鲜明,在你的主体范围内内容做到大而全 ,精 而深. 二 个人网站搜集材料 明确了个人网站的主题以后,自己就要围绕主题开始搜集材料 了. 常言道: “巧妇难为无米之炊”。要想让自己的网站有血有肉，能够 吸引住用户，自己就要尽量搜集材料，搜集的材料越多，以后制作 网站就越容易。 三 规划个人网站 一个个人网站设计的成功与否，很大程度上决定与设计者的规 划水平，规划个人网站就像设计师设计大楼一样，图纸设计好了， 才能建成漂亮的楼房。个人网站规划包含的内容很多，如个人网站 的结构，个人网站栏目设置，个人网站的风格，个人网站颜色搭配， 个人网站版面布局等，自己只有先把这些方面都考虑到了，才能在 制作时驾轻就熟，胸有成竹。下面来简单的介绍一下我的网站的总 体设计： 人网站的总体设计 1 网站的分析与设计 1.1 我的个人网站全面分析 我的个人网站包括：首页、文章、帅照、天气、下载，翻译、 网速、作者、留言、链接、管理等。 文章：这一页是我找的一些经典的文章。 帅照：本人的一些日常的照片。 下载：一些资料的下载链接。 翻译：英语汉语的在线翻译。 网速：网速的测试。 作者：关于自己的一些介绍。 留言：喜欢本网站的或者有什么建议的，可以留言的哦。 链接：关于一些常用网站的链接。 管理：管理员后台登陆的验证窗口。 1.2 网站页面的设计 我制做我的个人网站采用了动、静相结合。即静态的主画面 和动态的子页面相结合。网站的整体布局，链接，等都在 Dreamweaver 中制作；图片的优化用 Fireworks 制作。 1.2 数据库的设计 我的个人网站采用的数据库是 Access，在文件夹 Data 中放入了 一个 exblog3.Asp 数据库文件，考虑到了数据库的安全性，故将数 据库的后缀名由原来的.mdb 改为现在的.Asp ，功能不受影响。 exblog3.Asp 的 Ex_User 表文件为用户登录与注册。 exblog3.Asp 的 Ex_Photos 为我的相册的数据表文件。 exblog3.Asp 的表 Ex_Message 是实现我的留言的表文件。 以下就的各个数据库表文件的详细介绍： Ex_User 表:username( 用户登录与注册名)、userpwd( 用户与注册 登录的密码) 、homepage （用户的个人主页）、 email(用户的邮箱)、 sex(用户的性别 )、postalcode(用户注册的邮政编码 )、tel(用户注册 电话)、mobiletel(用户注册手机)、email(用户注册电子邮箱)、 web(用户注册个人主页)、intro(用户注册个人简介 )。Picture 表： title(网页所显示的图片名字)、flilename(图片的名字 )。 Ex_Message 表：froum_id （为论的栏目 id 编号）、 title（留言的 主题）body( 论坛发表的内容 ) hits(用户点击的次数)、ip(用户的 ip 地址)、user_id(用户发表贴 子的用户名) 、user_email（为用户发表贴子的电子邮件名）、 submit_date（用户发表文章提交的期）、 frist_id(用户发布贴子的 主题目)、father_id( 用户发布贴子的子题目 )、froumnme（论坛的栏 目）、froumcout(统集用户对某一栏目发布贴子的数目 )。 1.3 网站的各项功能的实现 11.1 后台的登录功能 如果用户未输入用户名与密码而想登录而单击了用户登录界面的 确定按钮，就会弹出“您输入的验证码不正确！”消息是用以下代 码现实的。 alert(您输入的验证码不正确。); “ response.write“location.href=default.asp“ founderr=true else session(“pSN“)=“ if request(“action“)=“login“ then 1.1.2 首页用户注册 用户的注册的功能分为了三步：第一步为注册用户输入用户名与 密码（ADD_2.asp），第二步注册用户填写详细信息 （ADD_3.asp）,第三步为用户注册成功的祝贺语。 第一步中用户注册的用户名要是已有用户使用了网站就会给予提 示“已有人使用该用户,请重新填写。实现这个功能是通过以下代码 实现的： sql=“select username from users where username=“ & request(“username“) & “ set rs=db.execute(sql) If not rs.eof and not rs.bof Then exit_flag=1 temp_str=“已有人使用该 用户“ End If 用户的注册名要求大于或等于 5 位，小于 20 位，是用以下代码实 现的： If len(request(“username“)20 Then exit_flag=1 temp_str=“用户名必须大 于 5 位小于 20 位“ End If 用户注册完一步就可进入第二步的注册与第三步了。 用户注册页的最新发表内有五个动人的故事以供用户欣赏（錯 過一時，錯過一生,如果在天堂遇见你,您拨的电话号码是空号 ,100 年不变的 100 句温柔浪漫语,一个让人们潸然泪下的故事。） 1.1.3 用户未登录而不能浏览网站 用户未登录用户是不能浏览心情日记与我的相册。只有登录与注 册过的用户才能浏览网站的全部。而这个功能是用以下代码实现的： 1.1.4 首页的公告栏的功能 首页公告栏上下滚动： 1.1.5 后台与网站的连接 我把动态相关信息全部储存在数据库中, 要想在网页中显示数据 库中的相关动态内容必须先对数据库进行链接与打开，要想链接数 据库必须使用前文所提到的 ADO 接口提供的基本对象中的 Connection 对象；而要想打开数据库则必须使用 ADO 接口提供的 基本对象中的 Recordset 对象；所以，我采用了调用 odbc_connection.asp 文件的方法进行连接，将打开与链接的代码 写入了文件中，其方法如下： 以下为数据库连接代码： 1.1.6 我的相册功能的实现 在我的相册中，用户可以浏览我的收集的相片，我的相册有 分页的功能，我在的相册中都是相片的缩小版，用户单击某张相片 就看到不是相片的缩小的版了，还有相片的名字也一同显示在我的 相册中。 “ 可以在这里 输出开始新行的标记 Do While Not rs.Eof And I0 循环直到当 前页结束或文件结尾 I=I-1 每显示一条，I 减 1，当变 成 0 时，表示本页结束 J=J+1 下面几行输出一个单元格，其中显示了图片 的缩略图，并显示了该图片的标题 Response.Write “ Response.Write “ Response.Write “ & rs(“title“) REsponse.Write “ 这里规定每行显示 3 张图片， (J mod 3)表示 求 I 除以 3 得到的余数，如果为 0，就表示需要在下一行开始显示了。 输出 标记，就可以结束本行，输出 标记，就表示下一个新行的开始。 If (J mod 3)=0 Then Response.Write “ End If rs.MoveNext Loop End if % 共有“ & page_total & “页，“ Response.Write “当前显示“ & page_no & “页，“ Response.Write “请选择数据页: “ For I=1 To page_total % “ 四 个人网站选择合适的制作工具 尽管选择什么样的工具不会影响自己设计网页的好坏，但是一款 功能强大，使用简单的软件往往可以起到事半功倍的效果。 最常用的工具是网页三剑客：Macromedia Dreamweaver、Macromedia Fireworks、Macromedia flash。 五 个人网站制作网页 材料有了，工具也选好了，就可以按照规划一步步地把自己的 想法变成现实了，这是一个复杂而细致的过程，一般是按照先大后 小，先简单后复杂来进行。在制作网页时要多灵活运用模版，这样 可以大大提高制作效率。 1 、网页设计美术设计要求：网页背景采用拼接的方式组合而成， 这样有利于加快网页的读取速度，利用了 DREAMWEAVER 的强 大功能使主页各个链接比较协调，自己对背景和美化也十分满意， 希望朋友们喜欢。 2 、在网页技术的采用上主要用到了 ASP 技术，由于面向的对象 多数是和我年龄相仿的学生或朋友，操作起来应该不会有太大的困 难。 在这举个例子：如 ASP 工具的选用 （2.1.1 ASP）的定义 ASP（Active Server Pages）是服务器端脚本编写 环境，使 用它可以创建和运行动态、交互的 Web 服务器应用程序。使用 ASP 可以组合 HTML 页、脚本命令和 ActiveX 组件以创建交互的 Web 页面和基于 Web 的功能强大的应用程序。ASP 应用程序很 容易开发和修改。如果您编过 HTML 网页，您将发现 ASP 脚本 提供了创建交互页的简便方法。如果您曾想从 HTML 表格中收集 数据，或用顾客的姓名个人化 HTML 文件，或根据浏览器的不同 使用不同的特性，您会发现 ASP 提供了一个出色的解决方案。以 前，要想从 HTML 表格中收集数据，就不得不学习一门编程语言 来创建一个 CGI 应用程序。现在，您只要将一些简单的指令嵌入 到您的 HTML 文件中，就可以从表格中收集数据并进行分析。您再 不必学习完整的编程语言或者单独编译程序来创建交互页。随着不 断掌握使用 ASP 和脚本语言的技巧，您可以创建更复杂的脚本。 对于 ASP，您可以便捷地使用 ActiveX 组件来执行复杂的任务， 比如连接数据库以存储和检索信息。如果您已经掌握一门脚本语言， 如 VBScript、JavaScript 或 PERL，而且您已经了解使用 ASP 的方法。只要安装了符合 ActiveX 脚本标准的相应脚本引擎，就可 以在 ASP 页面中使用任何一种脚本语言。ASP 带有 Microsoft Visual Basic Scripting Edition （VBScript）和 Microsoft Jscript 的 脚本引擎，这样您可以立即开始编辑脚本。PERL、REXX 和 Python 的 ActiveX 脚本引擎可以从第三方开发人员处获得。 P/p Web 开发人员 :如果您已经掌握了一门编程语言，如 Visual Basic，您将发现 ASP 是快速创建 Web 应用程序的一个非常灵活 的方法。通过向 HTML 中添加脚本命令，您能够创建应用程序的 HTML 接口。通过创建自己的 ActiveX 组件，可以将应用程序中的 商业逻辑封装到能够从脚本、其他组件或从其他程序中调用的模块。 P/p 使用 ASP 进行计算的 Web 可转化为有形的利益，它使 Web 供应商能够提供交互的商业应用而不仅仅是发布内容。例如，旅行 社能够比公布航空时刻表做得更多；用 ASP 脚本可以让客户察看 现有的航班、比较费用并预定座位。 P/p Asp 是这样工作的：浏览 器从 Web 服务器上请求 .asp 文件时，ASP 脚本开始运行。然后 Web 服务器调用 ASP，ASP 全面读取请求的文件，执行所有脚本 命令，并将 Web 页传送给浏览器。由于脚本在服务器上而不是在 客户端运行，传送到浏览器上的 Web 页是在 Web 服务器上生成 的。所以不必担心浏览器能否处理脚本：Web 服务器已经完成了所 有脚本的处理，并将标准的 HTML 传输到浏览器。由于只有脚本 的结果返回到浏览器，所以服务器端脚 本不易复制。用户看不到创建他们正在浏览的页的脚本命令。 P/p 运行 ASP 页面相对于普通的 html 页面要慢一点，因为普通的 html 页面只需要浏览器就能够解析，而 ASP 则必须是服务器将整页的代 码都执行一篇之后再发送数据。但是由于代码是需要经过服务器执 行之后才向浏览器发送的，所以在客户端看到的只能是经过解析之 后的数据，而无法获得源代码，故编写者不用担心自己的代码会被 别人剽窃。 (2.1.2)ASP 的运行环境 (1) Windows 2000+IIs 5.0(Internet 信息管理器 5.0)。 (2) Windows XP+Iis 5.0（Intetnet 信息管理器 5.0）。 (3) Windows 98+PWS4.0(personal Web Server4.0,个人 Web 服务管理器 (4) Windows NT 4.0 + Windows NT Option pack。 (2.1.3) 浏览 ASP 文件 （1） http:/localhost/temp.asp （2） /temp.asp （3） http:/您的计算机的名字/temp.asp （4） http:/您的计算机的 IP 地址/temp.asp (2.1.4) ASP 文件基本组成 （1）普通的 HTML 文件，也就是普通的 Web 的页内容。 （2）服务器端的 Script 程序代码：位于内的程序代码。 （3）客户的 Script 的程序代码：位于 内程序 代码。 (2.1.5)ASP 的程序的特点： （1）使用 Vbscript、Jscript 等简单易懂的脚本语言，结合 HTML 代码，即可速地完成网站的应用程序。 （2）无需编译，容易编写，可在服务器直接执行。 （3）使用普通的文本编辑器，如 Windows 的记事本，即可进行 编辑设计。 （4）与浏览器无关 (Browser Independence)，用户端只要使用可 执行 HTML 码的浏览器,即可浏览 ASP 所设计的网页内容。 ASP 所 用的脚本语言（Vbscript、Jscript）均在 Web 服务器端执行,用户的 浏览器不需要能够执行这些脚本语言。 （5）ASP 能与任何 ActiveX scripting 语言相容。除了可使用 VBScript 或 Jscript 语言来设计外，还通过 plug-in 的方式，使用由 第三方所提供的其他脚本语言。譬如 Perl 等。脚本引擎是处理脚本 程序的 COM(Component Object Model)组件。 （6）ASP 的源程序，不被传到客户浏览器。因而可以避免所写 的源程序被他人剽窃，也提高了程序的安全性。 （7）可使用服务器端的脚本来产生客户端的脚本。 （8）物件导向（ Object-oriented）。 （9）ActiveX（服务器组件 ActiveX）Server Components 具有 无限可扩充性。可以使用 Visual Basic、java、Visual c+、 COBOL 等编程语言来编写所需要的 ActiveX 服务器组件。 (2.1.6) ASP 的工作原理 用户在浏览器的地址栏中键入 ASP 文件，并回车触发这个 ASP 的申请。浏览器将这个 ASP 的请求发送到给 Web 服务器。Web Server 接收这些申请并根据 .asp 的后缀名判断这是 ASP 要求。 Web Server 从硬盘或内存中读取正确的 ASP 文件。Web Server 将这个文件发送到 ASP.DLL 的特定文件中。ASP 文件将会从头至 尾执行并根据命令要求生成相应的 HTML 文件。HTML 文件被送回 浏览器。用户的浏览器解释这些 HTML 文件并将结果显示出来。 (2.2) ASP 与数据库 (2.2.1) ASP 的对象存取数据库方法 在 ASP 中，用来存取数据库的对象统称 ADO（Active Data Objects），主要含有三种对象：Connection、Recordset 、Command Connection：负责打开或连接数据 Recordset：负责存取数据表 Command：负责对数据库执行行动查询命令 (2.2.2 )ASP 中常用的数据库 在 ASP 中一般使用 SQL 或 Access 数据库。 SQLserver 运行稳 定、效率高、速度快，但配置起来较困难、移植也比较复杂，适合 大型网站使用；Access 配置简单，移植方便，但效率较低。适合小 型网站。 我在我的个人网站所选用的就是 Access 数据库。 (2.3) SQL 语言在 ASP 中的使用 SQL(Structure Query Langage)语言，即结构化查询语言，是操 作数据库的标准语言。在 ASP 中，无论何时要访问一个数据库，都 要使用 SQL 语言。 以下为在 ASP 中最常用到的语句： (1) select 语句 查询数据 (2) Insert 语句添加记录 (3) Delete 语句删除记录 (4) Update 语句 更新记录 (2.4) ADO 的介绍 (2.4.1)什么是 ADO ASP 的 Database Access 组件使用 ADO 为 Web 应用程序 提供了一组基于对象的数据访问接口，是一项将数据库访问添加到 Web 页的技术。 ADO 是一个运行于服务器端的 ActiveX 组件，它所 提供的功能是进行数据库访问，也是近年来数据库编程的一个新进 展。在 ASP 中通过使用 ADO 编写简明紧凑的脚本，可以连接任何 ODBC 兼容的数据库，如 SQL Server、Access 及普通文本文件等 数据源。ADO 具有界面的一致性的特点，不论后台使用的是什么数 据库，对于网页开发人员来说都没有什么不同。这样，当企业单位 发展了，数据库需要从小型的移植到大型的数据库时，应用程序的 界面几乎不用作任何变动。 另外，ADO 具有语言无关性的特点，它同时可以应用于 VB、 VC+、VBScript、JavaScrip 或 Java 的开发环境中。 (2.4.2) ADO 的对象 (1) Command 对象定义了将对数据源执行的指定命令 (2) Connection 代表打开的、与数据源的连接。 (3) DataControl 将数据查询 Recordset 绑定到一个或多个控件 上（例如，文本框、网格控件或组合框），以便在 Web 页上显示 ADO.Recordset 数据。 (4) DataFactory 实现对客户端应用程序的指定数据源进行读写 数据访问方法。 (5) Error 包含与单个操作（涉及提供者）有关的数据访问错误 的详细信息。 (6) Recordset 代表来自基本表或命令执行结果的记录的全集。 任何时候，Recordset 对象所指的当前记录均为集合内的单个记录。 (2.5 )三剑客在网站中的应用 三剑客的融会应用能够发挥起网页制作的理想效果。我对整体的 网页布局制作比较喜欢用 Dreamweaver。它的设计与 ASP 代码的 结合能够达到理想的效果。Fireworks 能够使网页的占用空间较小， 使网页打开速度提高。 (2.6)脚本语言 VBScript 在 ASP 中的应用 ASP 本身并不是一种脚本语言，但它却为嵌入 HTML 页面的脚本 语言提供了运行的环境，在 ASP 程序中常用的脚本语言有 VBScript 和 JavaScript 等语