Web design网站建设
网页设计乾坤大挪移

珠海市天惠设计制作有限公司,成立于1996年8月,是为拓展中国Internet领域应用而专门成立的高新技术企业,是企业电子商务术服务和解决方案综合服务提供商。



时间短、没点子、没创意,又要快速捕抓眼球,怎么办?
对页面整体进行旋转和平移是快速改变视觉是快速有效的方法.它打破了正常的网页设计视觉习惯,吸引了观众的注意力.


说说——旋转和平移

它通过平移和旋转打破正常的视觉习惯,不对称和斜线条的视觉也可以造成网页设计上的速度感的冲击力。这是一个相对比较通用的办法,在没有更好点子和创意的情况下,不防尝试使用。



如果每天要面对着巨大的需求量,难免有创意枯竭的时候,如果有一些相对讨巧的办法,能够不受主题限制,当然是再好不过的,这时候,我们不防试试这简单的小办法。



旋转和平移,这是针对整个页面的大版式而言的,到底会造成怎样一种效果,我们继续往下看。



图一:一张优质的稳定的摄影图片。
图二:旋转后的不稳定构图使图片显得活泼动感而有趣。
图三:重心右移,打破对称的构图增强了画面的紧张感。

这种最快速改变视觉结构的简单方式,可以快速的运用于网页设计中吗?



图一:我们正常的页面版式,居中对齐,稳定整齐,稍显呆板。
图二:画面中心旋转30度。
图三:整体画幅向右平移。
看起来似乎可以这么干,但它也将给我们带来其它一些细节上的难题。


想想——整体旋转、背景旋转、综合旋转
旋转:在原有网页设计页面的基础上通过对页面中的背景、文字、线条等进行一定角度的旋转,使其产生动感、时尚、亲切等不同的视觉感受。这里主要总结了旋转的三种方法,以及解决旋转过程中会遇到的一些问题 。



旋转适合的网页设计页面及其产生的效果

旋转打破了画面横平竖直的呆板,旋转后的视觉更加轻松活跃,旋转构成的斜线条也可以产生运动和速度 感,所以许多运动的、刺激的、具有速度感的主题适合直接旋转处理,另外运动、速度衍生出年轻的、时尚的之类主题也可以适用,轻微的旋转也可以使画面更贴近 于自然的生活状态,增强真实性与亲切感。但在开始旋转设计改造之前,一定会有人产生这样的疑惑。



旋转可能会给我们带来以下一些问题
1.信息量的限制
由于旋转的构图,网页设计斜线与面边面框最终会有一个交界点,可能导致信息不能无限制的延续
2.排版的限制
由于旋转的形式需要整体的配合,而有部分素材无法配合旋转就会比较花时间去归纳处理。
3.浏览舒适性问题
由于角度倾斜,打破了习惯性视觉在提神的同时也会给浏览造成一定的困难和不舒适。
这些都是我们需要注意和解决的问题,带着这些问题,我们一起来看看旋转的一些潜规则。



在斜排布时注意几个要点,以免影响阅读。
1.非内容必要原因。文字尽量保持一定规律排布对齐。
2.非内容必要原因。并列内容尽量使用同一变换角度。
3.图三为正确的变换方式
在简单的图示下,这些错误看起来显而易见,但在实际的操作中,由于多种因素的干扰我们往往忽视这些问题。
在排版过程中无论如何我们都要尽量让依造某一规律对齐,在画幅已旋转的情况下更应该保持理性。旋转基本可以分为以下几种类。


1.整体旋转:背景和内容一起旋转,需要注意两条边缘线,一是保持旋转的边缘线整齐,另外也要注意旋转后的内容不能超出1000宽度。为了兼顾信息的阅读性,背景和内容的同时旋转的角度尽量不要超过15度。
2.背景旋转:背景旋转,信息内容保持不变。这种旋转即可以产生旋转的视觉形式感,又可以保证文字信息的阅读性,是比较推荐和常用的方式。但信息排版同样也受到斜线的1000宽度的限制,在具体操作中需要进行细节的调整。
3.综合旋转:根据网页设计内容结构进行有选择的部分旋转。通常选择内容文字较少的SLOGAN跟随背景一同旋转共同达到旋转的形式感。信息量较多的正文保持水平不变,以方便阅读。这种方式也是经常被使用到。
 
PS: 黄底为1000宽度的内容面积、蓝底为背景面积、白色虚线为1000宽度标准线、SLOGAN(主视觉标题))、文字、圆泡泡(图素)图片组成简易的网页 示意图、透明背景为增阔的信息面积。(对于1024用户的最大网页宽度的定义,不同的公司有不同的标准,通常是在1000~1004范围,为了美观,设计 上通常可多保留一些外边距。)

看看——歪脑袋让世界与众不同
下面我们来分别欣赏几组旋转的页面设计,小角度的旋转可以为页面带来自然轻松的心理感受,旋转的斜线与边界形成的三角可以让网页设计页面看起来更加时尚,旋转也可以增强画面的锐利感和速度感,适合运动类和速度类的产品。


1、整体旋转

这是“一句话小说”征文比赛的活动页面,作者用手写的方式来表达,通过小小的旋转把手写的轻松状态体现出来,增强网页设计页面的亲和力。整体旋转可以减小旋转的角度,以保证信息的阅读性。


2、背景旋转


我们可以看到这个网页设计页面的文字信息基本保持着水平的状态。黑色与白色的背景的斜切面构成了整体的形式感。黑白的对比和贯穿页面头尾斜线条都让页面的视 觉产生了强烈的视觉冲击力。不过在大刀阔斧的形式感设计背后,文字的排版还需要小心斟酌处理。这个页面统一采用了右对齐的方式。左侧文字的排版也恰好与斜 线相契合。这需要我们在制作过程中对内容进行一定的编排和修整,以使其整体看起来更加舒适。


3、综合旋转



这两个网页设计页面排版形式相近,它们都选择了头部SLOGAN旋转的形式,并把SLOGAN和正文明确分割开以避免角度的不同造成的阅读干扰,信息量较大的正文置于下面保持水平。这样的方式让网页设计页面形式感和阅读性并存。
天惠公司将一如既往,秉承专业服务精神,一切从客户利益出发,为您率先建站,令您把握先机,长远的眼光定使您在商海搏击中稳操胜券