信息管理与信息系统课程设计报告

1、西安电子科技大学课程设计计报告信息管理理与信息息系统（理）学号：姓名：班级：学期：220099至20110学年年 11 学学期目录引言22. 设设计中考考虑的问问题3. 使使用工具具3. DDreaamweeaveer8简简介3. 网网页结构构4. 站站点的定定义与创创建5. 超超链接的的介绍9. 文文字的链链接10. 图图片的链链接11. 层层的插入入与应用用11层的的插入111层的的应用122. 视视频及音音频的插插入14. 网网页界面面实例16主页116All staar166Jackk Puurceell17One staar17靓品推荐荐117. 个个人体会会17. 参参考文献献18

2、引言在Intternnet飞飞速发展展的今天天，互联联网成为为人们快快速获取取、发布布和传递递信息的的重要渠渠道，他他在人们们政治、经济、文化、科学、生活等等各个方方面发挥挥着重要要的作用用。因此此网站建建设在IInteerneet应用用上的地地位显而而易见，它已经经成为政政府、企企事业单单位信息息化建设设中的重重要组成成部分，从而备备受人们们的重视视。我这次开开发的是是一个公公司产品品宣传的的网页。Convversse作为为一个有有悠久历历史的运运动品牌牌，如今今已经是是一个家家喻户晓晓的大品品牌。19088年由美美国摩尔尔匡威威于麻省省春田市市创办了了篮球鞋鞋的专业业制造厂厂，COONVE

3、ER AALL SATTAR于于是就诞诞生了。19117年正正式推出出了ALLL SSTARRT帆布布鞋，以以其狂放放不羁的的设计，风靡全全球一炮炮而红。19223年以以具有运运动天赋赋和口才才的篮球球明星CCHVCCK TTAYLLOR的的亲笔签签名成为为著名商商标。集集复古、流行、环保于于一身的的ALLL STTARTT帆布鞋鞋，是美美国文化化的精神神象征，以其随随心所欲欲，自由由自在没没有约束束的穿着着形态，更成为为追求自自我时尚尚的青年年人的忠忠实排挡挡。在中中国市场场，现在在上市的的有ALLL SSTARRCHUUCK TAYYLORR （全全明星经经典帆布布鞋）、JACCK PPU

4、RCCELLL（开口口笑）、ONEE STTAR(古典帆帆布鞋)三大系系列。因此本网网页介绍绍了国内内市场上上的三种种系列的的Connverrse，与几款款最新的的靓品。创建本本站的实实用工具具主要为为：Drreammweaaverr、Phhotooshoop、FFireeworrks等等，部分分建站素素材来源源于网络络。由于我们们对网页页设计也也只是初初步学习习，从来来没有用用它开发发过一个个具体项项目，所所以我在在开发本本网站过过程中是是要不断断的翻阅阅一些书书籍以及及观看教教学视频频来丰富富我的这这方面只只是。有有时也有有很多困困难是个个人多无无法解决决的，在在此我很很感谢老师和和同学，

5、是他们们在我最最需要帮帮助时给给了我指指导。网网页的实实现过程程一HTTML语语言为主主，也使使用了少少量的JJavaa代码。关键词网页设计计 HTTML语语言 DDreaamweeaveer PPhottoshhop.设计计中考虑虑的问题题1. 用用户第一一次进来来，将给他他的感觉觉是什么么？频道导航航，位置导导航，社会导导航，页面布布局，页面风风格，页面视视觉效果果，内容密密集度，页面的的文字的的提示性性。2要呈呈现给他他的内容容是什么么？是不是是他想要要的？用户最想想看到的的内容是是什么，他来到到这里最最关注的的内容是是什么，我们能能不能第第一时间间满足他他，要素素：如标标题，图图片，内

6、内容，联联系方式式，用户户对信息息的赞贬贬度，评评价。3. 要要提供给给他的核核心服务务是什么么？用户进来来后，我我们提供供的核心心服务是是什么？信息可可比性服服务、翻翻译服务务、信息息地图服服务、音音乐试听听服务还还是其他他服务?4. 页页面信息息构架的的内容推推荐性是是不是合合理？网页是借借自己的的牌坊，宣传自自己的内内容获得得流量转转换或广广告的收收益。在在页面信信息构架架的内容容可推荐荐性设计计上，我我们以怎怎样的方方式去推推荐内容容，强制制性模块块内容推推荐，还还是内容容相关性性匹配推推荐？拿拿什么样样的页面面位置去去更好的的推荐？5. 页页面信息息构架的的功能互互动性设设计是不不是

7、可用用？互动性、交互性性设计，可以很很友好的的和用户户建立其其沟通，包括交交互方式式、交互互效果、交互提提醒、流量诱诱导，以以及网站站的交互互信息的的输出等等影响着着用户对对网站的的活跃度度认识、参与的的积极性性。. 使使用工具具开发中用用到的工工具和技技术简单单介绍如如下：采用Drreammweaaverr为开发发软件，csss样式，超级链链接，并并用fiirewworkks做简简单的图图形编辑辑，运用用Phootosshopp来后期期制作。. DDreaamweeaveer8简简介Dreaamweeaveer8简介Dreaamweeaveer是MMacrromeediaa公司的的出品的的一

8、款“所见即即所得”的网页页编辑工工具。与与 Frronttpagge不同同，Deeamwweavver采采用的是是Macc机浮动动面版的的设计风风格，对对于初学学者来说说可能会会感到不不适应。但当你你习惯了了其操作作方式后后，就会会发现DDreaamweeaveer的直直观性与与高效性性是Frronttpagge所无无法比拟拟的。Drreammweaaverr对于DDHTMML（动动态网页页）的支支持特别别好，可可以轻而而易举地地做出很很多眩目目的互动动页面特特效。插插件式的的程序设设计使得得其功能能可以无无限的扩扩展。DDreaamweeaveer与FFlassh、FFireeworrks

9、并称为为 Maacroomeddia的的网页制制作三剑剑客，由由于是同同一公司司的产品品，因而而在功能能上有着着一个非非常紧密密的结合合。因此此，说DDreaamweeaveer是高高级网页页制作的的首选并并不为过过。 Drreammweaaverr最新的的版本为为:Drreammweaaverr 8。. 网网页结构构首页All StarJack PurcellOne Star靓品推荐. 站站点的定定义与创创建在正式开开始制作作网页之之前，最最好先定定义一个个新网站站，这是是为了更更好地利利用站点点窗口对对站点文文件进行行管理。定义方方法方法一：在站点点窗口的的下拉菜菜单选择择最后一一项编辑辑

10、站点，如下图图。此时会弹弹出一个个新的对对话框，点击“新建”按钮就就可以定定义一个个新网站站，如果果日后需需要对旧旧有网站站重新定定义，可可以在左左边的网网站列表表中选中中你需要要重新定定义的网网站，然然后点击击“编辑”按钮便便可。方法二：选择菜菜单“站点”“新建站站点”选项。（如图图所示） 在接着着看到的的对话框框中，要要进行以以下简单单的设置置： 网站站名称：为你的的网站起起一个名名字，这这个名字字只起着着识别的的作用，与网站站发布后后真实的的名字无无关。如果不不需要什什么特殊殊的服务务器技术术，就选选“否”这项。 本地根根目录：设置网网站在本本地硬盘盘的位置置，点击击后面的的文件夹夹图标

11、可可以选择择硬盘的的任意目目录作为为存放网网站文件件的目录录； 可以任任意选择择你想要要将文件件存储在在服务器器上的位位置，方方法同上上一步本本地根目目录的建建立相同同。 选择默默认的状状态即可可。 完成成后，回回到站点点窗口，就可以以看到如如下类似似的画面面： 可以看到到，“我的网网站”的名称称已经出出现在站站点窗口口了，因因为是新新建的一一个站点点，所在在在本地地目录看看到的一一片空白白。站点定义义完毕之之后，就就可以正正式制作作属于你你自己的的网页了了。. 超超链接的的介绍按照链接接路径的的不同,网页中中超链接接一般分分为以下下3种类类型: 内部链链接,锚锚点链接接和外部部链接。 如果果

12、按照使使用对象象的不同同，网页页中的链链接又可可以分为为：文本本超链接接， HYPERLINK t _blank 图像像超链接接，E-maiil链接接，锚点点链接， HYPERLINK t _blank 多媒体体文件链链接，空空链接等等。 超链链接是一一种对象象，它以以特殊编编码的文文本或 HYPERLINK t _blank 图图形的形形式来实实现链接接，如果果单击该该链接，则相当当于指示示 HYPERLINK t _blank 浏览器器移至同同一网页页内的某某个位置置，或打打开一个个新的网网页，或或打开某某一个新新的WWWW网站站中的网网页。 网页页上的超超链接一一般分为为三种：一种是是绝

13、对UURL的的超链接接。URRL（UUnifformm Reesouurcee Loocattor）就是 HYPERLINK t _blank 统统一资源源定位符符，简单单地讲就就是网络络上的一一个站点点、网页页的完整整路径，如；第第二种是是相对UURL的的超链接接。如将将自己网网页上的的某一段段文字或或某标题题链接到到同一网网站的其其他网页页上面去去；还有有一种称称为同一一网页的的超链接接，这种种超链接接又叫做做书签。 超链链接还可可以分为为动态 HYPERLINK t _blank 超超连接和和静态超超连接。动态超超连接指指的是可可以通过过改变HHTMLL代码来来实现动动态变化化的超链链接

14、，例例如我们们可以实实现将鼠鼠标移动动到某个个文字链链接上，文字就就会象 HYPERLINK t _blank 动动画一样样动起来来或改变变颜色的的效果，也可以以实现鼠鼠标移到到 HYPERLINK t _blank 图片上图图片就产产生 HYPERLINK t _blank 反色色或朦胧胧等等的的效果。而静态态超链接接，顾名名思义，就是没没有动态态效果的的超链接接。 在网页中中，一般般文字上上的超链链接都是是蓝色（当然，用户也也可以自自己设置置成其他他颜色），文字字下面有有一条 HYPERLINK t _blank 下下划线。当移动动 HYPERLINK t _blank 鼠标指指针到该该超

15、链接接上时，鼠标指指针就会会变成一一只手的的形状，这时候候用鼠标标左键单单击，就就可以直直接跳到到与这个个超链接接相连接接的网页页或WWWW网站站上去。如果用用户已经经浏览过过某个超超链接，这个超超链接的的文本颜颜色就会会发生改改变（默默认为紫紫色）。只有图图像的超超链接访访问后颜颜色不会会发生变变化。文字的的链接在属属性面板板的Liink一一项，填填写链接接地址，当浏览览者点击击该链接接的时候候，浏览览器就回回跳转到到该页面面。如果你希希望该页页面是在在一个新新窗口打打开，可可以在TTargget中中选择“_baalnkk”。如果要链链接到网网站内的的文件，可以点点击 ：上图图中，我我们是将

16、将文字链链接到“alll sttar.htmml”这个文文件，特特别注意意的是最最底的“相对于于”的选项项，意思思是选择择相对路路径的形形式，默默认是“文档”，也可可以选择择“站点根根目录”，区别别在于，“文档”是指相相对路径径是从本本页开始始计算，而“站点根根目录”是从根根目录开开始计算算（即“/”）另外，如如果使用用“站点根根目录”的模式式做成的的链接，在本地地硬盘直直接打开开页面浏浏览通常常会出错错，但在在Dreeamwweavver的的预浏模模式和上上传上服服务器后后，都不不会有问问题。文字链接接代码：输入的的文字图片的的链接图片链接接的建立立过程与与文字链链接相似似，就不不多作介介绍

17、了。但特别别要提出出的是，某些图图片，在在加上链链接后，会出现现一个蓝蓝色的边边框，要要将边框框去掉，将Boordeer设为为0即可可。图片链接接代码：. 层层的插入入与应用用层的插插入层（LLayeer）是是一种 HTMML 页页面元素素，您可可以将它它定位在在页面上上的任意意位置。层可以以包含文文本、图图像或其其它 HHTMLL 文档档。层的的出现使使网页从从二维平平面拓展展到三维维。可以以使页面面上元素素进行重重叠和复复杂的布布局。打开Drreammweaaverr后，找找到菜单单栏处的的“插入”，然后后点开下下拉菜单单，选择择布局对对象，插插入层即即可，如如图所以黄蓝蓝色的框框架就是是

18、一个层层的插入入。层的应应用一个页页面中可可以画出出很多的的层，这这些层都都会列在在层面板板中。层层之间也也可以相相互重叠叠。层面面板可以以通过菜菜单窗窗口菜菜单选选“层”打开。这里里我们需需要对几几个概念念进行解解释。层层有隐藏藏和显示示的属性性。这是是层的一一个重要要属性和和以后说说到的行行为相结结合就变变成了重重要的参参数。单单击层面面板列表表的左边边，可以以打开关关闭眼睛睛。眼睛睛挣开和和关闭表表示层的的显示和和隐藏。层还还有一个个概念就就是层数数，层数数决定了了重叠时时哪个层层在上面面哪个层层在下面面。比比如层数数为的的层在层层数为的层的的上面。改变层层数就可可以改变变层的重重叠顺序

19、序。层面面板上面面还有一一个参数数就是防防止层重重叠。一一旦选中中，页面面中层就就无法重重叠了。层还还有一种种父子关关系也就就是隶属属关系。在层面面板中是是这样表表示的。图中中Layyer22挂在LLayeer1的的下面。Layyer11为父层层，Laayerr2为子子层。在在页面中中拖动LLayeer1，Layyer22也跟着着动起来来。因为为他们已已经链在在一起了了，并且且Layyer22隶属于于Layyer11。父层层移动会会影响到到子层。移动llayeer2层层，Laayerr1层不不动。也也就是子子层不会会影响到到父层。要建立这这样的一一种隶属属关系方方法很简简单。在在层面板板中按C

20、Ctrll键将子子层拖拽拽到父层层即可。由于层在在网页布布局上非非常方便便，所以以，一些些人可能能不喜欢欢使用表表格或“布局”模式来来创建自自己的页页面，而而是喜欢欢通过层层来进行行设计。Dreeamwweavver88可以使使用层来来创建自自己的布布局，然然后将它它们转换换为表格格。 在在转换为为表格之之前，请请确保层层没有重重叠。请请执行以以下操作作：选择择“修改改”“转换换”“层到到表格”。即可可显示“转换层层为表格格”对话话框。选择所需需的选项项。单击击“确定定”。 选择择所需的的选项。单击“确定”。. 视视频及音音频的插插入. 视视频的插插入关于 FFlassh 视视频 使使用 DD

21、reaamweeaveer 中中的“插插入 FFlassh 视视频”命命令，可可将 FFlassh 视视频内容容插入 Webb 页面面，而无无需使用用 Fllashh 创作作工具。该命令令可以插插入 FFlassh 组组件；当当您在浏浏览器中中查看它它时，它它显示您您选择的的 Fllashh 视频频内容以以及一组组播放控控件。“插入 Flaash 视频”命令提提供以下下选项，用于将将视频内内容发送送给站点点访问者者：累进进式下载载视频将将 Fllashh 视频频 (FFLV) 文件件下载到到站点访访问者的的硬盘上上，然后后播放。但是，与传统统的“下下载并播播放”视视频传送送方法不不同，累累进式

22、下下载允许许在下载载完成之之前就开开始播放放视频文文件。流流视频将将 Fllashh 视频频内容进进行流处处理并立立即在 Webb 页面面中播放放。若要要在 WWeb 页面中中启用流流视频，您必须须具有对对 Maacroomeddia Flaash Commmunnicaatioon SServver 的访问问权限，这是唯唯一可对对 Fllashh 视频频内容进进行流处处理的服服务器。在 UURL 文本框框中，指指定广告告ConnverrseMMyDrriveeThrru.fflv 文件的的相对路路径，方方法是单单击“浏浏览”，浏览至至广告CConvversseMyyDriiveTThruu.

23、fllv 文文件（位位于站点点的广告告ConnverrseMMyDrriveeThrru 根根文件夹夹中），并选择择该 FFLV 文件。 从“外观观”弹出出式菜单单中选择择 Haalo Skiin 22。所选外观观的预览览会出现现在“外外观”弹弹出式菜菜单下方方。“外外观”选选项指定定将包含含 Fllashh 视频频内容的的 Fllashh 视频频组件的的外观。在“宽度度”和“高度”文本框框中，执执行以下下操作：在“宽度度”文本本框中，键入 1800。在“高度度”文本本框中，键入 1355 ，然然后按 Entter 键。单击“检检测大小小”以确确定 FFLV 文件的的准确宽宽度和高高度。但但是

24、，有有时 DDreaamweeaveer 无无法确定定 FLLV 文文件的尺尺寸大小小。在这这种情况况下，必必须手动动输入宽宽度和高高度值。“宽度”和“高高度”文文本框中中的值以以像素为为单位指指定 FFLV 文件的的宽度和和高度。可以任任意调整整这些值值以更改改 Weeb 页页面上的的 Fllashh 视频频的大小小。增加加视频的的尺寸时时，视频频的图片片品质通通常会下下降。“包括外外观”是是 FLLV 文文件的宽宽度和高高度与所所选外观观的宽度度和高度度的加和和。其余选项项保留默默认的选选择值：限制高宽宽比保持持 Fllashh 视频频组件的的宽度和和高度之之间的高高宽比不不变。默默认情况

25、况下会选选择此选选项。自动播放放指定在在 Weeb 页页面打开开时是否否播放视视频。默默认情况况下取消消选择该该选项。自动重新新播放指指定播放放控件在在视频播播放完之之后是否否返回起起始位置置。默认认情况下下取消选选择该选选项。单击“确确定”关关闭对话话框并将将 Fllashh 视频频内容添添加到 Webb 页面面。“插入 Flaash 视频”命令生生成一个个视频播播放器 SWFF 文件件和一个个外观 SWFF 文件件，它们们用于在在 Weeb 页页面上显显示 FFlassh 视视频内容容。（您您可能需需要单击击“文件件”面板板中的“刷新”按钮来来查看新新的文件件。）这这些文件件与 FFlassh 视视频内容容（在此此情况下下，为 caffe_ttownnsennd 根根文件夹夹）所添添加到的的 HTTML 文件存存储在同同一目录录中。当当您上传传包含 Flaash 视频内内容的 HTMML 页页面时，Dreeamwweavver 将这些些文件作作为相关关文件上上传（只只要单击击“要上上传相关关文件？”对话话框中的的“是”）。保存该页页，然后后可以测测试下效效果。. 音音频的插插入在网页中中添加