网页设计报告

1、中南大学网站制作技术综合设计报告主题瑜伽俱乐部学生姓名宁倩学生学号08专业班级电气工程及其自动化1303学院信息科学与工程学院指导教师周欣然信息学院计算机基础教学所2014年12月14日目录一网站基本信息1网站功能描述2网站基本内容(1) 网站主题(2) 网站栏目二网页具体制作过程1首页2书籍分类页3书籍推荐页4作者推荐页5书籍下载页三网页具体内容1素材选取2网页内容四 网页问题及解决方案五总结1心得体会2网页优点及不足网站基本信息1网站功能描述本人平时热爱瑜伽活动，瑜伽是一项能够让人全身心放松的运动。除此之 外还能强身健体，改善身体状况。瑜伽对于男女老少都合适。适合每一个人锻炼。 此网站本人

2、选取从瑜伽简介，分类，视频，音乐，书籍，作用等方面对瑜伽进行 展示。LI的在于加深自己对瑜伽各个方面的了解，同时也向大家推广瑜伽这项活 动。2网站基本内容（1）网站主题网站名为“瑜伽俱乐部”，以“瑜伽运动”为主题，展开设计，向大家推广 瑜伽这项锻炼活动（2）网站栏目网站首页中，有以下三个栏H：瑜伽分类，瑜伽作用，瑜伽媒体。书籍分类中，有以下四个栏口：阿斯汤嘎瑜伽，艾扬格瑜伽，流瑜伽，热瑜伽。 瑜伽媒体中，有以下两个栏目：瑜伽视频，瑜伽图书 二网页具体制作过程1首页首页的制作方法：（1）运用了表格来规划整个网页；网页分为左右两个部分；（2）左方上部使用java script制作了一个类似幻灯片的

3、相框，左方的下 方则是对瑜伽的简介，涉及瑜伽历史。（3）网页右方第一表格插入图片，明确主题。在此表格中也做了导航栏， 点击将进入不同的页面。（4）右下方通过表格，图片，文字，简单阐述了瑜伽的内容，在此部分点 击read more同样能进入不同的页面。（5）网页的最后，表明制作者，同时采取插入实时更新的时间。（6）本页面插有背景音乐。该音乐是瑜伽典型音乐。（7）右上角设置了读者联系我们的方式。YOGA CLUB卿人矣充廿发篦港8渤悴易. 坯甲右右可乌干車握的技巧西舎人C主理.心现.忻曲m伸 万倉M链力.电一炀归瞅心灵勻植耕他统一的苣苗近* 葫优人史曲人可1店天台一.fMltt不同吊磕如修務方湖U

4、 日案生镭而空行不道净.E她中忆锂左&1彳$. 訥1的 责任、无飲无札冥删畔酗篇和纵ftiT古印妙 也 是古印慶六无哲学FT仲的一圣.斤刁“坎比一为“牝U2弓 方雀.艮比九圻僦诟如刖是工罗是一荽列松号养心方雀.& 闾Q的处乜法c为湾WiiD休E）、调息的啊泛、说心的隽法 編w绘Ct几千耶的友展演文己劭生出很步漾别4正姻何麽“古且$*r包桔管治n.业8HD.信WSM1.哈忆怖知王处伸、尺达利创六大并帛EfiAULttShiAi2ia*身询一石昜決荊烏体惯复專夕肉目觉与旨倉，改支人旬亚健杖&tisiLim肓注.观代励细赋I。泾王艮果一峯列的険4养心方岂12 砸法I多亡瑜W休位宴） *2的巧喘W-L

5、-xStt 不,罠达至稣囲一.隸寵譬仓鸚!?器鬆弼翳几呗呢如郴皿曲较如左慢各刚UW起习时一罡E衣柄用的丈殊8刑的占区射t干万不直用力推竝条lb知累.超岀白己輕限边的动忙讹足进罠的稣习累左祿刁哋程中出理体力不芟.砧刘酣诒!5】刘枚功还不菱立度茫妁越上总履珞勿的抵行.有许多瑞如敦荻继出书.为梅舌 &11 2014-12-17 21：-AD .：CTSS2瑜伽分类页瑜伽分类页制作方法：（1）运用上下左右框架将页面分为三部分；（2）在左框架中插入两列四行的表格，第一列中插入图标，另一列分别输入不同瑜伽类别；超链接到不同的页面。（3）右框架中为不同类别瑜伽简介。3瑜伽作用页书籍推荐页制作方法:（1）di

6、v+CSS 布局；（2）行为使得页面更加美观&士第一式。功欢，娥少匪祁、瞎商制多余昭肪扩钱耐伸展颈部.址缓衰倉増强入的干饬恋及第中往彥力 创芟力消隊下背部.民B部的HI闵爱張纠正陶前做加乩存履阳舉、替訓叶:龍.肩飜?无三日似 友胸sp也再到了伸展这个姿势可以紿总腿硼筋， 训C佞腿祁1R肉用专理拄丽啣到完全的悻展.青部更.关节猪妙更协自如.育阔BVS到充全的曲展。甲艇背部伸展式功玫事兹善狰椎2曲毛厉石農肩膊、戏臂.51央腿执功舒嗾瞬症状及改m.uiw.s 狛修扫佈慈养和美化斑。治疗酿坛逞柔地按,5tt惺进下半身的血液循坏.戎祗4瑜伽媒体页瑜伽视频页方法:（1）采用模板布局;（2）可编辑区插入视频

7、身询运孤ii兰任何年甜人士#mE在运动的过在中阳济九的的f和*心轴习前应汪君QJW旳TevatKr4主气氏充讽菽仝供 豪.&子.用JI子 il行呼&泾狙綽亏染 .虑泌人的主气 变寻砂和农禺材少.W生、洁*,更董更的是书籍页制作：（1）运用模板；（2）可编辑区插入书本封面图片。APdiv显示书本简介。是舌期工任圧力犬.矢调.时趣，；：?力罡菩 壬糾床 罡砸*Wt-紺88、 XKirj 去BB?用 JStwoaimtYTtBaw 结全身尖络适当的林魚飪吉塔父奈.当tw仔底 乩丄仝艾杨裕关歼的強5?贰比，专为女悄勰瞬毎埸节利*易统和户盼多 圭综勺色用巴相血祠 if-.世总*i钳，W& 免段方，从而达

8、到法杯 爭形.M2x SE0WT3瑜仿訂 用军咅吟三网页具体内容1素材选取本网页的素材主要通过白度，在网上寻找瑜伽图片，瑜伽图书图片；在酷狗 中挑选与网站相配的背景瑜伽音乐；在各个网站搜寻瑜伽的相关资料。2网页内容（1）读者可以进入网站后，在首页里欣赏到美妙的音乐，优美的动画效果，点击联系我们可以向网站制作者发送电子邮件，咨询相 关问题。在首页的主要内容里，对不同方面的内容进行了简述， 读者可以通过这些文字对各个子网页有一个大概的认识。点击 read more可跳到不同的界面了解到具体的内容。（2）在首页导航栏里点击分类，进入链接网页可以对瑜伽分类有所了解。瑜伽分类繁多，在这里我选取了儿个有代

9、表性，大家比较容 易理解的种类进行了详细的说明。（3）在首页导航栏里点击作用，进入链接网页可以对瑜伽中常见的动作有所了解，同时了解到它们的作用。这些动作简单易懂，作用 明显，能够银起大家联系瑜伽的兴趣。（4）在首页导航栏里点击瑜伽媒体，进入链接网页，可以通过一些简单的视频更加深刻的了解瑜伽。这些视频也吸引读者跟随视频一 起练习。除此之外该页面还能跳到图书页面。该页面向大家推荐 了好儿本有关的瑜伽的书籍。四网页问题及解决方案1本网页因为建立了站点，不能随意更改网页的存储位置，否则网页内 容会发生改变或缺失。在制作网页的过程中，将网页保存在I;盘里，每次实验 课，只需打开U盘里的文件。2网页中使用

10、了框架，建立超链接的过程中，只链接到了框架的一部分, 没有整体改变框架内容。应该在链接时将口标选为“_blank”。3框架保存时，由于框架页较多，保存全部，再次打开是费时。应该将 框架逐个命名保存，易于寻找。五总结1心得体会从网页设讣开课以来，我就有做一个瑜伽网站的想法。从搜集资料到最后 完成这一页面经历了一个学期的漫长时光，这段时间同样也是短暂的，因为到最 后，还是做出了自己并不满意的网站。上课的内容很简单，但是实际做起来却会 碰到各种各样的问题。让我深刻意识所学的东西不仅仅在于课堂，更在于实践。在这一过程中，我碰到了很多问题，如，插入图片的路径问题，模板在各个 使用该模板页面的更新问题，div布局的页面位置问题，表格调整过程中页面布 局问题。复制的文字乱码问题，如何插入音乐，视频等问题。这些问题大都是通 过与同学之间讨论解决，另外在网上查询解决问题。最后发现自己对表格使用最 熟悉，APdiv是一个很自山的布局方式。通过本次实验我意识到要做好一个主题网站是非常不容易的，不仅仅要对网 页只是了解，还要对色彩，图片剪切等方面非常熟悉。这个设计让我了解了很多 课外的东西，掌握了很多新技能。网页课虽然已经结束，但是网页这么有趣的东西我会一直作为自己的兴趣爱 好发展下去，像热爱瑜伽一样热爱网页。此外，非常感谢