个人网页设计说明书

个人网页设计说明书

目录

一、网页设计目的

1.1 网页设计需求浅谈 (2)

1.2 个人网页设计理念 (2)

1.3 制作背景 (2)

1.4 术语定义 (2)

二、网页设计以及浏览工具

2.1 网页设计说明 (3)

2.2 色彩方案 (3)

2.3 工作环境 (3)

2.4 浏览工具 (3)

三、个人网页功能模块设计

3.1 空间动画 (4)

3.2 主页 (5)

3.3 日志 (7)

3.4 日志简介 (8)

3.5 相册界面 (9)

3.6 相册展示 (10)

3.7 音乐 (11)

3.8 音乐列表 (12)

3.9 个人资料 (13)

3.10留言板 (14)

四、总结

4.1 技术总结 (15)

4.2 个人心得总结 (15)

附加：第二种网页设计图

一、网页设计目的

1.1 网页设计需求浅谈：

随着网络技术以及网页制作技术方面的日臻成熟人们越来越关注网页的美观性，所以当下网页制作的一个最主要的出发点就是网页的美观和可操作性。在表达一些理念方面东西的时候能更加的形象化与多样化。就全球上网的人数来说，有很多的人正通过个人空间来改变他们的生活方式，同时学生也学习到了各个方面不同的知识，人们通过自己的文字来传递着不同的信息。作为一个发展迅速的网络空间,个人空间向我们透露着这个信息传递和情感的平台将影响接下来的几代人.

1.2 个人网页设计理念：

本次毕业设计目的就是做一个属于自己的主页，通过一些信息来表达自己的一些思想与观点，还有就是一些个人对于生活的一些心得体会，再其中加入个性化的元素能表现自己符合自己性格的色彩搭配与文字图画以及音频，当然也是对过去的留恋，故空间名取名为流年，给人一种怀旧的感觉。

1.3 制作背景

a.网站项目的名称：个人空间

b.用户：普通的用户

1.4术语定义

个人空间：就是一个网页，它通常是由简短且经常更新的信息所构成。

这些张贴的文章都按照年份和日期倒序排列，也就是最新的放在最上面，最旧的在最下面。不同的内容和目的有很大的不同，从对网络资源的整理与评论，到有关公司、个人的构想，从新闻、照片到日记、诗歌、散文，甚至科幻小说都应有尽有。

二、网页设计说明以及浏览工具

2.1 网页设计说明

（1）名称：流年

（2）性质：个人空间

（3）主要内容：这是一个以个人空间为主题的网页设计，所包括的页面开场动画、主页、日志、相册、音乐、资料、留言板等。

（4）版式：左边为导航区，右边为展示区。

（5）风格：主调请亲而不失格调，色彩淡雅，版面活泼风趣。

2.2 字体、色彩方案

为了个人空间网页设计能够更好投入到实际操作中，特此准备了两种方案。

（1）一种为淡暖色系

黄绿色（C：9 M：0 Y：36 K：0）为主色调

橙色调（C：0 M：30 Y：70 K：0）为辅色调

朱红色(C:：32 M:：72 Y：85 K：29）为辅色调

字体均采用华康少女字体、华康采风字体、华康娃娃体。

（2）一种为清蓝色系（备选方案）

淡蓝色（C：9 M：0 Y：36 K：0）为主色调

粉红色（C：7 M：33 Y：0 K：0）为辅色调

桔黄色(C：0 M：36 Y：47 K：0）为辅色调

字体均采用楷体字体、仿宋字体、黑体.

（3）整体色彩都采用代表忧伤的颜色，以便烘托出“流年”这个主题，达到更好的视觉上的享受。

2.3 工作环境：

操作系统：Windows XP以上系统

制作工具：Photoshop CS5

2.4 浏览工具：

IE浏览器

三、个人网页功能模块设计（第一种方案）

3.1 空间动画

本页采用贴图的形式来展现整个动画，主体上以书为主，以图片为辅，书本上C’EST LA VIE（这就是生活）正在诉述着人生的种种，零零碎碎的照片，CRY，NEVER，LOST，BELONG，EVEN各种的心情，从不同角度展现生活的美，让用空间那种独特的方式向读者娓娓道来我的生活。

文本区：文字都运用华康隶书体，给人一种亲切感而又不失严肃。

色彩区：整页运用灰色（C：4 M：4 Y：4 K：4）为主，白色（C：0 M：0 Y：0 K：0）

赤褐色（C:：20 M:：30 Y：45 K：0）

黑色（C:：0 M:：0 Y：0 K：100）

朱红色(C:：32 M:：72 Y：85 K：29）为辅

3.2 主页

主页采用了左中下的框架结构，左上角的空间名称“流年”让人充分了解主题，字的旁边添加一些线条花加以点缀，显得生动活泼。在左侧的导航栏中的选项界面运用圆形的方式将其逐一展现出，并且均在每一张页面上能够得到显示，右侧的图片区放入一张小女孩对过去的怀念之情的手绘图。下边的导航栏中以新鲜事、相册、联系方式展现，相册中运用到了时间轴，照片在一定时间内可以飘过，这样增加了画面的跳跃感。在所有页面中都采用了简洁的样式，从而达到网页表现与内容分离的目的，让我能更好的设计网页的显示效果。

色彩区：

整体页面以黄绿色（C：9 M：0 Y：36 K：0）为主色调

橙色调（C：0 M：30 Y：70 K：0）为辅色调“流年”采用了方正隶二简体字体，48，严谨而不失大体，其色彩为朱红色(C:：32 M:：72 Y：85 K：29）。

“主页、日志、相册、音乐、资料、留言板”采用了华康少女文字，

简单14

以黄绿色（C：9 M：0 Y：36 K：0）为已打开页面，