Marvel电影宇宙网站的设计与实现

摘  要：在IT行业迅速发展的今天，电影网站的建立已经成为电影发展必不可少的趋势。本设计将建立一个以科普类型为目的的网站，将专注于针对Marvel电影宇宙中超级英雄电影的宣传、科普与推广，让更多的网友能通过互联网了解、关注、支持Marvel电影以及Marvel电影事业的发展。  

本网站制作并实现了一个电影网站的设计。在“Marvel电影宇宙网站”的设计过程中使用了HTML、DIV+CSS、java script等开发工具，开发软件为Dreamweaver CS4、Photoshop CS4、Notepad++和科讯等。通过对“Marvel电影宇宙网站”的需求分析、总体设计、详细设计和测试，最终完成了首页、各分类页、详情展示页、注册页、登录页等，完成了“Marvel电影宇宙网站”的前台设计。

关键词：DIV+CSS  电影网站设计  Marvel电影宇宙

目 录

1 引言 1

1.1 Marvel电影宇宙网站的开发背景 1

1.2 Marvel电影宇宙网站的设计意义与设计目的 1

2 开发工具及环境介绍 3

2.1 Marvel电影宇宙网站的开发环境 3

2.2 本项目应用的主要开发工具 3

2.2.1 KesionCMS ASP管理系统 4

2.2.2 Adobe Photoshop CS4 4

2.2.3 Adobe Dreamweaver CS4 5

2.2.4 Notepad++文本编辑器 5

2.2.5 Microsoft Office 2013 5

2.2.6 Rational Rose 6

2.3 本项目应用的主要开发技术 6

2.3.1 C# 语言 6

2.3.2 DIV+CSS 7

3 项目概述 8

3.1 项目概述 8

3.2 项目风险 8

3.3 社会可行性分析 9

3.4 技术可行性分析 9

3.5 经济可行性分析 10

3.6 项目进度计划 10

4 Marvel电影宇宙网站总体设计分析 12

4.1 网站总体设计 12

4.1.1 颜色结构运用 12

4.1.2 网页版式设计 13

4.2 概要设计 13

4.3 网站整体规划 14

4.3.1 确定网站名称 14

4.3.2 电影网站的整体规划 15

4.4 现行研究存在的问题及解决办法 17

5 KesionCMS ASP设计 18

5.1 KesionCMS ASP系统函数标签 18

5.2 自定义表单 19

6 网站实现 20

6.1 网站前台界面设计与布局 20

6.1.1 首页 20

6.1.2 首页海报轮播界面 21

6.1.3 栏目页、内容页 22

6.2 网站后台管理员界面设计与布局 24

6.2.1 后台管理员登入界面设计说明 24

6.2.2 后台管理员界面 25

6.3 说明 26

6.3.1 项目文件命名规范 26

6.3.2 项目文件结构说明 26

6.4 测试方案 27

7 测试 28

7.1 测试 28

7.2 测试例子及其他结果 29

7.2.1 页面效果测试 29

7.2.2 后台添加测试 29

8 总结 31

致谢 32

参考文献 33