个人网页设计与开发
个人网站设计与开发
【内容摘要】本设计以个人为研究对象，首先研究了个人需求和开发新的个人网站的可行性；其次，在认真分析了网上个人网页基础和自己对个人网页的见解上开始了网站的设计，明确了网站的结构设计，为网站设计了具体的开发方案。最后实现了一个具有展现个人特色、青春风貌等的个人网站。本网站采用Dreamveaver8为主要编码工具, 网站经过调试，能满足在不同的分辨率下有相同的显示效果，网页浏览速度快，功能较完整的特点。
【关键词】个人特色；个人网站；网页设计
1. 概述
1.1背景
随着网站技术的发展与普及，很多人开始为自己量身制作一个属于自己的个人网站，通过网站来展示自己的个性、特色。一些大型的网站也提供了个性化的装饰功能。这也是为了迎合人们对个性化的需求，通过建立个人网站来展现自我个性。
1.2可行性分析
（1）技术可行性
由Macromedia 公司所开发的著名网站开发工具Dreamweaver8。它使用所见即所得的接口，集网页设计、网站开发和站点管理功能于一身，具有可视化、支持多平台和跨浏览器的特性，是目前网站设计、开发、制作的首选工具。
（2）需求可行性
个人为展现自我的需求越来越大，个人网站可以满足人们对自我
展现的需要。
2. 设计方案
1设计理念
通过比较艳丽的颜色格调，展现青春的自我。以淡蓝色格调、轻唱悠悠的歌声转入界面到深蓝色背景的主页的格版，显示出每个人的个性。展现不同的自我。在主页中，通过分块的板式设计，在不同的表格中设置一些关于自己的介绍，使得别有一翻滋味。
2设计图
3实施方法
通过CSS+DIV进行版面排版设置，并解决不同分辨率下面的显示问题。
4系统设计
第一个界面
4.1确定基本框架
首先通过在表格中设置布局整体框架，设置宽为771，编辑边框的宽度为0，间距设置为0，内容与边界的距离间隙为0，整个表格设置为居中显示。
border="0"
cellspacing="0"
cellpadding="0"
align="center">
其次通过填充图片使表格显示为图片样式
„„
效果如图：
4.2对板块进行定义
我们设置了网页的颜色、文本形式、背景图片、左边界、上边界和背景音乐。
Html 代码如下：
bgcolor="#FFFFFF"
text="#000000"
background="images/annahomeindex_b.jpg"
leftmargin="0" topmargin="0" >
4.3设置链接
最后一步，我们通过设置超链接，把第一个界面网站转入主界面。
第二个界面
4.4对板块进行定义
首先我们通过CSS 来定义整体框架，把整个网页页面显示设置为居中显示。这样设置之后，无论在什么分辨率的情况下都可以居中显示。而且一般的网页制作都是采取的居中设置。CSS 代码放在标签中。
基本框架代码标签：
|
width=129 height=76 alt=""> |