[项目31 网站设计标准.pptVIP

设计规范作用及意义 适用于Web产品线的人机交互界面设计，贯穿以用户为中心的设计指导方向 根据Web产品的特点指定一套规范，以达到提升用户体验，控制产品设计质量、提高设计效率、达到极高的准确的目的。 统一识别、节约设计时间资源、重复利用、上手简单 示例分析 （1）案例 在一次讨论网站设计规范专题会议上，B公司软件开发部负责人张文讲述了一个发生在以前一个项目开发过程中的一件事。 事情的大致情况是说某一天例会上，张文在听取每个小组分别汇报前一天的工作情况时，发现有两个开发小组都在自己功能目录下新建了一个子目录，用来存放图片。一个小组建立了image子目录，而另一个小组建立了images子目录。于是张文严厉地批评了不按规范操作的一个开发小组，责令立即修改且不能延误当天的开发任务。 于是张文要求与会者判断哪一个开发小组违反了哪条操作规范。 示例分析 1) 链接结构 ◆ 树状链接结构（一对一） ◆ 星状链接结构（一对多） 2) 链接规范 ◆ 新闻、信息类通常用新开窗口方式打开 ◆ 顶导航、底部导航通常采取在本面打开，特殊栏目和功能可新开窗口 ◆ 链接带下划线为链接通常的默认网格、顶部导航或特殊位置为观赏性可用样式表取消下划线 ◆ 链接的颜色可配合主题颜色风格改变，通常蓝色、暗蓝色、黑色,但激活的链接颜色、鼠标移动其上应有所变化 1）日期时间和数字 2）欢迎词 3）弹出窗口和引导页面 4）新闻和公告信息 5）控件 6）链接 7）主页内容 1）首先考虑功能，然后才是表现 2）从用户的视角看问题，使用用户的词汇进行描述 3）不要向用户暴露实现细节 4）使常用的用户任务简单化 5）保持一致性，引导用户的使用习惯 6）设计应响应需求 7）灵活性 8）个性化 基本理念 “整体协调，局部对比” 。 1）确定主体色、使用相近色、运用黑白灰　 2）色彩要有可读性：尽量减小屏幕刺激，减轻视觉疲劳，文本要易读，图像易于区别 3）色彩要鲜明：鲜艳明亮，能用彩色的就不用无彩 4）色彩要独特：色彩符合所属类型网特点的，并有自己的独特性 5）色彩有相关性：考虑色彩的象征意义和色彩意象，体网站的网面色彩主题特色和内涵，符合访问者的类型、社会背景、心理需求等的要求。 6）色彩要协调统一：一个网站可用多种色彩，不至于单调，但必有一种或两种主题色，否会迷方向，但不是给人轻浮、花销的感觉。 项目一　网站设计规范标准分析及风格 1）任务实施　　　　　（2.5学时） ① 网站的主题、UI风格、色彩的分析(确定主体色、相近色、黑白灰等) ; ② 网站设计规范标准的分析； ③ 编写严密的、完整的“网站设计规范标准说明书” 包括目的、网站设计界面、存储目录名、文件名规范、代码规范 完成在建设网站中的模块功能目录名 、主要文件名的设计及其用途说明； 2）学习成果评估　　　（0.5学时） ① 是否完成网站的风格的确认(可选择典型网站进行参考)，写入到网站设计规范标准说明书； ② 是否形成详细的、严密的、完整的“网站设计规范标准说明书”(网站设计界面、网站存储目录名、文件名规范)， 完成在建设网站的模块功能目录名 、主要文件名的设计及其说明； ③ 以小组为单位PPT内容展示，要求每组交流时间20分钟以内，完成组员代表阐述以及其他组员补充说明，其他小组提出看法及改进意见； ④ 检查项目成员是否明确网站设计的核心规范。 在互联网上下载一整套免费的的网站源程序代码，分析其网站目录建设、网站文件命名、数据字典命名、网页head区代码、网站代码编写是否规范，得到规范的内容，以及不规范的内容。 本课的纪律、学习主动性的评价。 对每个小组开展情况进行简要点评。 提出要求：小组讨论要积极参与，增加主动性，才能有所收获。 课堂任务实践 Evaluation only. Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0. Copyright 2004-2011 Aspose Pty Ltd. Evaluation only. Created with Aspose.Slides for .NET 3.5 Client Profile 5.2.0.0. Copyright 2004-2011 Aspose Pty Ltd. 课堂任务实践 Evaluation only. Created with Aspose.Slides for .NET 3