• 张家港网站制作

    NEWS案例新闻

    最近正在折腾...
    Recently is to do ...

    首页 > 关于 > 技术文章
    视觉效果吸引人的banner广告设计技术
    已阅读:     2017-5-6 10:06:14

     网页上的小广告(banner)已经成为一种鼓吹推广的首要形式,但这些小广告除了版面渺小外,图象的表现还受到象素较低等其它因素影响,给传统的平面设计师带来了新挑战。如何让你的小广告在杂乱无章的网页中脱颖而出?本文介绍了几种解决的思路。 

    原文出处:

    如何在渺小的空间设计出视觉效果吸此人的广告(banner)?

    第一步:应用简单的照片

    对付一些区域狭窄的空间需要涉及一些特别的要求,第一步,就是采纳一张简单但又能传达很多信息的照片。

     

    视觉效果吸引人的banner广告设计技术

     

    一般的广告总是采纳整张图片加上文字配合,而网页上一个标准的小广告的尺寸是 12 0 × 90 象素,分手率为 72dpi ??占淙吩浜苄?。你如何在这个小地方加进你想要的东西?象上图,难道你想让全部纽约市都塞进这个小空间里?那只会让这些建筑物变成一个个斑点而已。当我们面对这些小广告的版面时,并不应该只是将整张图片简单缩小——因为空间已经很小,分手率又很低。而一般的网页上总是充斥着很多杂乱的信息,将图片只是简单地缩小,那些细微的东西完全不会此起人们的注意。所以我们要思考的是:简单、醒目及简短。我们并不需要应用整张纽约市的照片才干代表纽约,我们应该要运用这个城市的一些象征符号来传达这种信息,比如:自由女神像,帝国大厦,当然,你还可以自己抉择其它的东西。

    我们要寻找一张具有象征意味的照片,构图要简单,颜色要醒目,角度要明显,比较要强烈,当然,最好是所有这些因素都能够在一起。

     

    视觉效果吸引人的banner广告设计技术

     

     

     

    网页制作poluoluo文章简介:如何在渺小的空间设计出视觉效果吸此人的广告(banner).

     

     

    第二步:简单的版面

    应用简洁的文字,将文字与其它素材简单结合。

     

    视觉效果吸引人的banner广告设计技术

     

    网上培训课程的登记涉及到很多硬件,但我们并不需要将所有的东西都整个显露出来,而是……

     

    视觉效果吸引人的banner广告设计技术

     

    上图左,应用一张简单且常见的象征图片,将背景设为黑色,使其与白色的鼠标形成强烈比较,但鼠标本身并不能传达网上报名注册这一信息,所以……

    还要加上文字。只有加上文字,所有的信息才是完整的。大文字同样采纳白色,而大学名称采纳金黄色,使其让人知道这是两个不同信息。

     

    视觉效果吸引人的banner广告设计技术

     

    我们说排版要尽可能简单。留意上图左图,文字与鼠标高度相同,使两者成为了一个整体,而右图表明,每个元素之间的间隔距离都是相等的。

     

     

    网页制作poluoluo文章简介:如何在渺小的空间设计出视觉效果吸此人的广告(banner).

     

     

    将剪切工具变成一种设计工具

    通过对图片进行恰当的剪切,您可以把持图片所传达出不同的效果。剪切历程虽然简单,但在剪切时却要很多细节要考虑。

     

    视觉效果吸引人的banner广告设计技术

     

    上图大图是一张漂亮的原始图片,,通过你不同的处理方式,可以让它传达不同的信息。如小图,我们只保留左边的一半,使到整张图片变得更加有冲击力,同时还留出了空间给文字。

    当然,还有很多种剪切方式:

     

    视觉效果吸引人的banner广告设计技术

     

    中心构图使整张图片显得稳定。她的目光直接面对着你,透着一种优雅迷人的气息。

     

    视觉效果吸引人的banner广告设计技术

     

    偏离中心的构图打破了空间的平衡,传达了一种略为紧张的气氛

     

    视觉效果吸引人的banner广告设计技术

     

    呈角度的构图,这使到图片中人物的眼神变得更加煽情,使你更加容易注意她。

     

    视觉效果吸引人的banner广告设计技术

     

    这是一种更强烈的剪切方式,剪切的边缘去到她的眼睛,而且还呈角度,比上一张更加容易引起人们的注意,张力十足。

     

     

    网页制作poluoluo文章简介:如何在渺小的空间设计出视觉效果吸此人的广告(banner).

     

     

    利用文字来组织图片

    在版面非常狭窄的时候,文字与图片必须谨慎配合,避免让人产生两者分离的感到。事实上,文字与图片必须形成同一种信息。记住,字体也是一种图形,所以你可以充沛利用字体的样式、形状、粗细及颜色来补充和加强图片的气力。

     

    视觉效果吸引人的banner广告设计技术

     

    一张全景图注定不会简单,文字 “ EI Capitan ”与这座作为焦点的花岗岩山峰分开。当然,我们可以通过剪切来作进一步的处理,但有一个问题,这座山峰的标致正是要有一定的距离感及它周围的细节才体现出来。而下方的那个绿色实色区域使到文字与图片分离,避免了整张图片变得过于繁杂。

     

    视觉效果吸引人的banner广告设计技术

     

    上图的图片经过剪切,使其更加收紧。现在山峰给人一种更加强烈的高耸感而不是开阔感。阴影也使图片形成了纵深。同时采纳了一种缩窄的大写字母,使到文字与图片形成一个有机的整体,使读者的眼睛看上一眼就能够留意。

     

    视觉效果吸引人的banner广告设计技术

     

    上图采纳名信片的设计样式,尽管图片没有改变,但这种处理方式却使全部设计显得更加宁静,也更有画廊的气息?;疑淖痔逶诎咨蛏先匀荒芄蝗菀妆槐嫒?,开阔的白色区域也使到图片有一种水平感。

    再来看一下实际大小的效果:

     

    视觉效果吸引人的banner广告设计技术

     

    让我们进一步来探讨上述的设计:

     

    视觉效果吸引人的banner广告设计技术

     

    首先将一张大图片缩小到适宜的尺寸( 1 )。

     

    视觉效果吸引人的banner广告设计技术

     

    将图片的宽度变成标准的 120px ,而图片高度要少于 90px ,因为我们下方还要加上文字区域( 2 )。

    用一种实色填充下方区域,同时这个区域也与图片有一些重叠。颜色来自于图片,用吸管在图片取色( 3 )。

    最后加上文字( 4 )。当您要面对一种繁杂的或者有太多细节的图片时,这种处理方式是对比理想的。

     

    视觉效果吸引人的banner广告设计技术

     

     

    视觉效果吸引人的banner广告设计技术

    关于
    About Us
    关闭
    山东彩票合买微信群 炒麦穗花鱿网| 麦穗虾卷网| 牛蒡糕网| 烧心网| 我爱打折网| 起点中文网| 洋参雪耳炖燕窝网| 凉瓜浸田鸡网| 中国奥委会官方网站| 百度钓鱼吧| 云河段霄网| 云苓黄精生蚝汤网| 中国税务总局| 豆渣猪头网| 中国简历网| 生炊龙虾网| 招才猫招聘网| 鱼香茄子网| 乌鲁木齐在线| 中国高尔夫网| 双椒鸡网| 参麦团鱼网| 酿海参网| 凤梨烩排骨网| 幸福婚嫁| 免费点歌| 途易酒店预订网| 太原人才网| 龙凤双腿网| 四喜鸭子网| 木瓜辽参网| 中国国土资源部| 中国赛艇协会| 孝感网| 中国本溪网| 兵团新闻网| 鸡包鱼翅网| 住宅与房产信息网| 宁夏网| 冬瓜赤小豆金银肾汤网| 烧百合网|