网站策划与设计笔记

网站策划与设计笔记目录第一章网站整体设计第一节：明确站点的目标与需求一、建站的目的与意图二、为谁建站：（当然是为用户——UCD设计模式的重要性）三、定义站点的类型：第二节：站点整体规划与设计一、内容为王：站点的内容，是站点的内涵与价值所在二、功能：三、架构：即组织网站各个网页栏目的逻辑结构四、界面：即具体的网页页面，网站效果图设计即界面设计五、视觉：形象与风格第三节：技术实现一、设计草图与原型（雏形效果图）二、页面需求描述：三、页面效果图设计：一般设计2—3张效果图供客户选择四、网站计划书撰写：第二章网页设计原理第一节：网页布局设计一、网页布局的原理二、网页构成的形式美原理三、网页构成的形式法则（即网页设计的创意方法）四、网页构成的形态要素——点、线、面第二节：网页色彩设计一、色彩的常识1、色彩的三要素：色相、明度、纯度2、色彩的分类：分为原色、间色、复色、补色四类3、色彩的性质：4、色彩的调子：二、色彩心理感觉1、色彩的冷、暖感2、色彩的轻、重感4、色彩的前、后感5、色彩的大、小感6、色彩的华丽、质朴感三、色相心理分析四、色彩的联想特征五、网页色彩计划1、主色、辅色与强调色的选取2、网页背景色、多媒体元素色、文字颜色的选取与确定第三节：网页元素设计一、文字与排版二、图形元素三、声音与视频四、导航元素五、表单控件第一章网站整体设计第一节：明确站点的目标与需求一、建站的目的与意图1、为什么要建这个站？建这个站是为了什么？2、需求是设计的源头——有需求才有设计，没有需求就没有设计二、为谁建站：（当然是为用户——UCD设计模式的重要性）1、站点的用户是谁？2、谁会对所建的站点感兴趣？3、他们为什么要访问该站点？4、什么样的功能内容及风格对用户有吸引力？5、从哪些方面去研究用户？01定义主要的目标用户02分析目标用户的特征，建立用户模型：（用户模型是对用户的年龄、职业、经济状况、性别、国家、教育背景、文化背景、生活方式、婚姻状况、生存状况、性格等特征进行有效的分析）03明确用户的真实需求三、定义站点的类型：1、按照网站主体性质划分：政府网站、企业网站、商业网站、教育科研机构网站、个人网站、其它非盈利机构网站。2、按照网站功能划分：01、产品(服务)查询展示型网站:本类网站核心目的是推广产品(服务)，是企业的产品“展示框”。利用网络的多媒体技术，数据库存储查询技术，三维展示技术，配合有效的图片和文字说明，将企业的产品(服务)充分展现给新老客户，使客户能全方位的了解公司产品。与产品印刷资料相比，网站可以营造更加直观的氛围和产品的感染力，促使商家及消费者对产品产生采购欲望，从而促进企业销售。02、品牌宣传型网站:本类网站非常强调创意设计，但不同于一般的平面广告设计。网站利用多媒体交互技术，动态网页技术，配合广告设计，将企业品牌在互联网上发挥得淋漓尽致。本类型网站着重展示企业CI、传播品牌文化、提高品牌知名度。对于产品品牌众多的企业，可以单独建立各个品牌的独立网站，以便市场营销策略与网站宣传统一。03、企业涉外商务网站:通过互联网对企业各种涉外工作，提供远程、及时、准确的服务，是本类网站的核心目标。本网站可实现渠道分销、终端客户销售、合作伙伴管理、网上采购、实时在线服务、物流管理、售后服务管理等，它将更进一步的优化企业现有的服务体系，实现公司对分公司、经销商、售后服务商、消费者的有效管理，加速企业的信息流、资金流、物流的运转效率，降低企业经营成本，为企业创造额外收益，降低企业经营成本。04、网上购物型网站:通俗的说，就是实现网上买卖商品，购买的对象可以是企业(B2B)，也可以是消费者(B2C)。为了了确保采购成功，该类网站需要有产品管理、订购管理、订单管理、产品推荐、支付管理、收费管理、送发货管理、会员管理等基本系统功能。复杂的物品销售、网上购物型网站还需要建立积分管理系统、VIP管理系统、客户服务交流管理系统，商品销售分析系统以及与内部进销存(MIS，ERP)打交道的数据导入导出系统等。本类型网站可以开辟新的营销渠道，扩大市场，同时还可以接触最直接的消费者，获得第一手的产品市场反馈，有利于市场决策。05、企业门户综合信息网站:本类网站是所有各企业类型网站的综合，是企业面向新老客户、业界人士及全社会的窗口，是目前最普遍的形式之一。该类网站将企业的日常涉外工作上网，其中包括营销、技术支持、售后服务、物料采购、社会公共关系处理等。该类网站函盖的工作类型多，信息量大，访问群体广，信息更新需要多个部门共同完成。企业综合门户信息网站有利于社会对企业的全面了解，但不利于突出特定的工作需要，也不利于展现重点。06、行业、协会信息门户/B2B交易服务型网站:本类网站是所有各企业类型网站的综合，是企业面向新老客户、业界人士及全社会的窗口，是目前最普遍的形式之一。该类网站将企业的日常涉外工作上网，其中包括营销、技术支持、售后服务、物料采购、社会公共关系处理等。该类网站函盖的工作类型多，信息量大，访问群体广，信息更新需要多个部门共同完成。企业综合门户信息网站有利于社会对企业的全面了解，但不利于突出特定的工作需要，也不利于展现重点。07、沟通交流平台:本系统采用利用互联网，将分布在全国的生产、销售、服务和供应等环节联系在一起，改变过去利用电话、传真、信件等传统沟通方式。可以对不同部门、不同工作性质的用户建立无限多个的个性化网站;提供内部信息发布、管理、分类、共享等功能，汇总各种生产、销售、财务等数据;提供内部邮件、文件传递、语音、视频等多种通信交流手段。08、政府门户信息网站:利用政务网(或称政府专网)和内部办公网络而建立的内部门户信息网，是为了方便办公区域以外的相关部门(或上、下级机构)，互通信息、统一数据处理、共享文件资料而建立的。主要包括如下功能：提供多数据源的接口，实现业务系统的数据整合;统一用户管理，提供方便有效的访问权限和管理权限体系;可以方便建立二级子网站和部门网站;实现复杂的信息发布管理流程。第二节：站点整体规划与设计一、内容为王：站点的内容，是站点的内涵与价值所在1、站点内容的主要来源：01编辑整理编撰02原创03转载04其他途径获取二、功能：1、常见的网站功能模块：产品展示发布系统、会员管理系统、信息发布系统(新闻发布系统)、权限管理系统、论坛系统、资料下载系统、邮件管理系统、信息检索系统、在线招聘系统、留言板系统、网上商城系统、网上调查系统、文件传输系统、访问统计系统、站点计数器、公告系统、购物车系统等2、客户需要的其他功能，根据客户的需求开发三、架构：即组织网站各个网页栏目的逻辑结构1、网站常见的架构：线性结构、层级结构、网状结构四、界面：即具体的网页页面，网站效果图设计即界面设计1、界面规划与设计的主要内容有哪些：01根据站点信息架构确定站点页面构成（换言之，就是统计整个网站要设计多少个有效的网页界面，及各个界面之间链接跳转的关系。）02明确每个页面的内容（即页面要放置哪些栏目）与功能，确定页面的元素与结构（即排版布局）03页面展示效果的实现（如幻灯片、滑动面板、动画等等）2、网页界面的构成元素：01导航元素：各种菜单、链接02形象元素：如动画、展示图片等，不仅传递着特定的信息，而且对调节页面气氛、吸引受众也起着重大的作用。03功能元素：指用户与站点进行交互，以实现某种功能的元素，如为页面提供一个搜索框，登录框等。04内容元素：栏目列表信息、栏目的摘要信息等等文字信息内容五、视觉：形象与风格1、站点的设计风格：01信息主体型风格：以信息展示为主的，如新闻门户型网站02印象型主体风格：强调视觉的体验与效果，艺术性强03均衡型风格：前面两者兼备第三节：技术实现一、设计草图与原型（雏形效果图）二、页面需求描述：即页面要摆放哪些栏目、需要哪些功能、应该有什么样的展示效果等。1、页面描述的方式：01线框型描述：即用图形表示出来02文字描述：撰写文案，详细叙述页面的功能内容三、页面效果图设计：一般设计2—3张效果图供客户选择四、网站计划书撰写：1、网站计划书的主要内容01建站的背景分析：相关行业背景分析、竞争对手分析、公司自身条件分析等。02站点目标分析：建站的目的与意图、目标用户分析、站点类型及需求分析。03内容与功能规划：根据站点目标和用户需求确定站点应包含的内容和功能、站点的栏目组成和功能架构。04界面设计方案：站点界面规划与组成，站点页面需求描述、站点的视觉形象设计方案。05站点技术方案：技术方案所要达到的目标（如数据精度、流量指标、响应速度等），项目所采用的软、硬件技术（如确定屏幕尺寸、浏览器类型、服务器类型、数据库类型、操作系统等）06站点的进度计划、费用预算等07网站维护与更新方案第二章网页设计原理第一节：网页布局设计一、网页布局的原理1、平衡与稳定：结构的对称，不失衡。2、焦点与主次：分清楚焦点与主次，重点地方要强调突出，达到醒目的效果。3、秩序与统一：4、对比与变化：二、网页构成的形式美原理1、平衡：分为绝对平衡(即对称)与相对平衡01对称的基本形式：反射、移动、回转、扩大2、对比：01形象与形象之间的对比：大小、远近、方向、多少、曲直、虚实、明暗等对比02形象与空间的对比：正负、疏密、面积等对比03色彩对比：指色彩的色相、明度、纯度、冷暖等对比3、调和：分形象特征的调和、色彩调和、方向调和4、节奏：指高低、强弱、长短、抑扬顿挫之美5、变异：“万绿丛中一点红”、鹤立鸡群等1、变异的形式：位置、形象、方向、大小、色彩等变异6、数理比例美三、网页构成的形式法则（即网页设计的创意方法）1、重复与近似2、分割与比例3、渐变与发射4、对比构成：5、特异构成6、空间构成（三维空间）7、打散重构8、肌理四、网页构成的形态要素——点、线、面1：点：是造型的原生因素。几何学概念所谈的点，仅表示位置.它没有大小面积表示。一条线的开始与结束或者两条线相接之处点的感觉与位置联想。点有各种各样的形状、有规则和非规则的越小的点、点的感觉愈强但显的柔弱、点涿渐增大时，则趋向于面的感觉，这时点起着重要的作用，或以几何形式出现或以具象行出现但无论作为细小特征的点应尽可能采用单纯简洁、强韧有力的形式。当画面只有一个点时，常常容易成为视觉中心吸引人的视线，点从背影中越出，与画面周围空间发生作用。点居与画面中心位置时，与画面的空间关系显的很和谐；当点位居于画面边缘时就改变了画面的静态平衡关系，形成了紧张感而造成动势。如果画面有另一个点产生便形成两点之间的视觉张力，人的视线就会在两点之间来回流动、形成一种新的视觉关系，而使点与背景的关系退居第二位。当两个点有大小区别时，视觉就会由大到小的点的流动，潜藏着明显的运动都趋势，具备了时间的因素。推而言之，画面中有三个点时，实现就在着三个点之间流动，令人产生三角形面的。众多点的聚散，引起能量和张力的多样化，这种复杂性常常给画面生动的情趣。点的连续排列形成虚的线，其距离越近时，线的特性就愈显著。点的间隔排列，具有井然有序的美感。如加上点的大小变化，就产生变化丰富的视觉效果点依据水平或垂直方向排列，成为静的构成。相反，点沿着斜线，曲线，旋涡线排列，或者以自由方式排列，则形成动的构成将点的大小渐变运动的排列。能形成有动感和深度感的构成。应用点的大小、多少、聚散、连接或不连接等变化排列，形成有节奏、韵律感的构成。通过点的均散排列，形成画面的肌理效果。2：线：是由点运动形成的，运动成为线的重要征。两点之间最短距离的线便是直线。直线反映了运动最简洁的形态。直线类撕男性的阳刚品格：果断、明确、理性、坚定、具有速度和坚强感。方向不断改变的点的运动形成曲线。曲线类似女性的阴柔品格：柔和、丰满、优雅、感性、含蓄和富有节奏感。曲线大致又可分为几何曲线和自由曲线两种形式。几何曲线规律性强，有圆、圆弧、抛物线等样式，有明确、清晰、易于制作和识别的特性。具有弹性和富于动感变化的自由曲线，则表达一种有机生命形态的形式。即兴的自由曲线展现了个性化的特征，其线条很难重复线条增加其宽度会倾向于面的特性，粗的线能增加力度和厚重感。细的线显得纤细、敏锐而柔