怎么规划网页横幅

规划一个吸引人的网页主横幅其实能够很简略，咱们思考的只是怎么分配区域。

在一个简略的网页中，上方的横幅是最重要的视觉元素。在许多博客网页中，它甚至是仅有的视觉元素。所以它的作用能够说是适当大的。它有必要能够与网站的风格合作，并能传达视觉上的信息。它有必要让人看上一眼就让人知道这个网站是属于什么类型，风格是什么。这个横幅还有必要能够供给简略明了的导航链接。一切这些，咱们都能够通过将横幅分红三个区域而轻松实现：每一个区域都具有自己的功用，而咱们还要将这三个区域在视觉上一致，使三者具有相似性及协调性。看一下咱们在本文中所介绍的比如。

从划分空间开端：

一个网页横幅的宽度横跨整个网页，而高度又适当窄。将其分红三个区域：称号，图片及导航链接。然后咱们分别对其进行规划。

怎么分配区域：一般来说，咱们都是将称号放在左上方，而导航栏目放在下方。其空间的分配应该稳重。空间的比例巨细是根据详细的称号（长或短）和图片而定的，很难说有什么最佳的比例。但是，应该防止将上方空间分红两等份，因为分红两等份会让人的注意力都放在版式上，而不是放在内容上。选用不对称的分布作用会更好。

寻觅一张具表现力的图片：

一张美丽的图片是规划一个美丽横幅的要害。在找到相片后，咱们还要细心研究一下截取相片的哪一部分能够最有效传达相关的信息。其实在实践中你会发现，要开掘这一点并不难。

截取相片时应记住一点：尽可能截取能够传达最多信息的那一部分。在上图这张田园式的风景图片中，有树，有草，有山，有阳光——看一下咱们截取的部分，都将这几个主要的图片元素都包含了，这正是咱们所需求的，面积虽比原图小许多，但截取后的图片所要传达的信息不光没有减少，并且在层次感上还加强了。图片上有丰富的明暗区域（见黑白图片），构成近、中、远三种视觉作用。

用色彩分配区域：

用吸管工具从图片选取一种较深的色彩，将这种色彩的色阶由暗到亮摆放，然后咱们再来决议哪一个区域用哪一种色彩。特别要注意的是能发生比照。

强比照更具冲击力：上述一切的色彩都具有同一种色调。并且这些色彩理论上都是来自于图片，能够说，无论你怎么将色彩分配到区域中，一般来说，都能够构成协调的调配。但比照度却会因你的不同分配而有所区别。强比照具有冲击力，而低比照显得更安静（但也因而给人的形象不深）。

放置称号及导航文字：

确认色彩后，咱们要抵挡文字。文字应该能够与图片发生互补：冗杂的图片 / 简略的字体；高雅的图片 / 高雅的字体；安静的图片 / 装饰性强的字体。

首先留心上图中，文字在色彩运用上的交换。绿色的文字用在金黄色布景上，反之，金黄色的字体用在绿色布景上——这样的交换运用能够使整个版面显得更加一致协调。

上图

1. 一个十分长的称号应该分红两行或多行，行与行之间的字体应该是整齐的，防止运用某些高低不平的字体或小字字母，这样会在如此狭窄的小空间中造成抵触。大写字母是咱们这个比如中的榜首挑选。咱们选用一种安静高雅的字体，与这幅美丽的图片发生互补。
2. 防止运用这种装饰性较强的字体，它显得过于奇特了，只会在这里喧宾夺主。

3. 这种字体虽然很美丽，但与这个比如中的图片或网站风格不调配

   选用补色：

   在这个比如中，一张半笼统的图片传达出 D&T 建筑规划公司的风格，假如咱们按上面的那个比如来挑选色彩，那蓝 / 灰的色彩会对 LOGO 发生过于按捺的影响，所以咱们运用一种反色。

   

   

   补色构成激烈的比照作用：整张图片都是由冷色构成，而关于一间年青的建筑规划公司来说，蓝色不能传达它那种冲劲及活力。解决办法：咱们用蓝色的反色或补色来安排 LOGO 区域。咱们首先在色轮上确认蓝色的位置，然后挑选与其相对的另一种色彩（见上方色轮）。互为补色的两种色彩并不具有同一种基色（不象其它色彩联系，比如，绿色及橙色，这两种色彩都有黄色在里面），这便是为什么互为补色的两种色彩能够构成十分激烈的比照。在上方这个色轮中，紫色与黄色具有最高的色度比照。

   与 LOGO 合作：

   Fairweather Downs 的标志已经有五十年的运用前史了，在这么长的岁月中，这个标志几乎没有改变过。这便是经典！在这种情况下，咱们的规划重点应该是考虑标志而不是图片。

   

   

   绿色及米色均属二次色（ secondary colors ，指三原色中任两色混合而成的中间色——译注） ，其中一种是冷色，一种是暧色。

   咱们借用 LOGO 本来的一些特征——双线框及圆角等元素，能够让咱们容易规划其它的一些元素，并且使整个横幅都同样显得经典味十足。由于这个 LOGO 是咱们最垂青的元素，图片相对来说则较为非必须。留心 LOGO 中， Fairweather 与 Downs 这两种字体的风格相去甚远：手写体 / 罗马体，尺度小 / 尺度大，小写字母 / 大写字母，而线条的粗细则很相似，两者结合，构成一种具有手工感的美丽气味。

   在 Indesign 软件中，要创作这些圆角边框能够很容易做到：

   

   1. 画一个矩形，然后将线条尺度调整你希望的巨细，这里咱们是用 2pt ；
   2. 打开线条（ Stroke ） ＞ 类型（ Type ）的下拉菜单中，咱们挑选了一种“ Thin-Thin ”的双幼细线条类型，然后将这条单线转换成两线，
   3. 打开对象 (Objict) ＞转角作用（ Corner Effects ）对话框，挑选反转圆（ Inverse Round ），并确认一个线条尺度（咱们挑选的是 9pt ），然后按 OK ，一个双线圆角的元素就完成了。

   本文所用色彩数值如下：