组建局域网一.pptVIP

专题网站的设计与制作 规划设计 讲师：叶金毅 专题网站的开发流程 规划设计 素材准备 制作测试 发布维护 任务介绍 请各位老师调查某一学科或多个学科的教学需求，规划设计一个专题学习网站。 专题网站设计的四个基本要素 目标 内容 技术 外观 1/5 明确目标和专题 目标设计基本要求：明确而具体 1/5 明确目标和专题 专题选取原则： 专题不等同于单个知识点，也不等同于课程，它是由一系列具有相关知识特征的知识点提炼而成，体现知识的有机融合。这些知识点可以取自一门学科也可以覆盖多门学科。专题选取的切入点要小而精，便于“小题大做”，对专题做深入透彻的研究，避免专题过大，蜻蜓点水式的空泛而谈，同时专题的选取要体现科学性和艺术性、新颖性和独特性的有机统一。 2/5 用户分析 通过问卷调查、现场访谈、非正式交流或对有关用户的一般思考，建立关键、综合但实用的用户特征描述，其中特征应该考虑用户共性，但同时应该考虑差异性。 2/5 用户分析 访问我的网站的学生有多大？技术熟练程度如何？多大年纪？ 在访问网站时，会干些什么？想实现什么目标？ 他们会在网站上呆多长时间？是否有可能再返回站点？ 3/5 内容分析——内容选择 确定栏目，分析网站上需要提供的文本、图像、声音、动画、视频等媒体的内容、形式等。 3/5 内容分析——内容选择 内容组织原则： 紧紧围绕专题展开，详细具体，具有针对性；它不是文字教材的简单搬家，而是将相关的知识点非线性地有机组织融合在一起，形成科学的逻辑体系，设立与专题相关的多个知识点，符合学生的认知结构。 3/5 内容分析——整体结构设计 站点结构图：关键点是对用户容易导航 4/5 技术设计 提供站点应该使用的技术的综述，如HTML、ASP、VBScript、JavaScript、CGI、Java等。 5/5 外观设计 确定用户界面设计的轮廓 基本方法： 先确定主页，再到子页； 先考虑块，再考虑块内各种媒体的形式、位置和关系。 需要注意的问题： 响应时间，尽量避免较大的图片和视频； 不要偏离主流站点确定的通用界面规则； 进行与用户设备无关的设计。 微软每一个网页都是制作的样板。从网页我们就可以看出微软公司的风格、作风，以及雄厚的实力。 专题网站规划设计的流程图 为了让大家理解该如何设计专题网站，本课程将随课程同步建立一个“信息学竞赛专题学习网站”，下面进行分析。 奥赛网站的目的以及定位 目标：通过该专题学习网站，访问者可以获得竞赛相关信息，以及获得竞赛的学习内容，培养和造就更多高素质的信息技术人才； 主题：信息学竞赛； 名称：信息学竞赛专题学习网站； 注意：要求陈述简单明了，可以实现。 用户分析 用户特征：对信息学竞赛有兴趣的中学学生，层次包括入门者、有一定基础者以及提高者，所以提供的内容应该是阶梯式，并且紧紧围绕信息学竞赛专题； 访问站点理由：从内容的角度来说这是获取有关信息学竞赛的信息，以及可以学习和交流的网站。网站内容组织全面，形式新颖，页面美观。 内容分析 各位老师在准备自己的规划设计时，一定要把它作为重点来处理，精心挑选、精心准备； 内容选择：语言基础（包括Pascal和C两种语言），基本算法，数据结构，典型题目等； 素材准备，包括文本、图片、动画、视频、音频等。 整体结构设计——站点结构图 技术需求 静态网页的制作：Frontpage； 动态网页的制作：基于asp的交互网页； 整体风格设计 风格是站点的整体形象给浏览者的综合感受，整体形象包括站点的CI（标志、色彩、字体、标语）、版面布局、浏览方式、交互性、文字、语气、价值、意义等诸多因素。比如网易是平易近人的，迪斯尼是生动活泼的，IBM是专业严肃的等。 信息学竞赛网站的整体风格 专业、有实力的专题网站（内容）； 以幻想的天蓝色为主色调（色彩搭配）； 网站象狮子一样自信威猛（形象Logo）； 与其它网站相比，网站具有可信赖、交流方便等特征。 整体风格——界面布局 网页尺寸：主要是设计网站的宽度，如果用像素为单位，这里设计成800像素，大部分网站没有长度限制，但是不能过长，从使用习惯上来说，在主页上拖动滚轮2下为佳，这符合一般人的习惯； 布局结构：主要是考虑导航、必要信息与正文之间的布局关系，本专题网站布局方式是顶部放置logo和标语以及导航条，下面采用等分或者不等分的二栏、三栏、多栏，具体视内容而定，采用背景或者线条加以区分； 整体风格——界面设计 配色原理：网站的主色调，根据内容和精神选择色彩，由设计者的主观性决定； 文本设置：文本是网页中最重要的设计元素，建议采用磅为单位，最适合网页正文显示的字体大小为12磅，小字号容易产生整体感和精致感，但是可读性较差，在同一页面中，字体种类少，版面雅致，有稳定感