天地人音乐网站项目规划与设计

天地人音乐网站项目规划与设计目录6013一、项目背景 1205151、选题的目的和意义 1104022、课题研究的主要简介 119140二、网站开发平台 12222三、网站建设日程表 111375四、站点地图 22396五、线框图 2143281、主页布局 2104732、子页布局 319107六、设计规范及网页UI设计 338231、设计愿望 340192、确定网站主题 4262633、确定网站形象 4204294、确定网站风格 577365、确定网站内容 522977七、主要页面的详细设计图 59207八、网站测试 8151891、测试准备 935672、用户界面测试 971593、功能测试 9124274、兼容性测试 91590九、网站推广与维护 973391.网站推广 9240272、网站维护 10PAGE4一、项目背景1、选题的目的和意义在互联网发展迅猛的今天，我们无时无刻不与网络接触，可以从中查找我们需要的信息，可以发布想让别人知道的信息，可以找到你不认识但真心的朋友，也可以第一时间看到国内外的重大事件。当我们无事可做的时候，便开始了娱乐方式的搜索，由此，很多音乐网站和视频网站应运而生，服务大家，为我们的生活增添了色彩。随着我国网民的增加，也促进了音乐网站的开发。2、课题研究的主要简介音乐网站网站是给用户一个方便的视听空间，登陆音乐网界面，根据自己的需求选择浏览，其功能有以下：（1）用户可以通过浏览主页，了解音乐的简介以及音乐展示（2）用户通过浏览子页，可以对音乐进行细致的了解二、网站开发平台功能模块技术和软件平台操作系统Windows8设计稿、图形处理PhotoshopCS6动画设计制作FlashCS5网页制作平台Dreamweaver网站开发语言HTML,CSS,JavaScript，asp网站测试平台Chrome，Firefox三、网站建设日程表完成整个项目所需时间为三个月，其中各项规划任务如下表所示：时间任务内容3月9日-16日拟定项目3月17日-23日制定初步项目计划4月6日-19日网站初步框架4月20日-5月1日网站内容具体丰富5月2日-5月10日总结反思，网站细节完善5月11日-24日计划微调，网站用户体验感测试5月25日-6月7日网站装饰再加工，CSS布局，JS语言,后台数据库设计6月8日-6月15日最终测试四、站点地图音乐网站音乐网站用用户注册模块用户登录模块动态显示歌曲留言模块音乐搜索模块动态显示时间五、线框图1、主页布局logo图片添加收藏logo图片添加收藏下载作品添加说明导航搜索栏图片图片主推荐介绍注册登录版权及其他版权设计2、子页布局 logo图片添加收藏logo图片添加收藏下载作品添加说明导航搜索栏主推荐板块版权设计六、设计规范及网页UI设计音乐网网站这个网站是运用了HTML静态网页技术，和Dreamweaver软件相结合实现的。页面间通过网页链接，实现具体所要查找的食品，可以方便用户的需要做出选择，给人们带来了极大地方便。1、设计愿望当用户点击希望去的界面时，就会自动的链接到用户希望的那个网页。展现给用户相应的界面，在每个界面都会有这几个选项卡，用户可以在其中自由的切换。2、确定网站主题建立一个网站好比写一篇文章，首先要拟好提纲，文章才能主题明确，层次清晰。如果网站结构不清晰，目录庞杂，内容东一块西一块。结果不但浏览者看得糊涂，自己扩充和维护网站也相当困难。网站的题材确定后，并且收集和组织了许多相关的资料内容，但如何组织内容才能吸引网友们来浏览网站呢？栏目的实质是一个网站的大纲索引，索引应该将网站的主体明确显示出来。3、确定网站形象网站形象的设计可以从网站的LOGO、网站的色彩、网站的字体宣传语等这些方面着手。图6-1Logo设计网站给人的第一印象就是首页，要让人愿意继续欣赏下去。我设计的首页力求简洁明了，色调属于暖色，给人明快、轻松的感觉。页面最醒目处是一朵正在开放的花，象征着祖国的未来生机勃勃。背景隐约可见的五条横线，代表着五线谱，表明了本网站音乐休闲的主题。首页包括音乐、视频、简介、紫兰图片、紫兰文化和链接六项。有我的E-mail以便用户和我联系。网页的色彩选择和搭配是网页设计的重点之一。用什么色彩才能最好地表达出网站的内涵，吸引浏览者的视线，网页的色调、背景、文字、图标、边框、链接应该采用什么样的色彩，应该如何搭配，都是网页设计一开始就必须考虑的问题。网页的色彩搭配在网页的制作中起到非常重要的作用，因为它将决定浏览者对你的网页的第一印象，好的色彩搭配可以使你的网页独具魅力，相反则提不起浏览者的兴趣。所以一定要把握住色彩的搭配。网站字体，和标准色彩一样，标准字体是指用于标题、主菜单的一些特有字体。为了体现网站所特有的风格，可以根据自已的网站所表达的内涵，选择更贴切的字体。我的音乐网站的标准字体是华文彩体。给人一种沉稳而不失俏皮的感觉。表格布局的过程：设计出框架为800*1000的布局表格，再在表格中添加适当的单元格链接设计制作的过程：主页与五个子页进行连接图片处理的过程：单元格设定好，图片大小和单元格同等大小然后添加导航按钮的设置等等4、确定网站风格风格是抽象的，指网站的整体形象给浏览者留下的综合感受。这个“整体形象”包括网站的LOGO、网站的色彩、网站的字体、网站的标语等许多因素。网站是可以平易近人的、生动活泼的，也可以是严肃专业的。但不管是在色彩、技术、文字、布局、还是交互方式上，只要能由此让浏览者明确的看出这是你的网站所独有的，这就形成了一种风格。风格是有人性的，它通过网站的色彩、技术、文字、布局、交互方式等可以综合概括出一个网站的自己的个性；我的网站风格是以舒服为主，给人一种舒舒服服的感觉。5、确定网站内容本网站的内容表现形式主要以文本、图像为主。用户注册：用户注册自己的空间用户登录：用户登录空间查看音乐收藏动态显示歌曲：根据类别不同，显示华人歌曲，日韩歌曲，影视歌曲，伤感歌曲，非主流歌曲等等。动态时间：网页中显示动态的时间音乐搜索：搜索数据库中包含的歌曲留言：用户提交自己的留言七、主要页面的详细设计图1网站主页注：主页的右上角为动态时钟，上方为网站形象flash，并有设为首页和添加收藏功能，可通过上传作品和下载作品查看说明，中间网站分类导航条和音乐搜索，左下角为会员登录窗体，可通过链接进行注册，下方网站版权说明，关于我们和留言提交链接。2歌曲分类页面注：歌曲分类页面均来自于模板，结构相似，只是数据集的绑定不同而已，故此不做重复介绍。3音乐搜索页面注：在音乐搜索文本框中输入搜索文本，点击音乐搜索按钮后，会显示出搜索结果，同样也可以在有主页模板生成的其他页面进行搜索。4用户留言页面输入反馈内容和联系方式后，单击确定提交按钮，即可将用户要反馈的内容提交给后台数据库。5音乐播放器页面注：点击音乐名称链接或者点击试听后，网站会自动打开该网页播放器页面，播放你选中的音乐，而播放器的左边分类歌曲列表，供你选择喜欢的各种类型歌曲。八、网站测试1、测试准备测试前对被测系统做好以下准备：系统的全面备份，包括应用程序备份、数据备份等；记录测试前系统状态；制定应急措施，确保在测试中发生问题时系统可恢复。测试员应在测试开始前了解网页的相关情况，对测试的预期结果应进行准备和预测。测试前要做好真实数据的准备工作，并进行系统的数据初始化。2、用户界面测试主要测试导航条、内容、颜色、背景、图像、返回等。3、功能测试主要测试站点中的链接等。链接测试：目的是检查各个URL所联接的页面是否正确。表单测试：目的是检查每个表单与程序是否正确联接，能够正确地发送用户请求。4、兼容性测试主要检验应用能否在不同的客户端使用。如苹果（iOS系统的）用户，经常使用chrome，Firefox等浏览器的用户是否都能正常使用。九、网站推广与维护1.网站推广（1）微信公众平台、朋友圈、微博、QQ空间推广（2）论坛推广我们可以注册几十个论坛，每个论坛注册若干个帐号，把签名设为自己的网站及团队图标。发表热门内容，自己顶自己的帖子。目前我们应用的论坛包括校内的极速之星、外网的百度贴吧、天涯论坛、豆瓣等等网民较为聚集的地方。（3）电子邮件推广我们会像宜家一样让用户进行自愿注册会员，浏览者自愿留下他的邮箱地址，定期或不定期的发布一些电子刊物、会员通讯、专业服务商的电子邮件广告等。可以减少广告对用户的滋扰