小编教你网站设计中的布局分割方法有哪些。

网站设计师如何能让自己的网站在用户匆匆一瞥后就迅速吸引到他们进一步注意的呢?本文向用户介绍了一种简单的页面布局方式:分割布局,这种布局方式试图让用户初览页面时感受到一种友好的浏览体验。

作为网站设计师,我们可以参考的设计范例和布局原则有很多,比如说:栅格化、纵向一致性、F型布局、Z型布局、三分法则、黄金分割法等。注重这些原则将会给你的设计带来视觉吸引力和功能性——现在让我们来看一种简单的方式,将页面两等分。

虽然在一开始听起来有点傻,但是这种基本布局确实能起到非常好的效果。当我们通览一个页面时,我们的视线常常会沿着一个“之”字形移动。而如果用户的视线是沿着一条水平线移动时——就像在Z型布局里一样,那么他/她就会很专注(或者说尝试着专注)。但由于初来你网站90%的用户都不会很仔细的去关注你的页面,因此让你的设计“浏览起来友好”肯定会获得不错回报哦!

眼动和“之”字形

从雅虎的眼动追踪研究可以发现:

1、人们通过扫视页面的主要部分去判定这是个什么网站以及他们是否想在这多呆一会。

2、如果用户决定留在页面,他们会最关注屏幕顶部的内容。

3、用户仅仅在三秒内就会对页面做出决定

网站的用户总是很匆忙,他们有其它的事情要做,你不要指望他们会停下来去欣赏你网站的美学。虽然良好的美学设计是非常重要的,但是这并不能完全激发访问者去采取行动——去点击“立即购买”或者“了解更多”按钮。

我们不能去埋怨这些用户。永远记住,当你想查询什么东西时?你会急着打开谷歌的第一个搜索结果并且火速看完,或者更确切的说,是粗略的浏览整个页面。大多数时间,你甚至是毫不留意就将鼠标滚动到了页面底部。经过这个阶段后,如果你认为这个页面值得你花时间,你就会又回到页面顶端并且着实花精力去阅读和关注。

那么,用户初始浏览的目的究竟是什么呢?就是在你最初扫视页面时,捕捉到尽可能多的信息。如果我们以某种方式“制定”这种浏览模式,应该就能够得到更多访问者的关注。通过观察大量网站的热图,我得出了一个共通的趋势。

设计不仅仅是它的外观怎样或者感觉如何,而是它是如何工作的。——史蒂夫·乔布斯”

举例来说,你可以利用半分割布局的这一特点去有效的布置你作品集的预览、你的产品或服务的重要特性,这样很快就能引起网站访问者的注意。最终会激励用户在您的网站停留更久,并说服他们采取行动。这样的话,结果会是怎样呢?将给您的网站带来更高的转换率,同时给访问者带来更好的用户体验。

让你的设计和布局兼容“之”字形非常简单。实际上,这和将你的页面分为两等份一样简单!两等分的效果很好,因为“之”字形的端点或多或少能对齐到这两等分的中心。叠加使用,它们能很好的相互呼应。将重要元素放置在你网页中“之”字形的红色端点处,这就是分割布局或者说1/2布局包含的基本理念。

最近,我致力于设计一个“即将来临”的登陆页面。我尝试了多种布局,但是没有一种效果让我满意。我几乎试了每一种——比如栅格化,黄金分割比,F型布局等。但是仅当我将页面两等分时,那一刻有一种强烈的“我找到了!”的感觉。解决的办法竟如此简单!它看起来优雅而整洁,并且提醒了我一个重要的事实:简单不一定是坏事。

你能看到两等分如何体现出一种良好的视觉层次。首先,顶部的“即将来临”的红色缎带很引人注目。其次,标志也很鲜明。现在,跟随我之前提到的“之”字形,访问者看到右半部分的图片滑块,最后,到达电子邮件提交表格。

现在让我们来看一下,分割布局在一个网页设计师的作品集页面中能起到多大作用?设计作品集页面的目的是为了向潜在顾客快速展示你作品的主体部分。随着现在这个产业如此饱和,顾客的选择有很多很多,为什么他们要付钱给你呢?因此,一个很棒的第一印象将会在你的事业方向中起到决定性作用。让我们看看,我们可以做些什么?

上图的布局被划分为两等分,但是并不遵循我之前提到的“之”字形原则。

虽然它看起来是个不错的布局并且易于观看,但是在看完前两块元素后就会让人感到非常沉闷死板。打破这样的视觉流向并且增添视觉趣味性将会让之有所改变。不仅如此,当你试着去浏览上面这种布局时,你的眼睛会最先看到第一张图片,然后跳转到第二块的文本上。然而你的访问者并没有打算在这个阶段阅读,因此,他们会跳转到其它的点,或者彻底离开你的页面!但是如果你做了这样一个简单的调整呢?

变得更生动有趣了,对吧?简单的互换每个项目里文本和图片的位置来增加视觉上的生动性,这样,这种一致性就不会让你的用户感觉到无聊了。同时,你还能在“之”字模型后放置一个行为召唤按钮。

本文章来源小编:网站设计公司

本文来自投稿,不代表科技代码立场,如若转载,请注明出处https://www.cwhello.com/277532.html

如有侵犯您的合法权益请发邮件951076433@qq.com联系删除

(0)
上一篇 2023年6月18日 06:52
下一篇 2023年6月18日 06:52

相关推荐

  • 面向老年人的网站设计:从成熟的角度看用户体验。

    老龄人口的增长已经越来越普遍了,到2030年,65岁以上人口预计将占国内总人口的20.6%。在世界各地,人们的寿命越来越长,在晚年也更加活跃。更重要的是,尽管您可能在过去听说过,老年人已经不像以前那样对互联网...

    2023年2月23日 SEO操作
    03
  • 方法+实战!一篇文章帮你搞定设计系统度量 。

    本文将以百度商业团队 Light 设计系统 PATS 度量体系的建设为例,分享我们如何探索设计系统度量的建构与具体实践。希望通过文章能为大家带来新思考,并借此与大家进行交流与探讨。写在前面成熟的设计系统是一个强...

    2023年3月2日 SEO操作
    03
  • 微交互如何增强网站设计的用户体验。

    在一个拥有令人眼花缭乱的数字平台和海量内容的网站设计世界里,微互动变得越来越重要。虽然在数字设计的早期,微交互被认为是一个很酷的功能,但在当今竞争激烈的数字空间中,微交互已经成为用户整体体验的一个...

    2023年2月19日
    00
  • 我来分享网站设计中那些细节不容忽略。

    首先我们要清楚视觉设计在整个产品中的作用和目的是什么,是给用户提供舒适美好的视觉享受吗,还是为了用户使用产品的时候更顺畅,这些都包括但不仅仅如此,视觉设计还应该传达品牌差异化,让用户清晰地辨识、记...

    2023年6月16日
    00
  • 网站设计:旧想法和现代最佳实践。

    有一些关于网站设计的想法似乎永远不会消失,即使它们不再如此。有些概念经不起时间的考验,是时候重新审视我们是否应该继续采用它们了。用户喜欢滑块设计吗?简单会等于最小的设计吗?您真的需要在导航中包含您...

    2023年2月23日 SEO操作
    00
  • 分享SEO优化的关键词密度如何合理的布局。

    近日,一些客户反应在给网站优化时时候发现一个问题,好像大家还在关注关键词的密度,总是对关键词密度的多少耿耿于怀。有的seo站长坚持按照2%-8%的比例来,有的则认为无所谓,只要能做上排名多少密度都行,也有...

    2023年6月19日
    00
  • 2021年值得关注的网站设计趋势。

    网站设计和平面设计是两个不断变化的领域,见证着新的变化和趋势。一般来说,网站设计的趋势一直是开发一种高保真幻想主题方法,具有令人印象深刻的动画和流畅的过渡。然而这一趋势似乎正在改变。所有的网站设计...

    2023年2月25日 SEO操作
    00
  • 全球各行业企业官网设计标杆之作。

    通常知名度高、信誉好、有发展潜力、综合实力强的企业被称之为标杆企业。而企业官网建设中,无论是网站风格界面设计、网站浏览及使用体验,还是网站内容及社会价值等方面都超过其他同行的,可称之为行业官网标杆...

    2023年2月23日 SEO操作
    02

联系我们

QQ:951076433

在线咨询:点击这里给我发消息邮件:951076433@qq.com工作时间:周一至周五,9:30-18:30,节假日休息