徽州美食网站的设计毕业设计.docx
《徽州美食网站的设计毕业设计.docx》由会员分享,可在线阅读,更多相关《徽州美食网站的设计毕业设计.docx(33页珍藏版)》请在冰豆网上搜索。
徽州美食网站的设计毕业设计
毕业论文(设计)
论文题目:
徽州美食网站的设计
院(系部):
计算机科学技术系
专业名称:
计算机网络专业
研究方向:
网页网站
内容摘要……………………………………………………………………………3绪论……………………………………………………………………4
一、网页
(一)网页设计背景……………………………………………………………4
(二)网页设计概述……………………………………………………………5
二、设计语言及软件介绍
(一)HTML语言介绍……………………………………………………………5
(二)Dreamweaver介绍……………………………………………………………5
三、设计思路及步骤
(一)设计思想…………………………………………………………………6
(二)需求分析…………………………………………………………………6
(三)设计步骤…………………………………………………………………6
四、设计的实现
(一)网站主页面的设计…………………………………………………….18
(二)菜谱大全界面设计:
……………………………………………………21
(三)健康资讯界面设计:
………………………………………………………23
(四)健脑饮食界面设计:
………………………………………………………25
(五)美食团购界面设计:
………………………………………………………28
(六)食材百科界面设计:
………………………………………………………29
(七)母婴饮食界面设计………………………………………………………31
(八)美容饮食界面设计:
……………………………………………………32
结论展望…………………………………………………………………33
参考文献…………………………………………………………………………34
内容摘要
21世纪是一个信息化的时代。
随着网络信息的飞速发展,网络传媒以被越来越多的企业看好,而网站就是传媒很好的一种方式,目前有很多企业都在开发属于自己的网站,所以研究网站建设是很有必要的。
本文主要概述了建设一个网站的具体过程。
包括设计思路、设计步骤以及最后的设计实现。
有文本的应用、创建图像页面、使用CSS修饰网页、创建多媒体网页、利用表单对象创建表单文件、网页连接的应用、创建框架页面、使用javaScript行为创建动态效果、主要使用的设计语言是HTML。
本文还考虑到了软件工程在程序设计中的应用,软件工程认为软件开发与各种市场活动密切相关,所以编写软件时不能脱离软件的需求。
Dreamweaver也是本文研究的主要对象。
本文运用Dreamweaver和相应的网站开发软件,阐述了网站前后台设计,并对其功能进行了论述,实现了整个网站功能的使用。
通过对整个网站的设计,说明了在制作过程中遇到常见问题的解决方法。
【关键字】网络传媒 网站HTMLDreamweaver
绪论
---网页网站的应用
网页设计是近年来兴起的设计领域,是继报纸、广播、电视之后的又一全新的设计媒体。
随着计算机的广泛普及,计算机网络也得到了飞速的发展,如今的网络这个平台让人们感觉一切都越来越简单,也逐渐的越来越方面了,慢慢地随着互联网的猛速发展,人们的生活以及学习似乎离不开网络。
因为Internet这个大的平台是实现网络资源共享的资源库,那么根据它的发展历程与目前的应用情况和发展趋势,我们可以充分的相信网络技术将会极大的改善我们的生活和工作方式,甚至抽象的理解为可能连社会的价值观也会发生一定的变化。
比如说,在近来的网络猛速发展的过程中,越来越多的民间团体、企事业单位都纷纷的在网上自立门户,这其中最迫切想得到外界了解和认可的无疑是那些大小商家们,对他们而言,网络就像一座取之不尽用之不竭的天然宝藏,其中蕴藏着无穷的机遇与财富,而且不论是企业网站还是个人网站,各种大型的门户网站,都如雨后春笋般的层层的蓬勃发展壮大起来,这样一来就更进一步的使这样的互联网业呈现出绚烂多彩的发展局面。
我设计的毕业论文的题目是徽州美食网站的设计与实现,包括网站的概要设计,主要的功能模块,详细的功能以及详细的设计,最后是结论与展望,总结这次毕业设计的收获和心得。
一、网页
(一)网页设计背景
随着21世纪的到来,人们更深切地感受到计算机在生活和工作中的作用越来越重要,越来越多的职业需要具有计算机的应用技能。
掌握计算机是职业的需要,更是事业发展的需要。
网页设计与制作是计算机能力的具体表现,而一个网站也是一家企业不可缺少的一部分。
对于我们来说必须要掌握网页设计的相关知识
(二)网页设计概述
网站是企业向用户和网民提供信息(包括产品和服务)的一种方式,是企业开展电子商务的基础设施和信息平台,离开网站(或者只是利用第三方网站)去谈电子商务是不可能的。
企业的网址被称为“网络商标”,也是企业无形资产的组成部分,而网站是Internet上宣传和反应企业形象和文化的重要窗口
二、设计语言及软件介绍
(一)HTML语言介绍
超文本标记语言,即HTML(HypertextMarkupLanguage),是用于描述网页文档的一种标记语言。
是标准通用标记下的一个应用,也是一种规范,一种标准,它通过标记符号来标记要显示的网页中的各个部分。
网页文件本身是一种文本文件,通过在文本文件中添加标记符,可以告诉浏览器如何显示其中的内容(如:
文字如何处理,画面如何安排,图片如何显示等)。
浏览器按顺序阅读网页文件,然后根据标记符解释和显示其标记的内容,对书写出错的标记将不指出其错误,且不停止其解释执行过程,编制者只能通过显示效果来分析出错原因和出错部位。
(二)Dreamweaver介绍
Dreamweaver是一个可视化的网页设计和网站管理工具,支持最新的Web技术,包含HTML检查、HTML格式控制、HTML格式化选项、可视化网页设计、图像编辑、全局查找替换、全FTP功能、处理Flash和Shockwave等富媒体格式和动态HTML、基于团队的Web创作。
在编辑上你可以选择可视化方式或者你喜欢的源码编辑方式。
三、设计思路及步骤
(一)设计思想
1、网站内容要丰富齐全,需要包括一个主页面和七个子页面,子页面包括“菜谱大全”、“健康资讯”、“健脑饮食”、“美食团购”、“食材百科”、“母婴饮食”、“美容饮食”。
2、主页面采用DIV+CSS和表格混合设计,特效有横幅下拉特效,图片切换特效。
另外注册和登录采用数据库技术,可以简单实现,其他还有导航,超级链接,页脚设计等等。
3、子页面可以简单的采用表格制作,页面要整洁简单,一目了然。
用到的图片、素材要经过Photoshop的加工、改造。
4、登录页面和后台管理页面等等
(二)需求分析
通过市场、网上调查和自己对网页网站的建立理解,一个网站应该有以下内容的需要:
1、网站前台:
网站前台主要是用户浏览本商城网站所得到的一些信息,它包括:
网站首页,网站导航,网站公告,用户登录、注册,以及商品的搜索模块信息的显示功能。
前台模块的功能
网站公告:
用户对网站最新公告的了解
用户注册:
新用户注册
用户登录:
已注册用户登录网站浏览信息
2、网站后台
后台管理页面是商城管理员对整个网站的管理,其要求实现:
商城产品的管理,商城公告的管理等多个模块的功能。
(三)设计步骤
网站设计的步骤如下:
1、需求分析:
根据实际需要设计相关功能模块,并根据此分析给出合理的、满足要求的设计思路。
2、收集材料:
收集网站可能用到的图片、文字等等,从图书、报纸、光盘、多媒体上得来,也从互联网上搜集。
3、设计效果图:
利用了photoshop工具等使用图像处理软件设计出最终效果图,根据需要进行修改,直到满意为止。
4、网站具体建设:
设计视图中设计Web页面外观,设置控件的相关属性。
5、调试、优化和发布网站。
四、设计的实现
(一)网站主页面的设计:
主页面重点制作和设计,包括LOGO,横幅,网站导航,首页分导航、超级链接、FLASH+JS图片切换,页脚设计等。
设计效果如下:
主要源代码:
无标题文档
--
body,td,th{
color:
#000000;
font-size:
12px;
}
.STYLE4{color:
#666666}
.STYLE9{font-size:
24px;color:
#FFFFFF;}
a:
link{
text-decoration:
none;
color:
#FF00FF;
}
a:
visited{
text-decoration:
none;
}
a:
hover{
text-decoration:
none;
}
a:
active{
text-decoration:
none;
}
.STYLE10{font-size:
18px}
.STYLE11{
font-size:
14px;
color:
#000000;
}
.STYLE12{color:
#CC00CC}
.STYLE14{color:
#666666;font-size:
12px;}
.STYLE16{font-size:
12}
.STYLE17{font-size:
12px}
.STYLE18{font-size:
16px}
.STYLE19{color:
#0066CC}
.STYLE20{color:
#00FF00}
.STYLE22{font-size:
16px;color:
#666666;}
.STYLE23{font-size:
18px;color:
#0066CC;}
.STYLE24{font-size:
16px;color:
#00FF00;}
.STYLE25{
color:
#990099;
font-size:
18px;
font-weight:
bold;
}
.STYLE27{
font-size:
18px;
color:
#9900FF;
font-weight:
bold;
}
.STYLE30{font-size:
24px;color:
#000000;}
.STYLE33{color:
#333333;font-size:
24px;}
body{
background-color:
#FFFFCC;
}
#Layer1{
position:
absolute;
width:
200px;
height:
115px;
z-index:
1;
top:
141px;
visibility:
hidden;
}
.STYLE36{
font-size:
18px;
color:
#00FFFF;
font-weight:
bold;
}
.STYLE39{
color:
#9933CC;
font-weight:
bold;
}
#Layer2{
position:
absolute;
width:
200px;
height:
96px;
z-index:
2;
top:
139px;
visibility:
hidden;
}
#Layer3{
position:
absolute;
width:
200px;
height:
64px;
z-index:
3;
top:
144px;
visibility:
hidden;
}
.STYLE41{font-size:
36px;font-weight:
bold;color:
#CC6633;}
.STYLE42{font-family:
"CourierNew",Courier,monospace}
-->
--
functionMM_findObj(n,d){//v4.01
varp,i,x;if(!
d)d=document;if((p=n.indexOf("?
"))>0&&parent.frames.length){
d=parent.frames[n.substring(p+1)].document;n=n.substring(0,p);}
if(!
(x=d[n])&&d.all)x=d.all[n];for(i=0;!
x&&ifor(i=0;!
x&&d.layers&&iif(!
x&&d.getElementById)x=d.getElementById(n);returnx;
}
functionMM_showHideLayers(){//v6.0
vari,p,v,obj,args=MM_showHideLayers.arguments;
for(i=0;i<(args.length-2);i+=3)if((obj=MM_findObj(args[i]))!
=null){v=args[i+2];
if(obj.style){obj=obj.style;v=(v=='show')?
'visible':
(v=='hide')?
'hidden':
v;}
obj.visibility=v;}
}
//-->
|
|
返回首页
('');">设成首页
意见反馈
|
徽州美食网站
首页
|
家常菜谱
|
美容菜谱
|
营养搭配菜谱
|