网页设计技巧:常见的排版布局分割技巧

随着各种各样风格的网站不断出现,网页布局已不必再拘泥於固定格式。大多数网站都会把内容安排到多个列中,想杂志或报纸那样,当然也有不少搞个性化,创出新意。但无论选择哪种布局方式,都不能够忽视页面的用户体验。下面,就让Inspirr Creation为大家整理常见的排版布局分割技巧。

技巧一:纵向居中分割页面

网页设计技巧:常见的排版布局分割技巧

使用纵向线分割页面时,如果居中就等於均等分割;但视觉偏向左边时,页面会更具母性,即内向型;相反,如果视觉偏向右边时,页面则具有父性或外向型。

技巧二:纵向分割且左侧面积大

网页设计技巧:常见的排版布局分割技巧

当页面被纵向分割时,左右排布的内容就会具备一种包含时间性的隐喻。左侧面积较大时,会表现出过去、经典的感觉,或暗含「过去」的属性。

技巧三:纵向风格且右侧面积大

网页设计技巧:常见的排版布局分割技巧

右侧面积较大时,所带来的感受就会显得更加外向和攻击性,有种「面向未来」的感觉。因此这种分割布局会呈现出一种「向前」的感觉。

技巧四:横向居中分割页面

网页设计技巧:常见的排版布局分割技巧

横向居中的分割线,会将页面分成上下两个均匀部分,这种布局方式同样具有「时间性」,上部代表未来,下部代表过去。当核心信息放在上半部分,就会呈现一种明确的指引性。

技巧五:横向分割且上部面积大

网页设计技巧:常见的排版布局分割技巧

上部面积较大时,上部所带来的压力感让页面显得稳定平和,在「时间性」方面,会呈现对未来的希望和期待感。

技巧六:横向分割且下部面积大

网页设计技巧:常见的排版布局分割技巧

下部面积较大的布局,靠下部分会自然而然成为视觉的重心,给用户一种压抑的感觉,更容易展现出权威性和经典感。

技巧七:不作分割的全屏式布局

网页设计技巧:常见的排版布局分割技巧

这种布局,背景图片本身的视觉效果会被最大化地呈现,视觉效果更加开阔,体验更具沉浸感,更加生动,细节也变得更加丰富,冲击力也更为明显。

技巧八:对四周进行切割居中布局

网页设计技巧:常见的排版布局分割技巧

将四周围均匀切割後,留白会使居中的视觉元素更加引人注意,自然而然就会更加聚焦而非沉浸,这种分割方式非常适合呈现特定内容的时候使用。

技巧九:采用倾斜分割布局

网页设计技巧:常见的排版布局分割技巧

相对於前面的布局来说,倾斜式分割布局会更加新颖,时尚而错落,而且更具有速度感。如果均匀分割,内容不同属性相似,会让两块区域具有明显的对抗性;如果两者内容互为辅助,则会有一种独特的融入感。

对於布局选择,既没有一成不变,也没有任何一种布局能满足各方面的需求,因此在选择布局问题上,我们应该根据自己的需要去选择,这样才能符合设计师和用户对网站的要求。

本文来自投稿,不代表重蔚自留地立场,如若转载,请注明出处https://www.cwhello.com/43458.html

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

(0)
Inspirr的头像Inspirr订阅用户
上一篇 2022年6月25日 23:42
下一篇 2022年6月25日 23:42

相关推荐

  • 快速提升 UI 设计效果的 6 个小技巧 (UI 设计集-6)。

    编者按:在进行 UI 设计的时候,很多小技巧能够恰到好处地提升界面的设计视觉效果、用户体验。这篇来自Mark Andrew 的文章梳理了 6 个实用性很强的 UI 效果提升小技巧,是系列文章的六篇,原文最早发布于 marcandre…

    2023年3月1日 SEO操作
    01
  • 我来教你浅析:网页设计的基本流程。

    虽然网页设计不是一件非常麻烦的事情,但需要遵循许多步骤才能让网站上线。设计一个新网站时,找到满意的主机服务,有虚拟主机,专用服务器等选择,注意要考虑是否需要备案,备案一般国内主机要一个月左右的时间。…

    2023年6月16日
    01
  • 关于哪里有网页设计的报价,网页设计报价明细表。

    网页设计报价因地区、设计师经验、项目复杂度等因素而异,以下是一些常见的网页设计报价明细表,供您参考: 1. 基础型网页设计:这种类型的网页设计通常包括一个首页和几个内页,设计风格相对简单,适用于小型企业…

    2024年6月29日
    00
  • 文本方面像素细节设计的原则

    高度和宽度:这两点建立在动态的文本之上,比如翻译的页面当中,或者用户正在页面当中创建文本。一定要保证起高度和宽度的协调性,别影响可可读和易读。 长度:如果你的网站设计是面向多国用户的,那麽就需要考虑到…

    2022年6月25日
    0105
  • 网站设计都有哪些难点必须要了解?

    网站设计,在当前庞大的竞争市场中,想要建设出一个出色的网站,绝对不是一件容易的事情,尤其是在这个互联网高速发展的现代社会,想要自己的网站在众多的同行中脱颖而出,那绝对是需要下大功夫的,在这里,我们就…

    2019年10月23日
    0378
  • 如何使用好空白状态的介面

    1、 鼓励用户进行操作 空白状态介面的首要目的之一是,能够说明使用者在介面进行操作。在空状态的介面当中引导使用者交互,要直观性。 2、 提供个性化的内容 个性化的内容和元素本就是为了让你的介面和使用者需求最…

    2022年6月25日
    0108
  • 小编分享四川高端网页设计需要多少钱。

    一个高端的网站对于一个四川企业来说重要性是不言而喻的,企业的网站不仅可以树立企业形象,还能够通过网站来有效的发展电子商务,因此众多的企业都会非常重视企业网页设计,将建设网站交个更加专业的公司来做,也…

    2023年6月16日
    02
  • 小编教你网页设计与网站开发有什么区别。

      对于初学者而言,网站开发或网站设计这两个术语可能听起来相同,但事实是它们在范围,功能和重要性方面都有很大差异。在查看细节时,可以很容易地发现两者之间存在类似海洋的变化。简而言之,我们可以说网页设计…

    2023年6月15日
    00

联系我们

QQ:951076433

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