图文搭配，网页不累

站长资源 2024/11/22 佚名

2 0 1

所有的法则或规律都需要设计师们的弹性使用，生搬硬套可能只会适得其反。以下是我们为大家搜集的值得借鉴的图文混排案例，供大家评论欣赏。

1、第一个案例是AnyForWeb为Nature House设计的图文交错的一种新形式。案例图片中的每一个字母或是小图片都会随着鼠标的悬停产生效果，由图变字，这样的设计不仅让图文之间的搭配变得更加生动，也增加了用户浏览时的趣味性。

2、The Tech Beach的网站背景利用了Metro的设计风格，担心太规整？所以设计师将透明度较高的泼墨形状色块放在页面中间位置，文字重点和logo浮在色块上方。这样的图文搭配模式能让用户很自然的领会浏览时的先后顺序。

3、Anyi Lu的巧妙之处在于留白部分。案例网页中的留白在中间的位置，看似文字和图片被一分为二了，但从心理角度上来说，这样做其实更加能激发用户连结图和字之间联系的好奇心、在单色底色的映衬下，幽灵按钮的设计也变得很抢眼，更有利于用户点击。

4、Moon Camp彻底把文字和图片混合在一起。这种做法成功与否不仅取决于整体页面的布局，色彩的搭配也是个很关键的因素。网页色调属于昏暗系，所以设计师选择了星空色作为字体的颜色，与网站风格吻合，文字的不规则排列也让网站多了一份神秘感。

5、Zizzi Ristorante的网站第一眼可能会觉得有些凌乱，但用户的视线最终还是会聚集到枚红色框内的内容上。单从布局上来说，这个网站并没有什么过人之处，但仔细一看，我们不难发现其实网站中图片的占比很少，按照常规的做法，页面会变得很单调，因此，设计师最后用一些色块或是图形巧妙地化解了这个不足，无形中完成了图片与文字之间的完美合作。