商业网站设计

　　（1）网站设计

　　网站设计

　　网站设计是将策划案中的内容、网站的主题模式，以及结合自己的认识通过艺术的手法表现出来；它的表现形式为一个个网站页面效果图设计稿。是网站开发过程中的一个重要工作。

　　网站设计方案

　　即根据网站策划方案所确定并制作的网站整体设计方案，它包括网站总体风格及其表现效果图，各个二级页面效果图等，网站表现形式的总体设计方案。

　　网站制作

　　网站制作指运用网页技术，如Asp、Jsp、Php、Asp.net。使用标识语言（markuplanguage)，通过一系列设计、建模、和执行的过程将电子格式的信息通过互联网传输、浏览，制作出网站，使其以图形用户界面（GUI）的形式被用户所浏览。与网站设计紧密相联系，是网站开发中的一个重要过程。

　　网页设计与网页制作

　　网页设计就是设计具体的网站页面效果图。它属于平面设计的一种，但有别于普通的平面广告或平面影像设计，在设计时候除了要考虑平面美感、艺术感、还要考虑到用户体验、网站优化、网站营销方面的元素。一般来说，要用到网页设计软件Photoshop\Dreamweaver\Fireworks\Flash\HTML语言。而网页制作就是将网页设计师所设计出来的一个个页面设计稿，按照W3C规范用html语言将其制作成一个个Web网页格式

　　（2）如何设计网站

　　一、网站风格设计

　　风格(style)是抽象的。是指站点的整体形象给浏览者的综合感受。整体形象包括站点的版面布局、色彩、字体、浏览方式等。如：蓝蝶网络觉得迪斯尼是生动活泼的而IBM则是专业严肃的。每一个网站都会给人们留下的不同感受。这里蓝蝶网络需要做到的是根据网站的定位做出网站特有的风格。除此蓝蝶网络还需要在风格同一上需要把握一下，其实这个风格的统一和传统的印刷出版物没什么区别。你网页上所有的图像、文字，包括像背景颜色、区分线、字体、标题、注脚什么的，都要统一风格，贯穿全站。这样子用户看起来舒服、顺畅，会对你的网站留下一个“很专业”的印象。而企业网站设计师往往就缺乏这一点，没有全局意思。

　　创意，所谓创意就是不拘一格？某些设计师在做创意的时候大费周章，做出来确实不可否认很有创意、很别致，但往往对于行业网站的客户为什么不能接受呢？此时不要太责怪客户的不识货，应该反思，抓住客户的需求。其实做行业网站不需要很多大的创意，也不要浪费过多的时间去追求如何个性、如何好看，蓝蝶网络只需要一点小小的创意贯穿全站，也许会使网站更生动更具有吸引力、更有思想，比如中国现车交易网就是一个很好的案例，它把车的外形融入到网站中，使它脱颖而出。

　　二、网站LOGO设计

　　Logo顾名思义就是站点的标志图案，logo最重要的就是用图形化的方式传递网站的定位和经营理念、同时便于人们识别。网站logo的设计过程中一般有以下三种思路：1.直接以网站网址作为logo。2.根据网站提供的产品/服务特点展开logo设计。3.以传递网站运营商的经营服务理念为特色。

　　三、视觉流程设计

　　人们在阅读某种信息时，视觉总有一种自然的流动习惯，先看什么，后看什么，再看什么。在心理学的研究表明，一般的浏览习惯是从上到下、从左到右，在一个平面上，上松下稳而压抑。同样，平面的左松右稳。所以平面的视觉影响力上方强于下方，左侧强于右侧。这样平面的上部和中上部被称为“最佳视域”，也就是最优选的地方。在网页设计中一些突出或推荐的信息通常都放在这个位置。当然这种视觉流程只是一种感觉并非一种固定的公式，只要符合人们的心理顺序和逻辑顺序，就可以更为灵活地运用，在网页设计中，灵活运用直接影响到传达信息的准确与有效性。

　　四、网页框架与布局

　　网页布局大致可分为“国”字型、拐角型、“T”字型、“L”字型、综合框架型、Flash型、变化型，在这里就不做一一论述了。其实在蓝蝶网络做设计的时候并没有过多的去考虑什么形式，比如蓝蝶网络在一张纸看到一个圆形的东西，很容易可以联想到它像太阳，而有些人则联想到月亮等等…这都是一种形式比喻，最重要的是抓住客户的需求，把握网站的定位做处合理的框架布局。

　　1.分辨率

　　网页的整体宽度可分为三种设置形式：百分比、象素、象素+百分比。通常在网站建设中以象素形式最为常用，行业网站也不列外。蓝蝶网络在设计网页的时候必定会考虑到分辨率的问题，科技发展到现在蓝蝶网络通常用的是1024*768和800*600的分辨率，现在网络上很多都是用到778个象素的宽度，在800的分辨率下面往往使整个网页很压抑，有种不透气的感觉，其实这个宽度是指在800*600的分辨率上网页的最宽宽度，不代表最佳视觉，不妨试试760~770的象素，不管在1024还是800的分辨率下都可以达到较佳的视觉效果。

　　2．合理广告

　　在目前一些网站的广告（弹出广告、浮动广告、大广告、banner广告、通栏广告等等…）让人觉得很烦琐，根本就不愿意来看，有时连你这个网站都不上了，这样一来网站受到了严重的影响、广告也没达到广告的目的。这些问题都是蓝蝶网络在设计网站之前需要考虑、需要规划的内容之一。浮动广告有两种，第一种是在网页两边空余的地方可以上下浮动的广告，第二种是满屏幕到处随机移动的广告。建议能使用第一种的情况下尽量使用第一种，不可避免第二种情况时尽量在数量上控制最多一个就好。如果数量过多会直接影响到用户的心理、防挨到用户浏览信息，适得其反。首页广告不宜过多适中即可。如注册或某个购买步骤页面上最好不要出现过多的其他无关的内容让用户分心，避免客户流失

　　3．空间的合理利用

　　很多的网页都具有一个特点，用一个字来形容，那就是“塞”，它将各种各样的信息如文字、图片、动画等不加考虑的塞到页面上，有多少挤多少，不加以规范，导致浏览时会遇到很多的不方便。页面主次不分，喧宾夺主，要不就是没有重点，没有很好的归类，整体就像各大杂烩。让人难以找到需要的东西。有的则是一片空白失去平衡，也可以用个“散”字来形容。

　　并非要把整个页面塞满了才不觉得空，也并非让整个页面空旷才不觉得满，只要合理的安排、有机的组合，使页面达到平衡，即使在一边的部分大面积留空，同样不会让人感到空，相反这样会给人留下广阔的思考空间，给人回味又达到了视觉效果。

　　4．文字编排

　　网页设计中字体处理很关键。

　　1、文字图形化

　　文字图形化就是将文字用图片的形式来表现，这种形式在页面的子栏目里面最为常用，因为它具有突出，同时又美化了页面，使页面更加人性化加强了视觉效果。是文字无法达到的。对于通用性的网站弊端就是扩展性不强。

　　2、强调文字

　　如果将个别文字作为页面诉求重点，则可以通过加粗、加下划线、加大号字体、加指示性符号、倾斜字体、改变字体颜色等手段有意识地强化文字的视觉效果，使其在页面整体中显得出众而夺目。这些方法实际上都是运用了对比的法则。如果在更新频率低的情况下也可以使用文字图形化。

　　五、网站配色

　　1、用一种色彩。先选定一种色彩，然后调整透明度或者饱和度，(说得通俗些就是将色彩变淡或则加深)，产生新的色彩，用于网页。这样的页面看起来色彩统一，有层次感。

　　2、用两种色彩。先选定一种色彩，然后选择它的对比色(在Photoshop里按ctrl+shift+I)再进行微小的调整。整个页面色彩丰富但不花稍。

　　3、用一个色系。简单的说就是用一个感觉的色彩，例如淡蓝，淡黄，淡绿；或者土黄，土灰，土蓝。也就是在同一色系里面采用不同的颜色使网页增加色彩，而又不花，色调统一。这种配色方法在网站设计种最为常用。

　　4、灰色在网页设计中又称为“万能色”，其特点是可和任何颜色搭配，在使用时把握量避免网页变灰。在网页配色中，尽量控制在三种色彩以内，以避免网页花、乱、没有主色的显现。背景和前文的对比尽量要大，(绝对不要用花纹繁复的图案作背景)，以便突出主要文字内容。

　　（3）网站设计的原则

　　一、明确建立网站的目标和用户需求

　　Web站点的设计是展现企业形象、介绍产品和服务、体现企业发展战略的重要途径，因此我们必须明确设计站点的目的和用户需求，从而做出切实可行的设计计划。我们会根据消费者的需求、市场的状况、企业自身的情况等进行综合分析，以“消费者（customer)”为中心，而不是以“美术”为中心进行设计规划。

　　在设计规划时我们会考虑：建设网站的目的是什么？为谁提供服务和产品？企业能提供什么样的产品和服务？网站的目的消费者和受众的特点是什么？企业产品和服务适合什么样的表现方式与网站外在风格？

　　二、网页设计总体方案主题鲜明

　　在目标明确的基础上完成网站构思创意，确定总体设计方案。对网站的整体风格和特色作出定位，规划网站的组织结构。

　　网站应针对所服务对象不同而具有不同的形式。有些站点只提供简洁文本信息；有些则采用多媒体表现手法，提供华丽的图像、闪烁的灯光、复杂的页面布置，甚至可以下载声音和录像片段。有的则讲求实用。要做到主题鲜明突出，要点明确。

　　三、网站的版式设计

　　网页设计不等同于平面设计，但它们有许多相近之处。版式设计通过文字图形的空间组合，表达出和谐与美。多页面站点页面的编排设计要求把页面之间的有机联系反映出来，要特别要处理好页面之间和页面内的秩序与内容的关系。为了达到最佳的视觉表现效果，要反复推敲整体布局的合理性，使浏览者有一个流畅的视觉体验。

　　四、色彩在网页设计中的作用

　　色彩是艺术表现的要素之一。在网页设计中，设计师根据和谐、均衡和重点突出的原则，将不同的色彩进行组合．搭配来构成美丽的页面。根据色彩对人们心理的影响，合理地加以运用。如果企业有CIS（企业形象识别系统），应该按照其中的VI进行色彩运用。

　　五、网页设计形式与内容相统一

　　为了将丰富的意义和多样的形式组织成统一的页面结构，形式语言必须符合页面的内容，体现内容的丰富含义。灵活运用对比与调和、对称与平衡、节奏与韵律以及留白等手段，通过空间、文字、图形之间的相互关系建立整体的均衡状态，产生和谐的美感。如对称原则在页面设计中，它的均衡有时会使页面显得呆板，但如果加入一些富有动感的文字、图案，或采用夸张的手法来表现内容往往会达到比较好的效果。点、线、面作为视觉语言中的基本元素，巧妙地互相穿插、互相衬托、互相补充构成最佳的页面效果，充分表达完美的设计意境。

　　六、三维空间的构成和虚拟现实

　　网络上的三维空间是一个假想空间，这种空间关系需借助动静变化．图像的比例关系等空间因素表现出来。根据现有浏览器的特点，网页设计适合比较规范、简明的页面。

　　网页上常见的是页面上、下、左、右、中位置所产生的空间关系，以及疏密的位置关系所产生的空间层次，这两种位置关系使产生的空间层次富有弹性，同时也让人产生轻松或紧迫的心理感受。

　　除了HTML语言编制的二维Web页面，三维世界与虚拟现实在Web网上更能展示迷人风采，于是VRML语言出现了。VRML是一种面向对象的语言，它类似Web超级链接所使用的HTML语言，也是一种基于文本的语言，并可以运行在多种平台之上，只不过能够更多地为虚拟现实环境服务。

　　七、网页设计中多媒体功能的利用

　　要吸引浏览者注意力，网页的内容可以用三维动画、二维动画、FLASH、网络视频等来表现。适当时候可能还需要采用流媒体技术、P2P技术。

　　八、结构清晰并且便于使用。

　　使用一些醒目的标题或文字来突出您的产品与服务。并且即使您拥有最棒的产品，如果客户从您的网站上不清楚您在介绍什么或不清楚如何受益的话，他们是不会喜欢您的网站的，这就是网页设计的失败。

　　九、导航清晰。

　　网页设计中导航使用超文本链接或图片链接，使人们能够在您的网站上自由前进或后退，而不会让他们使用浏览器上的前进或后退。在所有的图片上使用“ALT”标识符注明图片名称或解释，以便那些不愿意自动加载图片的观众能够了解图片的含义。

　　十、快速的下载时间。

　　很多的浏览者不会进入需要等待5分钟下载时间才能进入的网站，在互联网上30秒的等待时间与我们平常10分钟等待时间的感觉相同。因此，我们会建议您在网页设计中尽量避免使用过多的图片及体积过大的图片。我们通常会与客户合作，将主要页面的容量控制在50K以内，平均30K左右，确保普通浏览者页面等待时间不超过10秒。

　　十一、非图形的内容。

　　我们在必要时适当使用动态“Gif”图片，为减少动画容量，应用巧妙设计的Java动画可以用很小的容量使图形或文字产生动态的效果。但是，由于在互联网浏览的大多是一些寻找信息的人们，我们仍然建议您要确定您的网站将为他们提供的是有价值的内容，而不是过度的装饰。

　　十二、方便的反馈及订购程序。

　　让客户明确您所能提供的产品或服务并让他们非常方便地订购是您获得成功的重要因素。如果客户在您的网站上产生了购买产品或服务的欲望，您是否能够让他们尽快实现吗？是在线还是离线？