1、个人网页设计说明书目录一、网页设计目的1.1网页设计需求探讨……………………………………………21.2个人网页设计理念……………………………………………21.3制做背景………………………………………………………21.4术语定义………………………………………………………2二、网页设计以及浏览工具2.1网页设计说明…………………………………………………32.2色调方案………………………………………………………32.3工作环境………………………………………………………32.4浏览工具………………………………………………………3三、个人网页功能模块设计3.1空间动漫………………………………………………………43.2主页……………………………………………………………53.3日志……………………………………………………………73.4日志简介………………………………………………………83.5相册界面………………………………………………………93.6相册展示………………………………………………………103.7音乐……………………………………………………………113.8音乐列表………………………………。
2、………………………123.9个人资料………………………………………………………133.10留言板…………………………………………………………14四、总结4.1技术总结………………………………………………………154.2个人心得总结…………………………………………………15附加:第二种网页设计图一、网页设计目的1.1网页设计需求探讨:随着网路技术以及网页制做技术方面的日渐成熟人们越来越关注网页的美观性,所以当下网页制做的一个最主要的出发点就是网页的美观和可操作性。在抒发一些理念方面东西的时侯能愈发的形象化与多元化。就全球上网的人数来说,有好多的人正通过个人空间来改变她们的生活形式,同时中学生也学习到了各个方面不同的知识,人们通过自己的文字来传递着不同的信息。作为一个发展迅速的网路空间,个人空间向我们透漏着这个信息传递和情感的平台将影响接出来的几代人.1.2个人网页设计理念:本次结业设计目的就是做一个属于自己的主页,通过一些信息来抒发自己的一些思想与观点,还有就是一些个人对于生活的一些心得感受,再其中加入个性化的元素能表现自己符合自己性格的色调搭配与文字图画以及音频,其实也是对过去的眷恋,故。
3、空间名起名为流年,给人一种怀旧的觉得。1.3制做背景a.网站项目的名称:个人空间b.用户:普通的用户1.4术语定义个人空间:就是一个网页,它一般是由简略且时常更新的信息所构成。这种张贴的文章都依照年份和日期降序排列,也就是最新的置于最里面,最旧的在最下边。不同的内容和目的有很大的不同,从对网路资源的整理与评论,到有关公司、个人的设想,从新闻、照片到日记、诗歌、散文,甚至悬疑小说都应有尽有。二、网页设计说明以及浏览工具2.1网页设计说明(1)名称:流年(2)性质:个人空间(3)主要内容:这是一个以个人空间为主题的网页设计,所包括的页面开场动漫、主页、日志、相册、音乐、资料、留言板等。(4)版式:左侧为导航区,右侧为展示区。(5)风格:主调请亲而不失情调,色调清新,版面开朗风趣。2.2字体、色彩方案为了个人空间网页设计才能更好投入到实际操作中,特此打算了两种方案。(1)一种为淡暗色系黄红色(C:9M:0Y:36K:0)为主色彩白色调(C:0M:30Y:70K:0)为辅色彩朱褐色(C::32M::72Y:85K:29)为辅色彩字体均采用华康少女字体、华康采风字体、华康娃娃体。(2)一种为清蓝。
4、色系(备选方案)淡黄色(C:9M:0Y:36K:0)为主色彩粉蓝色(C:7M:33Y:0K:0)为辅色彩桔红色(C:0M:36Y:47K:0)为辅色彩字体均采用宋体字体、仿宋字体、黑体.(3)整体色调都采用代表忧愁的颜色,便于衬托出“流年”这个主题,达到更好的视觉上的享受。2.3工作环境:操作系统:WindowsXP以上系统制做工具:PhotoshopCS52.4浏览工具:IE浏览器三、个人网页功能模块设计(第一种方案)3.1空间动漫本页采用贴图的方式来诠释整个动漫,主体上以书为主,以图片为辅,书本上C’ESTLAVIE(这就是生活)正在诉述着人生的种种,零零碎碎的相片,CRY,NEVER,LOST,BELONG,EVEN各类的心情,从不同角度诠释生活的美,让用空间那个奇特的形式向读者娓娓道来我的生活。文本区:文字都运用华康草书体,给人一种亲切感而又不失严肃。色调区:整页运用蓝色(C:4M:4Y:4K:4)为主,蓝色(C:0M:0Y:0K:0)赤红色(C::20M::30Y:45K:0)红色(C::0M::0Y:0K:100)朱褐色(C::32M::72Y:85K:29)为辅3.2主页。
5、主页采用了左中下的框架结构,左上角的空间名称“流年”让人充分了解主题,字的门口添加一些腰线花加以映衬,变得生动开朗。在右边的导航栏中的选项界面运用矩形的方法将其逐一诠释出,但是均在每一张页面上就能得到显示,两侧的图片区装入一张小男孩对过去的追忆之情的手绘图。底下的导航栏中以新鲜事、相册、联系方法诠释,相册中运用到了时间轴,相片在一定时间内可以飘过,这样降低了画面的跳跃感。在所有页面中都采用了简约的款式,进而达到网页表现与内容分离的目的,让我能更好的设计网页的显示疗效。色调区:整体页面以黄红色(C:9M:0Y:36K:0)为主色彩白色调(C:0M:30Y:70K:0)为辅色彩“流年”采用了方正隶二繁体字体,48,严谨而不失大体,其色调为朱褐色(C::32M::72Y:85K:29)。“主页、日志、相册、音乐、资料、留言板”采用了华康少女文字,简单14以黄红色(C:9M:0Y:36K:0)为已打开页面,黑色调(C:0M:30Y:70K:0)为未打开页面“新鲜事、相册”采用了华康流线体,流畅14,以(C:0M:55Y:74K:0)下方的日志排列采用了方正隶变繁体,9.5,以蓝色(C:0M:0。
6、Y:0K:100),以及联系方法采用了华康少女字体,10,以橙红色(C:0M:55Y:74K:0),粉蓝色(C:0M:30Y:37K:0)。3.3日志个人日志中仅仅是一个日志列表的显示,我所做的就是用传统的款式让日志诠释下来,根据日期来排列,但是标明一些日志是最新的,整个日志列表有日期、标题、浏览量以及横线、翻页栏来组成。同时将个人的联系方法放在了左下角,便于访客可以及时和我联系。日志列表的最上角的运用了三张相片和一张信封、一杯奶茶,希望访客才能在尝尝奶茶的同时来享受这种所带来的打动。右上角的灰色的SPINGTHESTORY粘贴在墨迹上,如同在述说着那些故事的深远,而且与右下角的山水图对应。色调区:黄红色(C:9M:0Y:36K:0)为主色彩白色调(C:0M:30Y:70K:0)为辅色彩“日期、标题、浏览量”采用了Adobe斜体std,12,蓝色(C:0M:0Y:0K:100)。日志列表中的日期、浏览量,采用了Arialz字体,而日志名采用了方正隶变字体,统一大小9.5,蓝色(C:57M:49Y:48K:15)3.4日志简介在日志简介中我采用了最简约的排版,文本区我插入了FATE/ZE。