网站设计版面布局的技巧(转载) - 网站设计资讯 -
上海VI设计公司联系电话

网站设计资讯/news

首页>设计资讯 > 网站设计资讯 > 详情

网站设计版面布局的技巧(转载)

   Data:2016-08-24 22:55:57;来源:   上海品牌设计
  首页:网站的门面,犹如公司的形象,分外注重设计和规划。
  框架页:网站的首要结构页面,又称次首页、内页,年夜型网站每每框架页即首页,如一些门户网站。框架页首要是网站内部首要栏目标首页,讲求作风的同等性,并于主页照应。 
  通俗页:网站首要的承载信息的页面,设计要求不高,但要求链接精确、笔墨无误、图文并茂,并因循网页的作风。 
  弹出页:一样平常用于告白、新闻、新闻、到其他网站的链接等等,一样平常用的很少。 
  经由过程上面的阐发,咱们可以看出: 
  从功效上来看,首页首要负担着建立企业形象(当然不仅仅是首页)的作用,框架页在导航方面起侧紧张的作用,康复比各栏目内部首要内容的先容,都可以在框架页中体现再进入通俗页,让阅读者可以或许敏捷相识网站各栏目标首要内容,择其需要而阅读,而通俗页则是首要的信息页面,也是网站的终极页面,对付年夜型网站,这种结构异常紧张,而对付中小型企业,网站范围较小、页面数目不多,有时框架页就起着通俗页的作用,至于弹出页,倡议您不是需要,最康复不要用。下面具体先容各页面的设计技能:
  一、首页设计技能 
  网站首页是企业网上的虚构门面,在此,提示上彀的企业注重本身门面的设计,决不克不迭搪塞了事、敷衍了事。咱们会常常看到印刷精巧的产物目次或告白,当您屡屡看到那些印有产物目次或告白的精巧印刷成品的时刻,信任您或多或少会对有关的产物形成一种康复感,纵然您不会购置,也必然对这些产物形成必定水平的认同。而对付设计毛糙的鼓吹品,您确定会狐疑其内容的真实性,从而对其产物或效劳发生质疑。康复,如今说说网站的设计,信任您会批准这种说法:网站的页面就康复比是“无纸的印刷品”。既然如斯,咱们会是以而得出一个论断:优良和专业网站的设计,犹如制造精巧的印刷品,会年夜年夜刺激花费者(拜访者)的购置欲望,反之,您公司所提供的产物或效劳将不会给花费者(拜访者)留下较康复的印象。值得一提的是,除非您的企业有专业的网站规划、设计职员,不然您最康复找专业公司或专业职员为您设计制造,一个优异的专业设计职员会很快明确您的用意,并依据您的建站目标提出建设性的定见。
  一样平常来说,网站首页的情势不过乎有两种,一种是纯洁的形象展现型,这品种型笔墨信息较少,图像信息较多,经由过程艺术外型和设计结构,应用一系列与公司形象和产物、效劳有关的图像、笔墨信息,构成一幅生动的画面,向阅读者展现一种形象、一个气氛,从而吸收阅读者进入阅读。这需要设计者具有优越的设计根基和审美才能,可以或许尽力发掘企业深层的内在,展现企业文明。这品种型的首页在设计进程中必定要明确要以设计为主导,经由过程颜色、结构给拜访者留下深入的印象,当然,咱们不克不迭为了设计而设计,咱们的目标是营销,在设计进程中必定要切记这一点!
  另一种是信息枚举型,一样平常的年夜、中型企业网站和门户网站常用的体式格局,即在首页中就枚举出网站的首要内容分类、重点信息、网站导航、公司信息等等,也便是咱们上面谈到的框架页,这种作风比拟得当网站信息量年夜,内容丰硕的网站,由于是以展现信息为主,这是的设计就要在细微之处体现企业形象,倡议设计职员最康复细心阅读企业的CI手册,熟悉企业标记、祥瑞物、字体及用色尺度,在网站的局部体现出来,每每平庸之中一个柔美的相符企业特色的曲线就可以或许给人以深入的印象,从而将企业形象印在阅读者的脑海里。设计职员在设计进程中要注重运用这些言语符号来抒发一种奇特的企业信息。
  二、作风坚持同等——内页设计技能 
  若何坚持网站作风的同等,是进行内页设计进程中斟酌的紧张方面,依据我的履历,您可以测验考试以下几种设计体式格局: 
  1、结构的同等性:咱们晓得,网站的统一性在网站营销中占紧张位置,而网站结构是网站作风统一的紧张手腕,包含网站结构、笔墨排版、装潢性元素呈现的位置、导航的统一、图片的位置等等,到国外有名的电子商务网站阅读,你会发现这些网站结构惊异的同等性,所分歧的是颜色或内容,在结构的同等性中,咱们要夸大网站标忘性元素的同等性,即网站或公司称号、网站或企业标记、导航及辅助导航的情势及位置、公司接洽信息等,这种体式格局是今朝网站广泛采纳的结构,一方面削减设计、开发的事情量,同时更有利于以后的网站维护与更新。
  2、颜色的同等性:体式格局是坚持站点主体颜色的同等,只转变局部色块,长处是一个奇特颜色的网站会给人留下很深入的印象,由于人的视觉对颜色要比结构更敏感,更容易在年夜脑中形成影象符号。在颜色的同等性中,咱们夸大的是假如企业有自身的CI形象,最康复在互联网中因循这个形象,给观众网上彀下同等的感觉,更有利于企业形象的建立。一个倡议是拔取一两种首要颜色,几种辅助颜色。
  3、应用导航取得统一:导航是网站的一项紧张构成部门,一个精彩的富有企业特征的导航将会给人留下深入的印象,康复比将标记的形态寓于导航之中,或将导航设计在整个网站结构之中等等纷歧而足,花点力量在导航上,也会设计出一个精彩的站点。
  4、分外元素的同等性:在网站设计中,个体具有特色的元素(如标记、意味图形、局部设计等)反复呈现,也会给拜访者留下深入印象。康复比网站结构在某一点上的变迁,由直线变为圆弧、暗色装点的亮色、颜色中的补色等等。
  5、应用图像取得统一: 网页中的图像在运用上必定要甚之又甚,尤其是一些动画,网页中充满着各类无关紧要的动画,而这些动画基本与本企业内容无关!当真反省网页中的动画,将没用的删失落!这里咱们所说的应用图像取得统一,决不是在每页中放置几个动画!而是作为网站结构一部门的局部图像,依据网页内容的分歧,配以响应的图像或动画,从而给阅读者形成页面的持续性。
  6、应用配景取得统一:从手艺上而言,网页配景包含配风光和配景图像两种,一样平常来说,咱们并不倡导运用配景图像,而运用配风光或色块。缘故原由很显著,第一,下载速率,配风光的下载速率疏忽不计,而配景图像就得依据图像字节年夜小下载了,这里需要阐明的是,假如你的配景图像比拟深,那么最康复将配风光置为深色调(默许的配风光是白色),如许在期待阅读器下载配景图片的时刻前面的淡色笔墨可以很容易阅读,由于假若有配风光,阅读器先将其下载,然后下载配景图片;第二,显示后果,常常看到海内一些网站设有配景图像,或者是公司的厂房、办公年夜楼,或者是产物图片,乃至是某或人物的照片,使得前面的笔墨很难识别!给人一种很不惬意的感觉,让人无奈停顿。在此,提示您注重:有用应用配景取得网站统一和专业化的办法有以下几种:
  第一,熟悉到并不是所有的图片都可以作为配景,在斟酌设置网站配景图像的时请您注重; 
  第二,增强与远景的明暗对照,即要么淡化配景,隐模糊约可以看到即可,要么加深配景,而将前面的笔墨亮化。 
  那么什么得当网页配景呢?一个康复的倡议是将公司的标记、意味性的简单图片作为配景,并将其淡化,使阅读者在阅读网站内容的同时不经意记下公司的标记。已经一个网站的配景设计给我留下深入的印象:单色配景中一个网站标记的居中放年夜淡化,前面元素中也赓续反复这个标记:如提交按纽外形锐意设计成标记的情势等等,在整个页面中形成特有元素在年夜小、明暗及位置的照应,很康复地塑造了网站的特有形象。
  三、颜色搭配 
  网页中最难处置的也便是颜色搭配的问题了。若何运用最简单的颜色抒发最丰硕的寄义,体现企业形象是网页设计职员需要赓续进修、摸索的课题。若何进行颜色搭配是一门学问,下面的一些办法是我在理论进程中的领会,愿望可以或许为您起到必定的参考作用。
  1、运用雷同色系颜色:所谓雷同色系,是指几种颜色在360色相环上位置十分相近,年夜约在45摆布或统一颜色分歧明度的几种颜色这种搭配的长处是易于使网页颜色趋于同等,对付网页设计新手有很康复的自创作用,这种用色体式格局容易塑造网页协调统一的气氛,毛病是容易形成页面的单调,是以每每应用局部参加对照色来增长变迁,如局部对照颜色的图片等。这种办法不失为一种设计的康复办法。
  2、运用对照色或互补色:所谓对照色,是指色相环相距较远,年夜约在100摆布,视觉后果鲜亮、猛烈,而互补色则是色相环上相距最远的连种颜色,即相距180,其对照关系最猛烈、最富有刺激性,每每使画面十分凸起,这种用色体式格局容易塑造生动、韵动的网页后果,分外得当体现轻松、踊跃的素材的网站,毛病是容易形成颜色的花,运用中注重颜色运用的度。
  值得注重的是,以上两种用色体式格局在现实应用中要注重主体颜色的运用,即以一种或两种颜色为主,其它颜色为辅,不要几种颜色等量运用,以免形成颜色的凌乱。 
  3、运用过渡色:过渡色可以或许神奇地将几种不协调的颜色统一路来,在网页中合理地运用过渡色可以或许使你的颜色搭配手艺更上一层楼。过渡色包含几种情势:两种颜色的中央色调、单色中混入黑、白、灰进行折衷以及单色中混入雷同颜色进行折衷等等,您可以本身测验考试调配,在以后的更新中,我会专题先容若何运用过渡色。
  四、版面结构 
  一样平常来说,企业网站首页的结构比拟机动,侧重设计,这里我所说的结构首要是指内页的版面结构。中、小型企业网站的内页结构一样平常比拟简单,即内页的一栏式版面结构,从排版结构的角度而言,咱们还可以设计成平分两栏式、三栏式、多栏式,不平分两栏式、三栏式、多栏式等等,但由于阅读器宽幅有限,一样平常不宜设计成三栏以上的结构。
  在版面结构中首要是斟酌导航、需要信息与正文之间的结构关系。比拟多的环境是采纳顶部放置需要的信息,如公司称号、标记、告白条以及导航条,或将导航条放在左侧而右侧是正文等等,如许的结构结构清楚、易于运用。当然,您也可以测验考试这些结构的变迁情势,如:摆布两栏式结构,一半是正文,另一半是形象的图片、导航;或正文不等两栏式安插,经由过程配风光区分,分离放置图片和笔墨等等。在设计中注重多汲取康复的网站设计的精华。

上海vi设计公司   http://www.haohead.com
免费在线咨询
与此相关的案例:
前往案例首页>>
看了该文章的客户还浏览了以下相关资讯:
前往资讯首页>>
快速通道: