《摄影网站设计说明书.docx》由会员分享，可在线阅读，更多相关《摄影网站设计说明书.docx（15页珍藏版）》请在三一办公上搜索。
1、WEB编程基础网站开发设计说明书设计题目：摄影网站名：学 号：班 级： 10微高指导教师：完成日期：2011-12-12目录前言-2 -一、网站的规划-2 -1.1网站的整体规划-2 -1.1.1 网站定位-2 -1.1.2网站版块的设置-3 -1.1.3网站设计的相关技术-3 -1.2网站的功能设计-3 -1.2.1 首页功能-3 -1.2.2副页功能-3 -二、网站的设计与制作-4 -2.1首页布局设计的特点-4 -2.1.1 logo 设计-5 -2.1.2 Banner 的设计-5 -2.1.3 导航的设计-6 -2.1.4 栏目设计-6 -2.1.5风格与色彩单配-8 -2.2副页布
2、局设计特点-8 -三、创新亮点-9 -3.1按钮点击图片的轮换-9 -3.2图片的自动轮换-10 -四、总结-11 -瞬间beautiful 摄影设计说明书 Cl 、 前言随着社会的高速发展，摄影已经很平常的走进广大的群众中，平时我们大家可以用手机拍摄一些自己身边发生的事情，摄影不在是人们的奢侈享受。但是随着科技的快速发展，拍摄工具一代代的被淘汰，现在出现了许多的高级拍摄产品，虽然产品比较高级，没有高深的技术，同样不会有好的拍摄作品，为了更好的给摄影界留下发展的一片天地，让更多的朋友能够有一张自己满意的回忆，同时宣传摄影，我公司为瞬间beautiful摄影公司提供宣传活动，为该公司制作了一套宣
3、传网站，为广大群众提供参考。一、网站的规划1.1网站的整体规划瞬间beautiful网站是为了宣传瞬间beautiful摄影公司而设立的网站，我们网站了了宣传瞬间beautiful摄影公司的知名度，宣传公司的精神，以吸引更多的群众来我公司做业务。我们网站设计版块主要分为七个：首页，作品赏，影棚实景，影楼简介，联系我们，vip会员专区，客户评价。1.1.1网站定位1：扩大瞬间beautiful公司的知名度，打造自己的品牌。2：加强与其他公司的业务来往。3：为努力拍摄出优秀的照片而拼搏奋斗。4：是公司成为最专业的摄影公司。1.1.2网站版块的设置网站版块的设置：网站主要分为七大版块，它们是首页，作
4、品赏，影棚实景， 影楼简介，联系我们，vip会员专区，客户评价。其中作品赏中有些小版块，这些版 块构成了整个网页的布局，以便条理清晰的展示给观众以更详细的展示。1.1.3网站设计的相关技术1：网站整体布局设计采用Dreamweaver软件设计的框架布局，采用了 div+css 进行网站的设计，还采用了 js代码的运用。2：在图片设计采用Fireworks和photoshop cs3加工和处理图片。3：在动态上有由flash软件功能的嵌入。1.2网站的功能设计我们瞬间beautiful网站的功能主要是将我们公司的品牌打出去，提高我们公司 的知名度，以吸引更多的客户与我们进行洽谈合作！1.2.1首
5、页功能1：通过首页，我们想让你了解我们公司网站的主要内容，通过主要版块设置初 步对我们公司的结果有所了解，通过首页的设计，我们还希望你能对我们公司的创 意设计有所肯定。2：首页让浏览者更加方便快捷的了解熟悉我们的公司。3：通过首页，将大体的公司情况一目了然的展示给浏览者。1.2.2副页功能1：通过副页将网站内容更加条理化、更加详细、更加方便的展现给浏览者。2：副页中将每个版块的内容具体化、深入化、详细化。让感兴趣的浏览者详细 了解了我们公司。3：副页在展示具体内容的同时，能让浏览者更加深入了解我们公司的一切相关内容。4：可以方便浏览者及时快捷的与我们公司取得联系，可以通过多种联系方式。二、网站
6、的设计与制作2.1首页布局设计的特点1：首页主要采用“T”字型的布局每个版块有序排放，将所有的版块清晰的罗 列出来。2：采用“T”字型可以解决了浏览者观看是产生视觉上的疲劳，并且有种赏心 悦目的感觉。2-1网站首页布局图陆注册登公司的名称1页孑 作品赏影棚实景影楼简介联系我们Vip会员专区户价客评流动欢迎词（您好！欢迎来到瞬间beautiful）搜索相关的内容搜索引擎我们展示的照片欣赏按钮轮换照片最新动态Vip会员在专区优秀作品展示最新动态套餐介绍友情链接2.1.1 logo 设计BEAUTIFULm _M_U3我们公司的logo是英语单词beautiful,也许会有人对我们不理解，我们之所以
7、 将它作为logo，就是象征现在我们的年轻，我们的魅力，我们是有追求的。2.1.2 Banner 的设计瞬间 BEAUTIFUL主砒料手冬才是耘！生凿电谴，算才呈血！网站的banner采用黑色的背景，渲染了我们摄影社的神秘，给浏览者留下深刻 的印象，更加吸引了浏览者对我们网站的兴趣，我们公司的设计是公司名与logo相 结合在一起，象征着我们公司的有挑战新事物的追求，然后紧跟着的使我们的公司 摄影口号，只有瞬间才会给你们想要的。2.1.3导航的设计首页m影棚实景影楼简介联系我们VIP会员专区客人评价导航设计上采用七个长方块，利用无序排列的方式，展示了我们服务项目, 向浏览者介绍我们公司的大体情况
8、。设计的代码：lixa Me氐”秋亩页Oax/l心作品赏lixa. Mef/昌瑚实景FtndExl.htmT1 点痢实易二ax/linlixa href=S简介.ht皿11点燃简介/ax/l讣 系疏 ITkexjl。vip员专区侑x/lilixa href二喀HlWiiMfex.mil”帝人许布css：3如;小馈?:k; m: t-：i8a! w上血n; uppem :li: fja: left; hp: uilitie上艺出娜;iw顶眦二 岭加郸俪祯网商混直帼rifht D;： ttaranlli i(lost: left tsp;；: inline tert-toistion:m colo
9、r:KM 厕恤:0 血0加 tiaitiw ul li i:tor 三E概3i篇岫il皿:2.1.4 栏目设计我们公司的栏目设计主要包括六个模块，主要有最新动态、vip会员专区、 最新动态、优秀作品、套餐介绍、图片欣赏，还有一些小的栏目框等。下面为设计 表现图：图 2-1-4 (1)户外写生灰色爱情可爱宝宝跚11”?(M 1-12-1跚 1121最新动态最绑雾特伸套程处摘更篇喉！孙1-S1R格If.便至蕙牖技林才2011-ISl-1踱;.法项职瞟技衣媚苞未应割J瞰携2011-12-1蜀-N剧号冬圭棒谖2011-1ii寒部旌季，为了娜嗓下温的 耽，却推够手温翳动，阀1 瞰温度翼馅儿重给菇群懿潟就
10、皆、券悴寄懿勰唱父黝猊惫父母为丁翁好迭-演却L重赛可是泼:液点野J 崖源二朝斜箜妄宝强百天君-总溥抵度家里担郭M脂谜施上5 矿雇主您比剧K，岗.阿 以帝斌嗦况折有曲困法专们昱温.腕Ti移经箜，为枝立特仅.伏寅的 备绐儡rm藉修滞曲！婚纱套餐游瞬湘曲岫淄有洛制版因为的:躲醐翱爵翌豁、 甘祁滋F也项轴百区LA砌脂娜卷工帷日就，千万歹剩夫花 丸勒广M：衰岷袤慈汗蒙蔽*倒壤族星其麝昶铜蔬帽务耕， 够街堀顶岭去谢眺-乱斜野唱看片，再找-八我融 实抵挪昌瑜最源凿品f-个糊愁果生活套餐梅疑为-H艺为物是天白于生吝生舌辨毓是返于宴.戒豌白藻瞬 电生罟醐疥导柬既命性即津卖麻嗥K戛祠己圭有田更意必而目滓有-丸修顽
11、酬目:犍寄E己的转：命刃必M躲瞬辑脂，在工帙剥要浙熊、学习野、精瓣各种港枝3,氏且，不会髀巨生舌习生、书耳瞭奸了建字堂线朋现实生活言盅睛咨遍寺言序弥导塌哥南京婚纱骡影 谕唾网北京融地捞赛郑m播坎噎影北京婚纱撮寄福七席纺接黑三亚翻房 裸圳摧多摄影 疝龄斐 上海畛暖:：晾畛匿 M址 诵：翩图 2-1-4 (2)设计栏目的设计，充分展示我们公司的主要情况，给浏览者一种大气的风范， 一目了然，简单易懂感觉，有一种想欣赏的感受，充分体现了一种美的享受等。2.1.5风格与色彩单配我们公司网站首页以灰色为背景颜色，这样显得公司深沉稳重，脚踏实地。然 后又将一些青春活力的照片加入其中，显现我们公司的朝气蓬勃，
12、积极进取的创新 的精神。2.2副页布局设计特点1：副页采用了简单框架的布局方式，向浏览者简单大方的展示了我们网站的情 况。2：版块有条理性，看起来很轻松，赏心悦目。3：更加有力的向浏览者寻找到自己想要的信息。2-2网站的副页布局图副页的名称摄影的赏析影图欣赏关于一些摄影摄影套餐的报价介绍联系方式友情链接副页向浏览者展示我们网站的首页内容的详细情况，让浏览者更加具体的了解我们公司的情况， 同时让我们公司的网站更加的完善化，整体化。三、创新亮点3.1按钮点击图片的轮换爱情故事生命滤可毋，爱情价更高!轮换图片通过图片的轮换更加衬托了我们网站的技术强大，通过技术手段更加证明我们的实 力是不可战胜的，让
13、更多的广大顾客朋友认同我们公司的强大，能够更加的信任我们， 只有我们才能给他们带来自己需求的东西。3.2图片的自动轮换Js+div：stable width=n1022nal igri=n center11 cellpaddingOir callspai：i3g=n!ld3 Glass=pdc Tar三 l;va.T 出:eEtsjk 三 5;tot bESj：t - 0;funDtioD inTogglE(Kvar :ieax = tTffNFr3ir t l;ifnezz jUtwEraine - 也xltaiK；ext = 1;Lif bStart = DHMtart = 1; aetT
14、iiecutf falosjle|r. 20C：i;return; JeLgejorraiiaCaDtHiaer.filterg0.Apply0 ;dccLEKt.3iijf3 rQDRr-&EMt-display 三 nn?dncu3KD.Euagea1tKowZiELK.stlediaplay RDjCD：n;arrnMCQDCEsi3erBiiltei3 0 - Piny(du-ntioc-Z) ?if pFswFifii: + HszTru:) 血vEua快=IMeLgejUDvFraire-bjU aetiinfoitCMcgaled eOOC-J ; fnloj-jle (1 ;
15、i/div/td./tablai自动图片轮换总结通过这个学期的学习，我学会了制作网页，而且知道了知识的重要性。网站设计是 一种非常难做但是又非常有意思的工作，我们可以任意发挥我们的创意，让我们飞翔在 自由创意的国度里，但做网页也要谨慎小心，要一丝不苟。在这次网站制作中让我对 Dreamweaver、Fireworks、Flash进一步了解，还懂得了许多的知识。尽管如此，但是 我的网页还存在着一些问题，如颜色的搭配不是很好，框架的结构，可能还有其他一些 我没有发现的问题，这些问题都是需要注意的，我相信通过学习与老师的悉心教导，下 一次的网页我将会做得更好。不足之处，希望老师指导与批评。信息工程学
16、院WEB编程基础实践环节考核报告单2011-2012学年度第一学期期末排课编号：(2011-2012-1)-0501301-01050-1 批阅日期：2011 年 12 月 17 日姓名李家东班级 10微高学号20101080114评分标准及得分评分标准满分得分简介：概况清晰，目标明确。5总体需求明确，结合实际，分析详细具体全面。10网站架构合理，有结构图。5网站效果图设计符合主流审美观点，色彩搭配合理。10网站风格一致，运用模板生成相关页面。5项目开发符合Web网站开发标准，表现与内容分离。10导航链接准确，贝面切换简洁流畅。5编码规范，可读性强。5网站目录结构清晰，层次分明，命名规范5网站主题明确，网站内容丰富且紧紧围绕主题，实用性 强15网站项目后期测试完整，网站浏览无明显错误。5有创新点，能对所做的主要工作进行正确评价和总结。5文本格式正确5对JQuery技术的应用10合计100考 核 成 绩任课教师 签名
