在网页设计中，如何运用方框-方形元素？

《在网页设计中，如何运用方框-方形元素？》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、在网页设计中，如何运用方框/方形元素？　　如何让方正方框/方形元素不死板有创意？今天这篇好文总结了超多的设计方法和实战案例，建议阅读。　　　　常常听见大神说设计不需要方方正正的，这样会显得死板，没有创意。LOW……其实不然，我认为每一种元素，只要在对的环境中，去运用。相信会出现让人耳目一新的效果。　　比如我们身边使用的电脑，冰箱房屋架构等等，都离不开方形的支持。杂志中常常会让方形元素融入进文字或者图片中间，去突出或去修饰它们。随着现在技术越来发达，设计师也会将杂志中的一些元素，融入到网页设计中去。让网页设计更加有新意。　　作用

2、　　下面我们就来说下方形方框在网页之中的运用。　　01分割　　我们已知的分割的元素，主要是线和面，其实方形/方框也是具有分割的作用。在设计中运用的话会让你的作品别具一格。　　下面设计作品画面中出现了多个文案信息，这么多的信息集中在一个画面中，如何让它们变得有主有次呢，为了让用户清晰的阅读到每一个单独的文案信息，所以设计师加入方框的元素，利用大小对比的关系，有效的避免了内容的冲突和杂乱。这里的设计通过加方框的元素，使画面中的文字也具有一定的强调作用。　　　　这块设计也是具有相同的处理方式：　　　　02强调　　如何让文字内容在众多

3、元素里面突出。要么弱化其他，要么强化自己，显然下面设计中为了让用户第一视觉就能看到表达的文字信息，所以设计师利用了方框的元素进行了强突出。　　　　下面的海报设计，也是运用到了方框的元素，把用户的视觉焦点聚焦了起来。既强调了重要信息也不丢失画面的美感和创意。　　　　03修饰　　当我们的在设计一个海报，或者网站页面中的一段文字的时候，有时候画面太单薄，一些设计师会用其他的方式进行修饰，但是也有设计师利用方框，不一定是完整的方框，这样整个画面一定会别具一格。下面来看设计案例吧。　　下面是一组平面VI的作品，本来是一个平平淡淡的名片，

4、但是设计师加方框的一角进行修饰，瞬间这个作品变得创意十足了。　　　　　　下面网页设计中，原本标题在大面积的留白中间，变得单薄，导致页面的中心不稳定，所以设计师在标题上增加了方框的元素，进行辅助修饰作用，有效了丰富了标题的展示效果。　　　　04色块对比让版面变得有血有肉　　设计师利用方形的色块让网站变得生动创新，使网站在布局上面变得有节奏，有主次，逻辑清晰。下面我们来看看这些设计案例。　　下面是一家家具类的网站，设计师利用方块的大小来做对比。使得整个画面中间的元素组织起来变得清晰有条理，让用户在视觉上变得有层次感，使得整个版面变

5、得简约清晰。　　　　下面这个建筑公司的首页，采用了方形的元素进行大小层次感的相互结合起来，让整个画面变得极其有稳重感，让原本网站上复杂而多的类容，变得条理清晰，干净简洁。同时在画面的版式也是独裁新意。　　　　05信息引导的作用　　在复杂而多的海报或者网站架构中，利用方框进行信息引导是非常有效而且新颖的表现方式。　　以下网站是左侧一个男模特的网站，整个banner采用了红色调，设计师为了让用户快速往下浏览，所有大胆的添加了红色系的方框，有效的引导了用户的视觉，从上而下的浏览，同时使得整个画面不会出现头重脚轻的问题。另外这样的处理

6、让整个版面设计上更加新颖，使得作品脱颖而出。　　右边是阿迪达斯的一个品牌网站，设计师利用了方形的元素作为视觉引导，将用户的视觉一步一步的从引导下去，了解他们的全部商品。　　　　下面一组时尚的海报设计，这里将文字利用方形的规律进行引导排版，让用户有顺序的阅读。　　　　06让文字之间相关联　　下面海报设计，如果按照正常设计师的话，对于文案的处理方式，肯定会根据文案信息以及海报架构进行分散排版设计。　　这样的处理方式，对海报的画面要求会比较高，如果海报比较乱的话，哪么文案的识别性就会降低，为了解决这些问题，设计师选择了方框的元素，利

7、用方框讲文案信息关联再一起。然后再利用方框的大小，根据文案内容的主次进行合理的组织分配。这样不仅让视觉上的到别具一格，而且也降低了画面上其他的元素对文案内容的干扰。让用户第一视觉了解到海报需要传达的信息。　　　　下列海报设计中也利用了方框的元素，让文案信息相联组织在一起。通过改变方框的大小，来突出文案信息的主次之分。视觉上给用户舒适的体验，画面也会让人难以忘记。　　　　如果我们在设计中充分利用上述几个表现方式，相信我们的设计一定会脱颖而出。所以设计优秀的作品并不难，难的是你去发现优秀作品的规律。当然还有很多点值得我们去发现～　

8、　应用　　上诉讲到了方框元素的作用，哪么我们来说说方框方形元素经常运用在那些地方。　　01网页板块　　方框方形元素，经常运用于网页中的各大板块，它们能够有效的将网页中的元素变得条理清晰等，那么我们来看看下面一些案例是如何巧妙的运用方框。　　下面是一个旅行网页。整个网站用了大面