Vampire网页设计报告

《Vampire网页设计报告》由会员上传分享，免费在线阅读，更多相关内容在行业资料-天天文库。

1、网页设计报告设计标题：TheVampireAlliance(吸血鬼联盟)组员信息：组长：由扬信息10-5班07号组员：刘睿信息10-5班10号岳会敏信息10-4班22号常红蕊信息10-4班32号设计日期：2012年11月1日一、设计目的　　本学期我们学习了基于web标准的网页设计与制作课程，为了了解和熟练掌握网页设计的基础知识和实现技巧。根据老师课堂上的讲解，我们希望制作一个吸血鬼爱好者小型论坛并进行了初步的网页设计，按照要求，利用合适图文素材设计制作符合我们想法的主题网页的进入页与主页。在此次设计中，我们也更熟练的掌握了Dreamwe

2、aver8等软件的的操作和应用。增强动手实践能力。各组员配合，逐渐培养做一个完整项目的能力。二、设计题目TheVampireAlliance(吸血鬼联盟)三、组员分工组长：由扬：带领组员进行网站题材的讨论和敲定；搜集制作网站的素材工作；网站布局的设计工作；论文撰写工作（结构设计部分）；组员:刘睿：制作网站所需素材的搜集及筛选工作；网站制作前期功能模块构想工作；网站功能模块的划分工作；论文撰写（设计过程部分）；岳会敏：搜集制作网站的素材；网站布局的设计；网页中超级链接的设置工作；用户登录模块设计工作；论文整体修改工作；常红蕊：搜集制作网站

3、的素材及素材的剪裁处理工作；网站制作前期布局构想工作；论文整体修改工作。四、结构设计　　首先选定主题，确定题目之后，在做整个网站之前对网站进行需求分析。首先，做好需求调研。调研方式主要是上网查阅资料，在图书馆里翻阅相关书籍。　　然后，调研结束之后对整个网站进行功能描述，并对网站进行总体规划，接着逐步细化。　　我们选做的主题是论坛专题的主页，并且选定题目为“TheVampireAlliance（吸血鬼联盟）”，其目的是做一个简单的网站，介绍神秘的吸血鬼的传说等内容，提供一定的资讯信息。进行小组讨论之后，拟定网站整体站功能结构图如下：五、设

4、计过程（一）前期构思1、网站创意来源：由于我们对于吸血鬼这个话题都比较感兴趣，所以希望能够做一个这样的网站可以供更多的吸血鬼爱好者们共同分享一些有关吸血鬼的信息，例如图片、电影、甚至是一些有关吸血鬼的历史发展、传说等等信息，希望可以由此为爱好者们带来些许乐趣。2、网站功能模块分析：首先，该网站通过一个子网页的链接点击进入网站主页。第二，主页的适用对象分两类，第一类是非注册会员，他们拥有浏览主页上共享的部分资源，如图片、movie、books，以及论坛。第二类是会员用户，可以根据用户的等级限定其可以浏览的资源多少的权限，并且可以进入论坛进

5、行发帖回帖等动作。3、网站布局分析：首先网站的色调应该是符合吸血鬼这一话题的一个偏冷的具有神秘色彩的基调，于是我们分工在网上down了许多有关这方面的图片、字体等素材。第二，根据对网站的功能模块的分析，我们简单的区分了一下主页的模块布局，分别是：登录模块、网站介绍模块、网站应用模块（即起源、氏族、图片、影片、新闻、游戏等）、论坛模块（将不同的氏族分为讨论区，便于不同氏族爱好者的加入）。（二）同期设计1、建立布局我们组认为建立合理的布局是关键的步骤。以Dreamweaver8设计网页，对整体网页窗口进行划分区域，利用插入表格，将边框设为0

6、，这样就能够划分出透明边框的区域。点击页面属性设置添加相关图片作为背景图片。在设置背景图片之前要对相关图片进行表格大小以及图片尺寸进行处理，已达到预期要求。2、图片的各种属性设置首先选中插入的图片，单击鼠标右键，弹出一个快捷菜单，在菜单中选择“图片属性”菜单项，出现一个“图片属性”对话框，我们可以在对话框中对图片进行修改调试。在进入页中要将标志性文字至于图片之上，所以选择了设置图像环绕方式中的衬于文字下方方式完成，这样就可以使文字与图片显示效果更完整和谐。3、表格的拆分与合并在网页进行布局的时候，我们大部分使用表格对区域进行划分，其中就

7、涉及到单元格之间的拆分与合并问题，按住Shift键，分别选中要处理的单元格之后，在属性之中选择对其拆分或合并，从而达到预期区域划分目的。3、用户登录模块设计在表单中选择字段集添加至想要添加到的区域中，在字段集中添加文本字段和按钮，并在属性中将它们的值改为相应的内容。其中密码对应的文本字段的类型设置为密码型，这样在用户输入时就可以保证用户的密码安全性。5、设置超级链接选中图片或者文字，在下面的链接属性中输入所要连接到的地址，同时，下方的目标属性被激活，选择-blank设置成在新窗口中打开网页。我们在进入页中设置的链接为本站点的网页页面，即

8、主页，同时也在主页中连接了外网页面。六、网页截图【进入页截图】【主页截图】七、设计代码1、进入页代码：