网页制作实习报告Word文档下载推荐.docx

网页制作实习报告Word文档下载推荐.docx

《网页制作实习报告Word文档下载推荐.docx》由会员分享，可在线阅读，更多相关《网页制作实习报告Word文档下载推荐.docx（29页珍藏版）》请在冰豆网上搜索。

实习时间：

2011-6-272011-7-15

实习地点：

机电大楼

目录

一.作品主题3

二.作品简介3

三.素材准备3

四.总体规划4

五.设计步骤及设计效果4

1.创建站点4

2.制作模版4

3.主页制作12

4.制作子页面13

1）.shuffle子页面13

2）.nano子页面17

3）.classic子页面20

4）.touch子页面21

5）.iPod历史子页面22

6）.玩转iPod子页面24

7）.iPod配件子页面26

8）.iTunes子页面28

六.细节改进30

七.实习心得30

八.附录31

一.作品主题

MyiPod——诠释音乐精灵iPod的魅力

二.作品简介

生命中最美好的事物都离不开音乐，邂逅iPod聆听最真实的声音。

iPod第一代的推出就引起了轰动，它不但漂亮，而且拥有独特和人性化的操作方式以及巨大的容量，iPod为MP3播放器带来了全新的思路，此后市场上类似的产品层出不穷，但iPod依然因为它的独特风格而一直受到追捧，iPod使用的设计在当时算是相当先进的。

在音乐盛行的时代，iPod的音乐旋风将愈刮愈烈。

iPodtouch也是随时随地学习的理想工具。

别看它们身材小巧，却可将数千款应用程序和无限的可能性装进你的口袋。

现在网络上系统的介绍iPod的网站还很少，为了让更多的人了解iPod,爱上iPod，走进iPod，本小组决定在本次的实训中做一个系统介绍iPod系列产品的网站，以服务于众多喜爱iPod的朋友。

三.素材准备

明确了网站的主题以后，本组成员就要围绕主题开始搜集材料了。

常言道：

“巧妇难为无米之炊”。

要想让自己的网站有血有肉，能够吸引住用户，就要尽量搜集素材，搜集的素材越多，以后制作网站就越轻松。

素材既可以从图书、报纸、光盘、多媒体上得来，也可以从互联网上搜集。

把搜集的材料去粗取精，去伪存真，作为自己制作网页的素材。

另外，还要使用PhotoShop、Flash、Fireworks等工具，进行图像的处理、美化，以及flash的制作。

四.总体规划

素材收集好后，相关工具也准备好了，下面就需要按照规划一步步地把自己的想法变成现实了，这是一个复杂而细致的过程，一定要按照先大后小、先简单后复杂来进行制作。

所谓先大后小，就是说在制作网页时，先把大的结构设计好，然后再逐步完善小的结构设计。

所谓先简单后复杂，就是先设计出简单的内容，然后再设计复杂的内容，以便出现问题时好修改。

在制作网页时要多灵活运用模板，这样可以大大提高制作效率。

网页主要使用DIV+CSS来制作。

五.设计步骤及设计效果

1.创建站点

首先在本地机上建立一个文件夹，命名为“邓有强组”，并且将素材文件放在站点中。

单击菜单栏中的【站点】-【新建站点】-【站点名称】为“colin”，本地文件夹为“邓有强”。

2.制作模版

2.1【新建HTML文档】，并将文件保存在本地站点根文件下，命名为“index.html”。

2.2首先在【CSS样式】的属性栏上点击

。

新建CSS类如图：

设置其相关属性，如图：

在这次的制作中，共使用了如下的类

2.3创建好CSS类之后，在设计区域中插入一个DIV标签，并对其进行相关设置，如图：

2.4在主DIV标签插入之后，现在在主DIV标签中插入一个名为“headerzone”的子标签，

设置其属性，如图：

2.5插入导航条，在headerzone的下面插入一个名为“topmenu”的DIV标签，如图：

设置其背景颜色为：

#626262

2.6在.topmenu下面，插入.banner标签：

2.7在.banner的下面再插入一个DIV标签，命名为“.workZone”，如图：

2.8在.workZone中插入一个子标签，命名为“.leftBox”，如图：

并设置其属性，如图：

2.9在leftBox的右边插入一个新的DIV标签，命名为“workZoneRight”,如图：

2.10在workZone的下面插入DIV标签，命名为“footer”，

2.11输入相关的文字、图片及flash元素，生成模板并保存

3.主页制作

3.1.将模板套用到主页上

3.2在页面中加入相关的文字、图片及flash元素，主页即已完成。

效果图如下：

4.制作子页面

1）.shuffle子页面

1.1.套用模板到页面

1.2.将模板从页面中分离出来，方便编辑子页面

1.3新建一个css样式，命名为"

rightbox2"

设置rightbox2里面的属性

1.4插入一个div标签用来作为shuffle产品简介的容器

1.5插入shuffle产品的相关信息

1.6网页整体效果图：

2）.nano子页面

编辑div标签里面的内容

页面整体效果图：

3）.classic子页面

插入classic产品的相关信息：

网页整体效果图：

4）.touch子页面

编辑div标签里面的内容：

5）.iPod历史子页面

6）.玩转iPod子页面

7）.iPod配件子页面

8）.iTunes子页面

六.细节改进

由于对网页制作还不是非常的精通，所以在制作的过程中，会产生一些细节上的问题，比如在用布局时，很容易出现细小的缝隙，很难将这些细小的缝隙处理掉。

七.实习心得

网页设计跟学习别的东西一样，也需要兴趣，所谓的兴趣也不是三分钟热度，是一种执著。

学习网页设计需要耐心，如果没有耐心，就无法学好网页设计，因为当你遇到一个问题时，如果不能立刻得到问题的答案，可能就需要很长时间去解决，我就碰到过一个问题，用了很长时间才解决。

学习网页设计需要坚持，坚持不断的学习，因为设计网页的软件在不断的更新，因此我们要不断的学习。

并且我认为网页设计应该注重实用性，因为它是让人浏览的，是用户可以抚摸，可以评论，可以交互的。

因此我提倡简单的美。

网页的布局通常指的是网页的整体架构，说的通俗一点就是排版。

如何突出最重要的内容，即让用户第一眼就看到这个网页所想要传达的信息。

这一点至关重要。

在大多数做的比较成功的网页中，一个共同的特点就是网页的整体架构十分的清晰明了，便于用户浏览

网页布局是主要考虑以下几点：

1、首先要考虑整个网页的长和宽，以及长度和宽度之间的比例。

2、其次就应该考虑导航条的设置了。

3、正文的框架设置（横向因素和纵向因素交错）

不要过于注重色彩的灿烂，只要简单就行。

我们最终追求的主要是实用价值。

通过这次实习，在制作时想想使自己的网页更加丰富多彩，在网页中插入图象，动画，动态特效。

可是总遇到这样那样的问题，但在同学的帮助和自己摸索的情况下完成了这个实习的成果。

看到了一些知名的网站开发出的网页，不仅栏目内容丰富，信息量大，而且页面图文并茂，五彩缤纷，使得网民赞叹不已，流连忘返。

以我们的经验，当前的软件的功能日趋复杂，不学到一定的深度和广度是难以在实际工作中应付自如的。

因此反映出学习的还不够，缺点疏漏。

虚在加以刻苦钻研及学习，不断开拓视野，增强自己的实践操作技能，为以后能做出出色的网页而努力。

近三个星期的实训结束了，其中的酸甜苦辣我会在今后的日子里不断地去咀嚼、回味。

从制作网页过程中，我学到了新的美化网页的方法，运用了更多以前未运用的技巧。

这使我学到了更多的知识，并且为我自己在制作网页这方面积累了一些经验。

这些将是我人生中的一次重要的经历，将是我今后走上社会后的一笔巨大的财富。

这次实习的收获对我来说有不少，我自己感觉在知识、技能等方面都有了不少的收获。

总体来说这次是对我的综合素质的培养，锻炼和提高。

八.附录

教师评语：

教师：

成绩：

时间：