12多媒体课件设计与开发第

第5节页面设计河北科技师范学院教育学院李春艳模块1界面设计一、基本原则

1.易学易用性2.针对性：应针对不同课程、不同学习者的特征来考虑。在颜色、布局等方面。3.简洁性：页面主题清晰明确、内容层次清楚、不能分散学习者的注意力。模块1界面设计一、基本原则

4.一致性：要求整个课件有统一的风格，即页面功能区和构成要素在显示风格、布局位置和功能作用等方面应具有前后一致性。

5.重点突出：比如，标题加粗显示，重点内容利用对比色突出显示。模块1界面设计二、色彩设计色彩是一种对观察者有强烈情绪影响和心理暗示作用的视觉因素。冷色调会减缓人们的时间知觉，从而使人们对事物的视觉注意力得到持续。暖色调在初期容易得到视觉注意，但是由于其加快了人们的时间知觉，长时间注意容易使人们产生视觉疲劳。模块1界面设计二、色彩设计一般而言，课件的页面大多以蓝、绿、灰等冷色调为色彩基调。色调给人以安静、稳定、朴实的感觉，能创造良好的学习阅读的视觉环境。模块1界面设计二、色彩设计文字的颜色和页面背景色要形成对比。白纸黑字的阅读效果为最佳。一个页面的色彩应控制在4种以内，避免色彩太多太杂。会使学习者眼花缭乱，分散学习的注意力。对于局部需要强调突出的文字或图标等内容，可以通过对比色的运用达到醒目的效果。模块1界面设计三、页面布局（常见）模块1界面设计三、页面布局（常见）1.“T”字型布局。页面上方横条为网络课件的课程标志和导航控件，下面左侧为主菜单或导航菜单右面区域为教学区。这种布局为页面设计中应用最为广泛的一种布局方式。优点是结构清晰，主次分明，易于制作。缺点是缺乏新意,如果色彩搭配和控件摆放不够合理的话，容易让人失去兴趣。模块1界面设计三、页面布局如果内容较多可采取滚动条拖动或者“下一步”的方式，但滚动范围最好不超过3屏，“下一步”控制在“3”步以内为好。对于教学内容中的一些概念和扩展内容等可通过链接，打开新窗口显示。模块1界面设计三、页面布局（常见）2.两段式布局 页面上方横条为课程的标志和导航控件，下方全部是教学区域。 适用于教学区域的控件比较多，需要大量展示大量多媒体素材的情况。模块1界面设计四、媒体元素设计（文本）常用字体有宋体、黑体、仿宋等，应尽量避免使用特殊字体以免学习者的浏览器不支持。使用特殊字体的地方，可以将文字制成图像，插入页面中。同一页面内采用的字体宜在3种以内，否则显得杂乱。行距和段落间距模块1界面设计四、媒体元素设计（图像）当前的网页中经常使用的图片格式有三种：GIF、JPEG、PNG。

GIF图形文件采用无损压缩技术，可以存储透明色、建立动画等。适用于按钮、标题图片、线条、图标动画等。

模块1界面设计四、媒体元素设计（图像）JPEG可以在不减少图像中所使用的颜色数量的情况下对图像进行压缩。由于该格式比较能容忍失真，如图片、艺术复制品、事物或风景等都比较适合于用JPEG来表现。PNG采取比GIF更有效的非失真压缩技术，通常比GIF和JPEG文件大，不支持动画。模块1界面设计四、媒体元素设计（图像）进行切片处理，将图片打碎，可以提高下载速度。界面设计四、媒体元素设计（动画）应该注意将多媒体动画效果恰如其分地整合于课程中，不能让花哨的效果分散学习者的注意力。模块2首页设计没有最好的能够适应一切的设计方案，也没有固定的一成不变的设计方案。它是课件的总导航。除了要美观之外，导航应该具有科学性、目的性，能够引导教学任务的完成。首页设计一般还要考虑尺寸大小、课件内容、风格样式以及导航形式等因素。一、直观性指标的体现首页设计的基本原则眼球效应（Banner、整体设计）主体突出、结构清晰、配色合理用户友好性

使用的图片、符号等具有表征意义的元素，一定要有其特殊含义，且能与课程本身的性质与特征结合起来。

主体突出一、直观性指标的体现首页中直观性指标的体现整体设计思想和特色的体现积累数据的呈现直观展现教学过程，体现“活”的课程重要评审项的突出模块2首页设计模块2首页设计模块2首页设计模块2首页设计模块2首页设计由于不同的浏览器和分辨率对于网页的显示效果不同，因此在设计网页时要尽量在不同的浏览器下设计和调试。分辨率为800*6001024*768主页网站结构主页案例JAVASCRIPT网页动态效果JavaScript是一种属于网络的脚本语言,已经被广泛用于Web应用开发,常用来为网页添加各式各样的动态功能,为用户提供更流畅美观的浏览效果。通常JavaScript脚本是通过嵌入在HTML中来实现自身的功能的JAVASCRIPT网页动态效果是一种解释性脚本语言（代码不进行预编译）主要用来向HTML页面添加交互行为。可以直接嵌入HTM