第3章网站系统设计

第3章网站系统设计内容摘要：

要把主页的设计尽量做得漂亮。 但随着网站建设的发展 ， 人们越来越清楚地认识到 ， 这种看法有极大的片面性。 主页设计得好 ， 自然会吸引人们的注意 ，但这种吸引是暂时的 ， 要想长期吸引住浏览者 ， 最终还是靠网站内容的不断更新。 每次更新的网页内容尽量要在主页中提示给浏览者。 由于网站内容的结构一般都是树形结构 ， 所有文章都包含在各级版块或栏目里。 因此 ， 如果每次更新的网页内容全都被放进了各级版块和栏目中 ， 浏览者并不知道更新了哪些东西 ， 如果让用户到版块或栏目中去查找 ， 不是一个好的方法。 所以在这种情况下 ， 一定要在首级主页中显示出最新更新的网页目录 ， 以便于访问者浏览。 第 3章 网站系统设计 3. 完善检索能力 对于一个网站来说 ， 如何合理地组织自己要发布的信息内容 ， 以便让浏览者能够快速 、 准确地检索到要查寻的信息 ， 这是一个网站是否成功的关键。 如果当用户进入一个网站后不能迅速地找到自己要找的内容 ， 那么这个网站就很难吸引住浏览者。 解决这个问题 ， 通常可通过对网站内容的全中文检索来实现。 如果一个网站只有几十页内容 ， 则根本不用进行全中文检索 ， 用遍历方法就可查洵。 但如果 — 个网站有几百甚至几千个网页怎么办 ， 遍历法显然不行。 因此 ， 从实际应用上 ， 一定规模的网站一定要提供全中文的检索能力 ， 以便于用户查找本网站的信息。 4. 网站的信息交互能力 如果一个网站只是为访问者提供浏览 ， 而不能引导浏览者参与到网站内容的部分建设中去 ， 那么它的吸引力是有限的。 只有当浏览者能够很方便地和信息发布者相互交流 ， 该网站的魅力才能充分体现出来。 第 3章 网站系统设计 Web站点的设计要点 各种类型的 web站点的设计侧重点不同 ， 但总的说来有如下设计要点。 1. 目标明确 、 定位正确 Web站点的设计是企业或机构发展战略的重要组成部分。 想要将企业站点作为因特网这个新媒体上展示企业形象 、 企业文化的信息空间 ，领导一定要给予足够的重视 ， 明确设计站点的目的和用户需求 ， 从而做出切实可行的计划。 挑选与锤炼企业的关键信息 ， 利用一个逻辑结构有序地组织起来 ，开发一个页面设计原型 ， 选择用户代表来进行测试 ， 并逐步精炼这个原型 ， 形成创意。 分析有些网站的效果不如预想的好 ， 主要原因是对用户的需求理解有偏差 ， 缺少用户的检验造成的。 设计者常常将企业的市场营销和商业目标放在首位 ， 而对用户和潜在的用户的真正需求了解不多。 第 3章 网站系统设计 所以 ， 企业或机构应清楚地了解本网站的用户群体的基本情况 ， 如受教育程度 、 收入水平 、 需要信息的范围及深度等 ， 从而能够有的放矢。 2. 主题鲜明 、 富有特色 在目标明确的基础上 ， 完成网站的构思创意即总体设计方案。 对网站的整体风格和特色做出定位 ， 规划网站的组织结构。 Web站点应针对所服务对象 （ 机构或人 ） 不同而具有不同的形式。 有些站点只提供简洁文本信息；有些则采用多媒体表现手法 ， 提供华丽的图像 、 闪烁的灯光 、 复杂的页面布置 ， 甚至可以下载声音和录像片段。 最好的 Web站点将把图形图像表现手法与有效的组织与通信结合起来。 要做到主题鲜明突出 ， 力求简洁 ， 要点明确 ， 以简单明确的语言和画面告诉大家本站点的主题 ， 吸引对本站点有需求的人的视线 ， 对无关的人员也能留下一定的印象。 对于一些行业标志和公司的标志应充分加以利用。 第 3章 网站系统设计 调动一切手段充分表现网站的个性和情趣 ， 突出个性 ， 办出网站的特色。 Web站点主页应具备的基本成分包括： （ 1） 页头：准确无误地标识你的站点和企业标志； （ 2） Email地址：用来接收用户垂询； （ 3） 联系信息：如普通邮件地址或电话； （ 4） 版权信息。 注意重复利用已有信息 ， 如客户手册 、 公共关系文档 、 技术手册和数据库等可以轻而易举地用到企业的 Web站点中。 3. 版式编排布局合理 网页设计作为一种视觉语言 ， 当然要讲究编排和布局 ， 虽然主页的设计不等同于平面设计 ， 但它们有许多相近之处 ， 应充分加以利用和借鉴。 第 3章 网站系统设计 版式设计通过文字图形的空间组合 ， 表达出和谐与美。 版式设计通过视觉要素的理性分析 ， 和严格的形式构成训练 ， 培养对整体画面的把握能力和审美能力。 一个优秀的网页设计者也应该知道哪一段文字 、 图形该落于何处 ， 才能使整个网页生辉。 努力做到整体布局合理化 、 有序化 、 整体化。 优秀之作 ， 善于以巧妙 、合理的视觉方式使一些语言无法表达的思想得以阐述 ， 做到丰富多样而又简洁明了。 多页面站点页面的编排设计要求把页面之间的有机联系反映出来 ， 这里主要的问题是页面之间和页面内的秩序与内容的关系。 为了达到最佳的视觉表现效果 ， 应讲究整体布局的合理性。 特别是关系十分紧密的有上下文关系的页面 ， 一定要设计向前和向后的按钮 ， 便于浏览者仔细研读。 第 3章 网站系统设计 站点设计简单有序 ， 主次关系分明 ， 将零乱页面的组织过程混杂的内容依整体布局的需要进行分组归纳 ， 经过进行具有内在联系的组织排列 ， 反复推敲文字 、 图形与空间的关系 ， 使浏览者有一个流畅的视觉体验。 4. 色彩和谐重点突出 色调及黑 、 白 、 灰的三色空间关系不论在设计还是在绘画方面都起着重要的作用。 在页面上一定得明确 、 协调 、 和谐 ， 而其它有色或无色的内容均属黑 、 白 、 灰的三色空间关系 ， 从而构成它们的空间层次。 色彩是艺术表现的要素之一 ， 它是光刺激眼睛再传导到大脑中枢而产生的一种感觉。 在网页设计中 ， 根据和谐 、 均衡和重点突出的原则 ， 将不同的色彩进行组合 、 搭配来构成美丽的页面。 第 3章 网站系统设计 利用色彩对人们心理的影响的成果 ， 合理地加以运用。 按照色彩的记忆性原则 ， 一般暖色较冷色的记忆性强。 色彩还具有联想与象征的特质 ， 如：红色象征火 、 血 、 太阳；蓝色象征大海 、 天空和水面等。 所以设计出售冷食的虚拟店面 ， 应使用消极而沉静的颜色 ， 使人心理上感觉凉爽一些。 在色彩的运用过程中 ， 还应注意的一个问题是：由于国家和种族的不同 ， 宗教和信仰的不同 ， 生活的地理位置 、 文化修养的差异 ， 不同的人群对色彩的喜恶程度有着很大差异。 如：儿童喜欢对比强烈 、 个性鲜明的纯颜色；生活在草原上的人喜欢红色；生活在闹市中的人喜欢淡雅的颜色；生活在沙漠中的人喜欢绿色。 在设计中要考虑主要读者群的背景和构成。 第 3章 网站系统设计 5. 形式内容和谐统一 形式服务于内容 ， 内容又为目的服务 ， 形式与内容的统一是设计网页的基本原则之一。 画面的组织原则中 ， 将丰富的意义和多样的形式组织在一个统一的结构里 ， 形式语言必须符合页面的内容 ， 体现内容的丰富含义。 运用对比与调和 ， 对称与平衡 ， 节奏与韵律以及留白等手段 ， 如通过空间 、 文字 、 图形之间的相互关系建立整体的均衡状态 ， 产生和谐的美感。 如对称原则在页面设计中 ， 它的均衡有时会使页面显得呆板 ， 但如果加入一些动感的文字 、 图案 ， 或采用夸张的手法来表现内容往往会达到比较好的效果。 点 、 线 、 面是视觉语言中的基本元素 ， 使用点 、 线 、 面的互相穿插 、 互相衬托 、 互相补充构成最佳的页面效果。 第 3章 网站系统设计 （ 1） 点是所有空间形态中最简洁的元素 ， 也可以说是最活跃 、 最不安分的元素。 设计中 ， 一个点就可以包罗万象 ， 体现设计者的无限心思 ， 网页中的图标 ， 单个图片 ， 按钮或一团文字等都可以说是点。 点是灵活多变的 ， 我们可以将一排文字视为一个点 ， 将一个图形视为一个点。 在网页设计中的点 ， 由于大小 、 形态 、 位置的不同而给人不同的心理感受。 （ 2） 线是点移动的轨迹 ， 线在编排设计中有强调 、 分割 、 导线 ，视觉线的作用。 线会因方向 、 形态的不同而产生不同的视觉感受 ，例如垂直的线给人平稳 、 挺立的感觉 ， 弧线使人感到流畅 、 轻盈；曲线使人跳动 、 不安。 在页面中内容较多时 ， 就需进行版面分割 ，通过线的分割保证页面良好的视觉秩序 ， 页面在直线的分割下 ， 产生和谐统一的美感；通过不同比例的空间分割 ， 有时会产生空间层次韵律感。 第 3章 网站系统设计 （ 3） 面的形态除了规则的几何形体外 ， 还有其它一些不规则的形态 ，可以说表现形式是多种多样的。 面在平面设计中是点的扩大 ， 线的重复形成的。 面状给人以整体美感 ， 使空间层次丰富 ， 使单一的空间多元化 ，在表达较含蓄。 网页设计中点 、 线 、 面的运用并不是孤立的 ， 很多时候都需要将它们结合起来 ， 表达完美的设计意境。 6. 多媒体功能的利用 最大资源优势在于多媒体功能 ， 因而要尽一切努力挖掘它 ， 吸引浏览者保持注意力。 因而画面的内容应当有一定的实用性 ， 如产品的介绍甚至可以用三维动画来表现。 这里需要注意的问题是 ， 由于网络带宽的限制 ， 在使用多媒体的形式表现网页的内容时应考虑客户端的传输速度 ， 或者说将多媒体的内容控制在用户可接收的下载时间内是十分必要的。 第 3章 网站系统设计 7. 相关站点引导链接 一个好的网站的基本要素是用户进入后 ， 与本网站相关的信息都可以方便快捷地找到 ， 其中要借助于相关的站点 ， 所以做好导引是一项重要的工作。 超文本这种结构使全球所有联上因特网的计算机成为超大规模的信息库 ， 链接到其它网站轻而易举。 在设计网页的导引组织时 ， 应该给出多个相关网站的链接 ， 使得用户感到想得到的信息就在鼠标马上就可以点击的地方。 8. 网站测试必不可少 为什么精心设计的网站是经得起推敲的 ， 就是因为它经过认真细致的测试。 测试实际上就是模拟用户访问网站的过程 ， 得以发现问题改进设计。 第 3章 网站系统设计 由于一般网站设计都是一些专业人员设计的 ， 他们对计算机和网络有较深的理解 ， 但要考虑到访问网站的大部分人只是使用计算机和网络 ， 应切实满足他们的需要。 所以有许多成功的经验表明 ， 让对计算机不是很熟悉的人来参加网站的测试工作效果非常好 ， 这些人会提出许多专业人员没有顾及到的问题或一些好的建议。 9. 合理地运用新技术 因特网是 IT界发展最快的领域 ， 其中新的网页制作技术几乎每天都会出现 ， 如果不是介绍网络技术的专业站点 ， 一定要合理地运用网页制作的新技术 ， 切忌将网站变为一个制作网页的技术展台 ， 永远记住用户方便快捷地得到所需要的信息是最重要的。 但对于网站设计者来说 ， 必须学习跟踪掌握网页设计的新技术 ， 如Java、 DHTML、 XML等 ， 根据网站的内容和形式的需要合理地应用到设计中。 第 3章 网站系统设计 要将企业站点作为在 Inter上展示企业形象 、 企业文化的信息中间 ， 有明确目标 、 良好定位的 Web站点设计是企业或机构发展战略的重要组成部分。 对此 ， 主管部门一定要给予足够的重视 ， 明确设计站点的目的和用户需求 ， 从而做出切实可行的计划。 挑选与锤炼企业的关键信息 ， 利用逻辑结构有序地组织起来 ， 并开发一个页面设计原型 ， 选择代表性用户来进行测试 ， 然后逐步精炼这个原型 ，最终形成创意。 Web站点的设计流程 在 Web站点的设计阶段 ， 主要包括以下设计工作。 1. 收集该站点的关键信息 它包括站点的目标客户 、 拟发布内容 、 Web服务器开发平台等。 2. 概念开发 设计人员根据收集的信息进行构思。 通常 ， 设计人员要把这些构思用草图的形式呈现给顾客代表 ， 这个草图要有整个网站的结构 、不同的布局设计及导航。 第 3章 网站系统设计 3. 内容综合 设计人员开始制作一些初始图样 ， 这些图样用诸如 Photoshop的应用程序来创建 ， 然后 ， 设计人员将图样打印出来 ， 配上文字说明。 4. HTML布局和导航 一旦客户同意了这些内容 ， 设计人员开始编制 Web页面 ， 导航器也被编制到页面中 ， 使客户有所体验。 5. 图形制作 如果客户同意了站点的外观和设计思想 ， 设计人员将大量制作所需的图形 ， 并进行优化。 简洁明快 、 独具特色 、 保持统一的网站风格能让用户产生深刻印象 ， 不断的来访问。 优秀的网页画面少不了漂亮的图像 ， 但更重要的是布局效果。 网页布局采用的主要技术是HTML的表格 （ Table）。