‘壹’ 网站设计风格应该采取哪些方法
鲜艳的色彩
明亮生动的配色方案通常在视觉上很有吸引力。 这些颜色明亮,大胆且充满活力。 在过去的两年中,我们看到越来越多的品牌开始使用超饱和色作为品牌色。 网页设计趋势继续发展并变得越来越流行。
黑板风
虽然黑板风格不是一个常见的风格,但是其经典的使用方式和延伸效果,同样可以作为网页设计风格的一项选择。最常见的运用方式就是将黑板作为背景元素同时黑板本身的装饰效果使网站呈现非常时尚。许多经典的美食网站设计都采用了这种风格,除了使用黑板以外,将现实场景中的桌面运用到背景中也格外出彩。
图片与插图的结合
图片和简单的2D手绘插图的组合是当前Web设计中一个非常重要的创新趋势。 使用拼贴方法,将真实图片叠加在创意的2D手绘元素上,以增加原始的黯淡图片。它具有特殊的魅力,并且以插图的形式可以更好地表达抽象概念并更具个性化。
综合式
随着网站技术的日渐成熟,网站的表现形式渐渐变得模糊起来。即使是传统的以信息提供为主的网站,也添加了很多多媒体的修饰成分,从而使访问者得到更丰富的上网体验。而对于传统的画廊式网站,则添加了更多注重内容的方面,使访问者不但能得到美的享受,而且能获得相应的信息。
纵向分割
习惯了一栏式的设计,将屏幕一分为二甚至是多栏式的网页设计方式,受到了众多用户的喜爱,在网页设计中使用新鲜的分屏式设计可以方便呈现不同的信息,创造对比。同时划分有效区域,方便用户进行快速选择和视觉聚焦。
关于网站设计风格应该采取哪种方法,环球青藤小编今天就和您暂时分享到这里了。如果您对网站设计、页面排版、图像处理方面比较感兴趣,希望分享的这篇文章可以给您的学习或工作提供帮助。如若您还想了解更多关于平面设计的素材及技巧等内容,可以点击本站的其他文章进行学习。
‘贰’ 企业网站该如何做好布局规划
1、企业网站首页常见的布局方式
很多人常常询问企业页面该如何布局这样的问题,其实网页布局也没有想象中那么难,只要做到两点我认为起码可以做到临阵不慌,一是对常见的布局方式心中有数,二是根据信息内容及设计素材的特点进行摆积木式的多次尝试,下面总结的企业站首页常用到的布局方法,共有6种:
(1)、大框套小框的布局
这种布局方式是最常见的一种布局,不是说这种布局方式一无是处,但我们总不能只会这一种布局方式,次次套用吧?
按照这种布局当然也可以做出来漂亮的设计,但毕竟方框限制的视线的扩展,如果客户要求做出大气的感觉,一般不会按照这种方式来布局,通常来讲,大气意味着开阔视野。
(2)、通栏布局
以下这种布局方式让视线不再受到方框的限制,比起上面的布局方式,自然多了些大气、开阔的味道来。
另外,主视觉部分还可以灵活处理,既可以向上拓展到logo和导航的顶部位置,也可以向下拓展到内容区域,这种布局方式也是非常常见的布局方式。
(3)、导航在主视觉下方的布局
这种虽然不多,但也时不时能看到,导航放在banner下面的好处是可以弥补banner中设计素材截断的缺点,让设计看上去完整、自然。
所以说布局的方式受到多方面因素的影响,不仅考虑到信息内容所占据的空间,还包括你手头现有的素材。
(4)、左中右布局
这种布局方式不常见到,但却是非常富有新鲜感的布局方式,如果你已经做腻歪了水平分割的设计,尝试一下这种布局也未尝不是一种好的选择。
(5)、环绕式布局
这种布局方式看上去更加灵活,banner区域相对较小,就可以在页面放置更多的信息内容。
(6)、穿插式布局
这种布局在企业站中较难看到,用的不多,banner区域相对较大,可以作为一种布局的选择。
上面的6种布局方式只是一些常见的企业类网站页面布局,布局的方式还有更多。实际上,布局就像是摆积木,只要遵循重要信息靠左、靠上,次要信息靠右、靠下的原则即可,并没有规定一定要怎么布局,或者这种布局方式要比那种更好,只能说某种布局方式更为合适某个页面而已。
2、布局风格统一
在网站布局时,一定要重视布局统一,千万不可因过分追求个性,在布局方面想要给用户更多新颖刺激的感觉而忽略统一性,假如网站布局不统一,在用户光临时对你的网站没有印象,这样是不行的。
3、整洁条理布局
企业网站与展示型网站不同,企业网站想要表现的是企业的形象与推广产品方面,切忌不能让过分花哨的布局盖过产品的风头,在进行企业时,一定要谨记布局要有条理,干净整洁,体现企业形象与产品内容才是根本。
4、个性鲜明布局
网站足够个性才能脱颖而出,但是做好这一点的前提是企业一定要全面考虑到自己的网站布局是不是符合了用户体验度?忆五发现现在好多网站都在设计这个方面做的非常有噱头,但是用户并不是很喜欢,这就是因为忽略了用户的感官视角。
5、导航的布局
网站的导航是非常重要的位置,我们要放上用户最需要的类目,有很多企业网站放上了 新闻动态 、 企业场景 等次要内容放了上去,事实上,用户很少会点击这些东西,且会分散掉他们的注意力,忆五建议大家把用户所需的产品类目放上去为好。我在这里是不建议把所有重点放上这些的,这些东西用户是很少去点击,而且还会分散用户的注意力,得不偿失,建议企业产品站要放上产品的类目,这样方便用户进入网站可以马上看到自己想要的东西。
6、以产品为主的布局
每个搜索产品的用户都是希望能看到实实在在的产品,而不是那些企业新闻、企业简介和一大堆的技术资料的文章,所以应当把这些东西保留一小部分即可,重点放上产品的图片,而且是高清的、有参照物的。
那些有滚动滚动效果的图片也不建议放,如果非要放的话要滚动的速度要慢,而且滚动的产品不宜太多。
7、用户查资料的需求
众所周知,对于企业网站来说真正的用户数量并不是很多,直接在网站下单的用户更可谓是凤毛麟角。基本上来到网站的用户都是奔着查询资料而来。很多企业就忽略了这点,在设计的时候只是单单奔着购买者而设计的,忽略了那些前来查询资料的用户需求,这样的网站很难满足大多数用户的需求,或许这也是你的排名迟迟不上升的其中一个因素哦!
大家都知道,企业的用户群体是非常少的,但是查询资料的用户占据不少。有很多企业站的设计是为了那些购买用户的而且布局,完全没有考虑查询资料的用户,这样的网站是很难取得排名。即使有排名,那也是 垃圾中的战斗机 ,竞争对手的网站稍微满足一些查找用户的需求,那么就会被挤下去。
所以,要先满足大众的需求,网站才能被点上去,排名上去了网站才能曝光于哪些购买用户的视野。
8、样板文字和字体的统一布局
企业站的产品文字本来就少,有很多的企业站是一张或几张的图片,下面有为数不多的几段文字,如果样板文字过多的话,那么页面和页面的相似度会过高,导致被判为低质量页面,影响关键词的排名。
所以,对于像底部的版权,侧边栏的推荐文章、内页的相关文章或者内页的联系方式,能去掉尽量去掉。
字体要统一包括大小、颜色统一,网站的内容字体要适中,12、14号字体刚刚好,字体的颜色要统一为黑色或者深灰,锚文本的字体的颜色要区别于黑色或者深灰色,最好是为蓝色,不能刻意关键词加粗、不能做暗链,均属于作弊行为。
9、视觉效果重要
这里我们所说的视觉效果并不单单只是利用图片和flash做出来的体验效果,大家都知道网站放置过多的图片和flash对于打开速度有很大的影响。我想说,放置少量的图片就可以了,同时在网站布局方面充分利用这些图片,达到完美的视觉效果才是最佳。
10、友链的布局
友链的布局要看情况而定,一般友链都是首页上有,内页没有,也就是说友链只显示在首页上(不是说不能换内页的友链,主要是双方商量好),友链的个数不能超过30个,因为企业站的受众群体小,积累的权重不易,友链控制在30个可以规避因友链牵连降权。
11、不要做回链
很多企业站底部都放有回链,殊不知站在了危险的边缘,回链是老掉牙的作弊方式了,是很容易受到搜索引擎的惩罚,因为回链被降权的网站数不胜数。
所以,我们要摒弃这样的手法,我们要通过正规的优化手法去优化,这样优化之路会走的更远。
12、联系我们非常重要
不要自以为你的产品介绍够详尽,就忽视联系我们这块。淘宝的产品介绍的很详细,而且还有用户的评价,但是还是有很多的人要通过阿里旺旺去进行在线咨询,这个现象告诉我们,不管我们企业站的产品介绍的多么的详细,用户还是会咨询的,所以联系方式应当放在显眼的位置,方便用户的找到我们。
‘叁’ 网站界面设计基础
网页包括:网站logo,导航栏,banner,内容栏,版尾。
logo的大小标准:88*31普通规格;120*60一般大小规格;120*90大型logo。
好logo所具备的条件:符合国际标准,精美独特,兼容网站风格,能提现网站类型。
导航栏是索引网站内容和快速访问所需内容的辅助工具。同级项目数以3~7项为宜。
banner是可由图像,文字,动画结合而成的网页栏目。主要作用是展示网站广告。
内容栏是网页内容的主体,由一个或多个子栏组成,包含网站提供的所有信息和服务项目。内容可以是文字,图像,或者两者相结合。
版尾可以申明版权,法律依据,以及各种提示信息。版权的书写应符合所在国家的法律依据,以及遵循一般书写习惯。
除此之外,版尾处可以提供一个导航条,为将页面滚动到底的用户提供一个导航方式。
成功的网页版式设计,有助于吸引用户对网页的注意,增进用户对内容的理解。因此,要使网页具有诱导力,突出诉求主题,就要通过对版式的空间层次,主从关系,视觉秩序,以及逻辑条理性的把握和运用来共同完成。
传统媒体是以线性方式提供信息,即根据信息提供者个人感受来传播。在web环境下,用户不再是被动接受者,而是以一个主动参与者的身份加入到信息的加工处理发布之中。
网页媒体使用的交互性,多维性,和多种媒体的综合应用,是网页版面设计的完美体现。即时的交互性是web成为热点的原因,也是版面设计需要考虑的问题。
多维性源于超链接,主要体现在导航的设计上。使用超链接,网页的组成结构会更加丰富。用户可自由切换,打破了传统的线性接收方式。但需注意页面之间的关系不能太复杂,这会给用户带来负担。
网页中所使用的多媒体视听元素主要有文字,图像,声音,视屏等。运用这些元素,可以满足和丰富用户的多种感官需求。
网页设计的装饰应该简洁化,功能与装饰应有效结合。复杂的装饰会影响加载速度,影响点击率。
网页设计要遵循和谐,均衡,重点突出的色彩规则。当人们的色彩经验与外界色彩刺激发生呼应,就会在心理上引发强烈的情绪。
1.网页的标题设计
好的标题设计可令人赏心悦目,能形成网页的整体风格。标题所在的栏目一般在网页的上方,并左右贯穿整个网页。标题的背景可以使用动态或静态的图片,主要由网页的交互式特性决定。
2.文字的编排
通常情况下,适合网页正文显示的文字大小在12磅左右。然而,在很多综合性网站中,由于在一个页面中安排的内容较多,字号通常采用9磅。
在同一页面中,字体种类少,版面雅致,有稳定感;字体种类多,则版面活跃,丰富多彩。关键是如何根据页面内容来掌握这个比例关系。从加强平台无关性的角度来考虑,正文最好采用默认字体。如果必须用到特殊字体,那么可以将文字制成图片。
通常字号与行距的比例应为:字号8点,行距10磅.即8:10.但对于一些特殊的版面而言,字距与行距的加宽或紧缩,更能体现主题的内涵。所以说字距和行距不是绝对的,得根据实际情况而定。
强调文字有三种常见形式:第一种是行首强调,又称为下坠式,有吸引视线、装饰和活跃版面的作用;第二种是引文强调,引文概括了一个段落、章节或者全文的大意,所以需要给予特殊位置来强调;第三种是个别文字强调,将个别文字作为页面的诉求重点,可以通过加粗、加下划线等强化文字的视觉效果。
3.图文的结合
在网页的版式设计中只应用文字也不适合人们长期阅读,所以网页在版式上采用图文结合的方式更为恰当。
图文结合主要有两种表现形式:1.文字匹配图片的形式,图形是网页的主体,文字是辅助存在。2.图形匹配文字的形式,要把握图形和文字的关系,根据不同类别的网站灵活搭配。
4.页面的节奏韵律
页面的韵律需要根据设计的风格和受众情感综合起来体会。一个音乐类的网站,给人的感觉是轻松欢畅的;一个新闻类网站,给人的感觉是快速律动的;而一个军事类网站给人的感觉是严肃庄重的。所以这就需要设计者根据内容来选择设计风格。
网页设计如果仅从网页版式构成进行分类,则主要有骨骼型、满版型、分割型、中轴型、曲线型、倾斜型、对称型、焦点型、三角型以及自由型十种。
1.骨骼型:是一种规范的、理性的设计形式,类似于报刊的版式。常见的骨骼有竖向和横向的通栏、双栏、三栏、四栏等。一般以竖向分栏为多,这种版式给人以和谐、理性的美。几种分栏方式结合使用,会使网页既有条理又有弹性。
2.满版型网页:以图像充满整版。页面主要以图像为诉求点,将少量文字嵌于图像之上,视觉传达效果直观而强烈。多见于强调艺术性或个性的网页设计中。美中不足的是,它对网络宽带有着一定要求。
3.分割型:把整个页面分为上下或左右两部分,分别安排图片和文案。令部分形成鲜明对比:有图片的部分感性而具有活力,文案部分则理性而平静。
4.中轴型:沿着页面的视觉中轴将图片或者文字进行水平或者垂直方向的排列。水平排列的页面,给人稳定、平静、含蓄的感觉;垂直排列的页面,给人舒畅的感觉。
5.曲线型:将图片或文字在页面上作曲线的编排,这种编排方式能产生韵律感与节奏感。
6.倾斜型:将页面主题形象或多幅图片、文字进行倾斜编排,从而造成页面强烈的动感,引人注目。
7.对称型:页面版式给人以稳定、严肃、庄重、理性的感觉。它分为绝对对称、相对对称以及四角形三种。一般采用相对对称的手法,避免版式呆板。而四角形对称手法是在页面四个角安排相应的视觉元素,这种构成方式也能很好使页面产生安定感。
8.焦点型:通过对视线的诱导,使页面具有强烈的视觉效果。常见的几种方式有:一是将对比强烈的图片或者文字置于页面视觉中心;而是视觉引导浏览者视线向页面中心聚拢,形成向心的版式;三是视觉元素引导浏览者视线向外辐射,形成离心的网页版式。
9.三角型版式:网页视觉元素是三角型排列。正三角形具有最稳定性,倒三角形则产生动感。侧三角形构成一种均衡版式,既安定又有动感。
1.缺乏主色调
在网页经常可以看到这样的网站,元素色相众多,令人眼花缭乱,给人一种复杂混乱的视觉效果,使访问者无法明确地识别重点内容。
这是一个国外从事汽车产业方面的公司,所以在页面上方选用了和网页同色系的一辆红色跑车,这是网页上的一处亮点。深浅不同的灰色对整个网页的区域进行了划分。整个网页版式设计条理清楚,色彩简单不呆板,体现了工业产品的特点。
这是松下家电制造公司的网站。以金属灰为主色调,与家电产品的主体相吻合。页面采取了一分为二的设计,上半部分展示公司的各大产品,下半部分主要是子目录,其中包括新闻、其他产品、广告等等。
2.文字能见度低
网页上的色彩或者图片通常结合在一起,要么成为文字的背景色,要么成为文字本身的颜色,这就出现了文字的色彩的对比问题。对浏览者来说,最重要的是文字,因此,画面色彩运用就必须注意文字的可识别性,也就是文字的易见度。
.在高明度的背景上,低明度的文字易于识别,如果背景和文字名都接近,就容易出现难以辨别的问题,如遇到图文叠印的网页,文字可以采用白色或者反白色处理;或者使用与背景同色系,不同饱和度的方式来处理。
3.增加视觉负担
网页配色要尽量少用视疲劳度高的色调,一般来说,高明度、高纯度的颜色刺激强度高,疲劳度也大。无色系中,白色的明度最高,黑色明度最低;有色系中,最明亮的是黄色,最暗的是紫色。
用明度太高的色彩作为背景看起来很刺眼,所以设计师们要尽量减少高明度背景的使用。反之,使用少量的高明度颜色作为点缀,会大大激发浏览者的探究欲望。
1.人性化
网页设计在遵从艺术规律的同时,还要考虑到人的心理特点。色彩搭配合理,则给人一种和谐、愉快的感觉,因此应避免采用高纯度、刺激性强的单一色彩,否则容易造成视觉疲劳。
这是一个休闲游戏的网站,连接每组连接点都绘制出一个完整的图案。绿色和黄色的搭配让游戏者看着很舒服,搭配一个简单的按钮,让网页看起来比较人性化。
艺术源于生活,又高于生活,通常情况下,生活中常见的东西没有必要在网页上再次重复。人的感觉是喜新厌旧的,总会偏向于一些新奇的东西,因此,一个新奇的创意或者有感染力的色彩,平面构成会更勾起访问者的兴趣。
这是一个阿根廷漫画家的个人网站,很有生活创意。作者有着新奇的想象力和出色的构成表现能力。虚拟与现实相结合,将漫画家的生活进行了记录,生动有趣。
2.符合网站风格和主题
不同类型的网站就要使用不同的色彩和视觉元素,达到内容和形式上的统一,这样做更符合人们的认知习惯。
例如珠宝首饰类的网站就要使用看起来贵重、豪华的配色,如黑色、金色。总让人联想到财富,黄金。遇到购物类等女性网站可利用粉色来表达女性站点的柔美性。
3.个性鲜明
每个网站都有自己独特的个性和气质,缺乏个性就很难让访问者记住这个网站,千篇一律的设计只能让浏览者感到乏味。通过色彩组合以及元素构成能很好的实现网页的个性化。
法国DJECO玩具设计工作室主要以设计儿童玩具为主营业务,DJECO设计工作室网站场景设计温馨精美,强烈的儿童插画风格与儿童玩具的设计定位扣合。网站风格活泼可爱,站点的亮点是极具特色的动画元素设计,在整站中起到了非常好的点缀作用。