第一篇:电子商务网页制作实训报告
一周的网站规划实训又结束了,在这短短的一周实训中,我们每一个学生都受益匪浅。时间过得真快呀,这也是这学期我们最后一次在学校里的实训,每一个同学都怀着饱满的热情,都在积极紧张的实训,我也一样,只是多了一种不舍得感觉,虽然我们在实训中也有些苦痛和烦恼,但是我会努力的克服自己所遇到的任何困难以及在老师热心的帮助下我们很快的解决了自己遇到的一些困难。
总的来说:我在实训中不仅学到了课本上面没有的知识,而且还学到了坚持不懈,不抛弃,不放弃的一种学习的精神。这次实训让我增长了很多关于网站制作的知识,也让我体会到了做网站并不是我想象中的那么简单。网页设计与制作综合实训是我们学习过程中重要的实践性学习环节。它是根据我们学习计划的要求,在老师的指导下对我们进行网页制作专业技能的训练,培养我们综合运用理论知识分析和解决实际问题的能力,实现由理论知识向操作技能的培养过程.因此加强实践学习环节,搞好实训教学,对实现我们专业的培养目标,提高我们的综合素质有着重要的作用。通过这次实训,我学到了很多有价值的东西。我独立的完成网站设计的全过程,把设计中散乱的网页链接成框架体系,使平时学到的知识点有了很高的提高,并且合理的在试验中进行了实践。在这次实验的过程中,我搜集了大量的素材和网页设计制作的知识,增加知识面,给我在以后的设计过程中能博采众长,制作出好的网页打下了基础。
通过短短几天的网站规划实训,我从中学到了很多的知识。每一个同学都在认认真真的实训,都在认真的做网页。尽管在实训中遇到了许多不少的问题,通过自己上网查阅资料和老师的耐心教导,我们每一个同学都解决了自己在实训中遇到的困难。有的同学还互相帮助和积极讨论遇到的问题,同样在学习的良好氛围之下解决了遇到的困难。在这次网站规划中,我们学到了课本上没有的知识,不仅开拓了我们的视野,而且增加了我们设计制作网站的能力。虽然实训也有些苦痛和烦恼,但是我们每一个人都怀着一颗学习的心,不怕困哪和苦痛,认真的完成了网站规划的实训。在网站规划中,我们熟悉了Frontpage软件的新型的功能,增加了对软件的认识和认知,学会了怎么做一个漂亮的网站和优美的布局。
我收获颇丰,学到了很多知识,特别是提高了综合分析应用的能力。实训过程是繁琐的,但同学们都表现得很积极,不怕课程难,相互帮助一起分析。任课老师也非常认真负责,耐心讲解,细心指导,一点一点解答同学们的疑惑,直到同学们理解了为止。在实训中,分析、讨论、演算,机房里充满了浓浓的学习气氛。此次实训培养了同学们耐心的工作作风,增强了同学们的合作意识,提高了大家的应用分析能力。
第二篇:网页制作实训报告
《网站设计与制作》实训报告
X学院XX班XXX号
一.实训时间:
2010年6月7日到2010年6月13日
二.实训地点:
XXX学院XXX班级
三.实训组员:
XXX、XXX
四.实训目标:
运用网页设计方法,设计一个网站,提高综合应用所学知识的能力,积累Web网站的制作经验,培养团队协作精神。本次实训的具体目标为:了解网站制作的一般流程;熟练使用网页制作工具Dreamweaver、Flash、Fireworks设计网页;能灵活运用表格、层和框架布局页面;熟练使用CSS样式表美化网页;正确使用JavaScript添加网页特效;灵活使用模板和库来制作网页;学会申请免费域名空间和正确上传站点的方法。
五.实训策划:
这一周,我们要进行《网站设计与制作》实训,我们认为做网站前最主要的是确定主题、框架和标题栏的设计。因此我们相互讨论之后,确定制作以“婚纱”为主题的“喜多坊时尚婚纱网”。在之后的资料收集和网页的框架的建设中,我们发现了许多问题,某些关键点无法做出心中的效果,这让我们有些遗憾。通过自身及组员的共同探索,我们已尽权利将以下是我们的策划内容:
1.确定主题。制作网页,首先是确定主题,冬天很冷,却冷得很幸福,刚刚过去的圣诞的热闹劲还在心头。于是我们从幸福出发,想到了结婚-婚纱,建立一个简单的介绍婚纱的网站并取名喜多坊时尚时尚婚纱,专业介绍一些喜多坊婚纱的特色等。我们本次间的网站基本以粉红为基点,粉红是可爱清纯的颜色,粉红代表着幸福温馨,所以本站以粉红为风格,让整个网站充满爱的力量。
2.设计主页。主页的设计是整个网站的灵魂,构思导航栏的分类,然后是整体规划,每一版块都有其个性的色彩,清晰明了,便于阅读浏览,我们构思大致
分几部分,首页,关于我们,婚纱礼服,量体裁衣,婚纱选购,公司门市,与我联系,在线论坛8大板块,每一板块又分几小部分,内容比较充分,多样。确定导航栏的各个分类标题之后对于建立二级子网尤为重要,我们运用Photoshop CS3技术来设计出导航栏,制作切片,建立导航栏,将整体的主页效果建立起来。
3.资料的搜集。主页的导航栏设计好后,接下来就是对主页导航栏的各个内容进行资料的收集,我们采用大量的资料收集再对资料进行塞选p图,得到最适合导航栏内容的资料。素材的选择,要符合网站的主题,图片的大小要符合模板的轮廓,我们将不符合模板的用Photoshop处理编辑,然后放入站点底下,进行图文的链接和排版。
4.各个子网页的建立。我们设计好模板后只要在可编辑区依次编辑所需资料就可,运用模板建立子网页少了很多工序,为我们节省大量的时间。尽管我们建立了模板,但我们在建立子网时很小心,因为一张图片的大小插入就有可能破坏整个模板的结构尤其在使用表格时,因此我们对所插入的图片和表格都得进行测量,做到不影响网站整体的美观。
5.实现网页间的链接。做好个格子网和首页后,接下来就是通过模板的链接,将整个网站中的网页链接起来,过程其实很简单,主要是把要链接的文字和图标选择在选择工具栏的链接按钮最后选择自己要链接的网页单击确定便可以了。做好这一步后,网站基本算是建好了。
6.向静态网页插入动态效果。在基本建好网页中的插入层和时间轴,制作其动态效果,让整个网页充满生机。我们在网上进行flash素材的收集,通过Flash CS3设计出主题下的风格动态效果。然后插入到静态网页中,使网页更加生动形象。
六.实训心得:
通过这周的学习实践,在老师的指导下以大量明晰的操作步骤和典型的应用实例,使我们真正对所学的软件融会贯通。我们结合年轻人心理制作了时尚婚纱网站,作为实训的成果。其内容是多样化的,制作网页用的软件是Deamweaver CS3软件。它提供了网页和表单的动态生成到网站的解决方案。主图是一个网页的门面,它能体现出这个网页的整体风格。
制作网页,首先是确定主题,经过再三考虑,就做了个关于婚纱的网站。考虑到,现在城市普遍幸福感不高,加上寒冬,于是以幸福为论点扩展想到了结婚,想到了婚纱,想到了未来的美好城市生活,城市让生活更美好,结婚让生活更完整婚纱让生活更多姿!想到这些,我们最后决定建立一个简单的介绍都市婚纱的网站,让这个冬天不再寒冷,让我们回忆起那些幸福的日子。于是网站主题确立。
然后是整体规划,每一版块都有其个性的色彩,清晰明了,便于阅读浏览,大致分几部分,首页,关于我们,婚纱礼服,量体裁衣,婚纱选购,公司门市,与我联系,在线论坛,每一部分又分几小部分,内容比较充分,多样。
再后是收集资料与素材,大量浏览相关网站,收集关于婚纱的图片,进行Photoshop CS3图片处理和排版,插入好的文章和图片等,还有参考一些好的网站的布局,特色,颜色搭配,背景图等。
再后是设计网页图片,用flash制作动画,用Photoshop制作静态图片。再后是建立站点,和制作网页了,使用dreamweaver制作。
首页内容精彩丰富,首页主要是导航作用。首页制作时,时刻考虑着网页的基本原则:统一,连贯,分割,对比及和谐的原则,内容统一,都是为了主题服务,一个网站强调的就是一个整体,只有围绕一个统一的目标所做的设计才是成功的;连贯,页面之间关系连贯,统成一体;每版内容都自成一体,颜色各异,便于浏览;整个网页有动有静,颜色不同,形成对比,不呆板,富有生气;颜色各异,但又不同之中又相同,浑然一体。
简洁实用: 这是非常重要的,网络特殊环境下,尽量以最高效率的方式将用户所要想得到的信息传送给他就是最好的,所以要去掉所有的冗余的东西。使用方便:同第一个是相一致的,满足使用者的要求,网页做得越适合使用,就越显示出其功能美;页面用色协调,布局符合形式美的要求: 布局有条理,充分利用美的形式,是网页富有可欣赏性,提高档次。当然雅俗共赏是人人都追求的。
利用我们所学的模板设计,制作更完美的页面。将动态网页与静态网页结合起来
再后,调试过程,好多次本来在Deamweaver CS3里好好的,把字调的好好的,位置很对,可在浏览器里御览就出毛病了,不是靠上了,就是靠下了,经过再三调试,整理,加了好多表格,终于满意了。
通过温本周的实训,发现自己还有很多的不足。框架的应用很难把握,切片也很难合理切割,当插入图片的时候把原有的模板给撑破了,精确定位很重要。
因为学艺不精,所以不会网页的代码设计,只能通过网络三剑客综合使用。不过也实践中也学到了很多知识,表格的嵌套是非常重要的,CSS样式的应用也很便捷。还有一些行为中的效果也是蛮不错的。所以这次实训还是很有意义的。
第三篇:电子商务网页设计实训报告
电子商务网页设计实训报告
网页设计或网页制作对于我们来说,多少会有点难度的,制作网页是很精力和时间的,毕竟要求比较高。要制作好一张好的网页得会熟练使用Photoshop,Flash,和用于制作网页的Dreamweaver软件。
Potoshop和Flash软件我们上个学期学了一点皮毛,或者说连皮毛也没能学好,原因或者是双向的。由于我Photoshop是我自学的,所以会好一点,处理图片相比较他人我会更擅长,但Flash却成了我的短板。一直都没花时间自学,连制作一个简单的小动画都成了问题。Dreamweaver是我们这个学期刚开的课,所以了解的也不是很多,对于网页制作我们只有过一次的经历。就是模仿乡村旅游网的首页来做一张网页。
对于这两周的实训我们做两张网页,并且要求学会分析电子商务网页模板,使用Dreamweaver和DIV+CSS的方法布局电子商务网页,掌握运用JavaScript控制电子商务网页行为的能力,这无疑对我们是个挑战。因为我对JavaScript语言根本不懂,毕竟我学的时间有限。
刚开始的时候,实训指导老师包金龙老师就让我们写好实训规划,并且要用坐标轴表示出来,每天需要做哪些东西,包括完成情况等,都得表示出来。
我的计划是:
第一天选好题目,并且做好网页规划;第二,三天用PS制作规划效果图; 第四天制作简单Flash和图片素材;第五天完成效果图制作; 第六七天完成Div布局,第七八天开始制作网页,剩余时间开始完善。开始的规划和实际的完成情况多少是有差距的,实际操作的时候制作的速度还是比较快的,所以完成的时间大大缩短了。
但是在做的过程中,还是有许许多多的疑问和不懂在里面。尤其在制作Flash的时候遇到的麻烦很多,毕竟我不会。还有就是网页的布局,老师让CSS+Div层加样式布局,但是我到现在都不明白是怎么回事,但是只沿着步骤走下去。
还有就是常遇到网页布局错位现象,以至于多次布局好的网页都因为错位问题而不得不重做,因为我的知识还没有达到,自由修改的程度,所以我的路还很长。我的网页已经做好了两张,并且也已经成功地做好了链接,但是老师却不允许用表格来制作网页。
还得必须从网上下载模板做,做的越像越好。我觉得为什么非得下载模板做,学生自己做的网页,那是自己智慧的产物,好歹也是自己的想法。只是初学者做的没那么专业罢了,但是你却因为这一点把别人的作品所否定。就算你的模板做的再好,这也是别人的东西,不是你的,也永远不会是你的。
有类似你这样的老师存在,中国教出的学生怎么可能会有创新的思想。现在都强调创新,但是学生有自己思想的时候,都被你们给扼杀了,思维定式的时候,却又强调创新。病态的教育。
虽说我很不愿意重新做,但你是实训的老师,做为学生还得按照你说法来做。我下载了一个新的模板,并且都有素材。沿着模板布局,插入Div标签。慢慢一步一步地做,由于我的网页大小和模板有出入,并不是和模板一样,所以我得把素材的大小用PS来完善一下。这样往网页里面插入的时候,就不会发生错位之类的事。
最终模板的样式,做好了,但是我制作了一张。内容页也就是链接的网页,我还是用自己做的网页。虽然我做的并不好,但再差也是我自己一步一步做出来的,所以我不会丢弃我自己的作品,来用模板代替。这对于我来说是不可能的。网页做好了。
由于提前做好了,所以时间充裕,这样就可以帮助他人了。还有就是网页设计大赛就要举行了,我们开始为大赛忙碌着。
第四篇:电子商务 网页制作报告
网页制作报告
网页要求:
1.分类显示(四类,每类六张图片)
2.倒计时自动显示
3.打折数据从文件中读取出来,并显示在相应位置
4.勾选所要的商品,提交后。把所选商品信息保存在一个文档(比如txt等等)中
5.需要的文件类型html、js、折扣文件、选中商品的文档、说明整个程序的文档
6.在网页中需要有类似下拉框选项的东西(针对四大类),当点击一个选项类的时候会在 当前位置显示该类。(类似于导航的)选用的软件:Adobe Dreamweaver CS5
制作过程:
1.确定好网页的标题,搜集素材资料
2.选定框架,确定页面的主要风格,字体颜色大小,背景图片,表格边框等。
table {text-align:center}
td {
width:400px}
div.float{float:right;
background:#00CCFF}
div.menu {font-family:Arial, Helvetica, sans-serif;
color:#000000;
background:#FFFFFF;
border:2px solid #999999;
width:10em}
div.menu:hover a {display:block}
div.menu.a {display:none;
border:2px solid #999999;
background:#FFFFFF;
color:#000000;
width:10em;
text-decoration:none}
div.menu a:hover {background-color:#FFFFFF}
A:link{text-decoration:none}
A:visited{text-decoration:none}
A:hover { color:#666666;text-decoration:none}
body {
background-color: #ffffff;
background-image: url(beijin.jpg);
}
3.对标题栏进行居中,字体大小颜色设置,对副标题进行滑动设置
4.对各类图片分类,分成四类并设置其格式
分类: