学会网格设计的5种类型,快速提升工作效率!在一起什么时候播出

大家好,我是Clippp。今天为大家带来的文章是「网格」设计。网格是一个方便好用的设计方法,一起来看看什么是网格,网格有哪些类型,以及如何使用网格~01什么是网格?网格是页面的骨架,无论创建像杂志一样

大家好,我是Clippp。今天为大家带来的文章是「网格」设计。网格是一个方便好用的设计方法,一起来看看什么是网格,网格有哪些类型,以及如何使用网格~

01什么是网格?

网格是页面的骨架,无论创建像杂志一样的印刷页面,还是图文结合的网站页面,都需要使用网格来组织设计内容并创造良好的体验。

使用网格可以消除随机决策。通过正确地使用网格,能准确知道各类元素应该放在何处,而不是将元素随意摆放在页面上,这也有助于加速设计过程。

02网格的重要性

网格为设计赋予形状和层次结构,引导用户浏览页面并找到需要的内容。

网格有助于提高响应性设计。桌面端通常需要使用多列网格来承载文本和图像,但设计必须足够灵活的压缩列数以便适配不同设备。

03网格的五种类型

基线网格

基线网格由文本所在的位置定义。它有助于为读者创造良好的阅读体验,尤其是在有大量文本的地方。

在网页设计中考虑基线网格至关重要,考虑一下行间距如何影响页面的可读性。如果间距太紧,用户很可能会放弃阅读并离开网站。

手稿型网格

手稿型网格也称为单列网格,是最简单的网格结构之一,适用于大型连续文本和图像。本质上它是大型矩形框,内容占据大多数空间。

多列网格

多列网格有助于分解文本、照片和插图,使用的列数越多,网格的排布就越灵活。

每列之间的空间称为栏间距,它们的大小应保持一致。

并非所有的多列网格都必须对称。在很多博客网站中就运用了非对称的网格形式,主要内容占据页面三分之二的区域,其余三分之一可能是包含作者的信息的侧边栏。

模块化网格

模块化网格与多列网格相似,不同之处在于行数增多。模块化网格多用于比较复杂的布局中,为页面提供灵活的内容格式。

例如Everlane网站就使用模块化网格来组织商品的选择。

YouTube主页是另一个使用模块化网格的示例。除了左侧的边栏提供常用链接外,所有视频内容都被组织到一个4列的模块化网格中,以最大限度地增加用户在滚动时可以浏览的视频数量。

分层网格

分层网格在网页设计中最常见。这些网格的目的是按重要性排列元素。

首先将最重要的对象放在页面上,然后灵活地围绕它们使用列、行和模块来帮助组织内容。

新闻和媒体相关类网站倾向于使用这种类型的网格来吸引用户对某些文章的关注。例如上图纽约时报的主页就使用了分层网格结构。

04使用网格的技巧

知道了网格的不同类型后,接下来让我们来了解一些在设计中更好地使用网格的技巧。

先考虑网格类型

在开始设计之前,请先考虑网格的类型,而不是把它放到最后并试图让设计适合网格。

尝试打破网格

新手设计师在设计时可能会受到网格的限制。创建网格后,在设计决策合理的情况才完全可以打破网格。

网格使用的越多越会意识到它是一个指南,帮助我们更快更好地设计。

不要害怕留白

留白在设计中很重要。没有必要填满页面的每个角落,考虑在各部分内容之间留有适当边距,使用户在浏览页面时可以呼吸和暂停。

尝试使用960网格系统

960网格系统提供基于960像素宽度的常用尺寸来简化web开发流程。

960网格遵循以下结构:

  • 总宽度为960px;

  • 最多使用12列,每列宽60像素;

  • 在每列的左侧和右侧使用10px的间距;

  • 总内容区域为940px。

12列网格系统具有足够的灵活性。下面的示例中展示了如何在12列网格中使用3列布局添加内容。

总结:学会分析网格

当我们浏览页面时都要注意底层的网格。多思考设计师使用的哪种网格?使用它能带来哪种体验?

思考的越多越能学以致用,越能将优秀的网格设计应用到自己的设计中~

原文:uxplanet.org/getting-started-with-grids-in-digital-design-7aa3bcc8c881

作者:Monica Galvan译者:Clippp

-END-

原文链接:http://www.wanshiruyi.cc/news/38274.html,转载和复制请保留此链接。
以上就是关于学会网格设计的5种类型,快速提升工作效率!在一起什么时候播出全部的内容,关注我们,带您了解更多相关内容。

特别提示:本信息由相关用户自行提供,真实性未证实,仅供参考。请谨慎采用,风险自负。



上一篇:月流水7亿,全球年入近百亿,这款SLG小游戏的爆火秘籍是什么?统计图的种类

下一篇:2024年度盘点(董秘篇):有的一月接待10次调研,有的周杰伦彩虹歌词

相关推荐

  • (头条解读)红中麻将跑得快群全天不熄火

    薇【nq311355】【nq86086】,最火热的跑得快,红中等等。自助上下芬,安全绿色,多年老台。玩家多,防作弊,拒绝打团,可观战,上下芬秒到,支持支付宝微信。实名玩家,无任何压金,大小都有。无需建群,加不上微信就加QQ(493842285)踏着典雅的韵律来赴我梦中的邀约,

    2025-01-05
    0
  • 详细了解一元一分红中麻将已全面更新

    薇【nq88766】【nq86086】红中做鬼百搭,抓马方式为爆炸码,下好拉你进麻将群。最火热的跑得快,红中等等。自助上下芬,安全绿色,多年老台。玩家多,防作弊,拒绝打团,可观战,上下芬秒到,支持支付宝微信。实名玩家,保证无任何压金,大小都有。无需建群,加不上微信就加QQ【493842285】,杠牌:玩牌时,手中摸到三张一样的牌然后又自摸到一张同样的牌。将其扑倒放在桌尾,

    2025-01-05
    0
  • 热点资讯红中麻将跑得快群@在这里

    加V【nq88766】【nq86086】拿链接下载,红中做鬼百搭,抓马方式为爆炸码,下好拉你进麻将群。一句话:三个顺子或者三个同样的子称为一句话,如一二三、二三四、四五六,或者二二二、五五五。自摸胡牌:玩家从待摸牌中摸到的牌称为胡牌,其他玩家放出来的子不能胡牌,只能杠或者碰,自摸后,其他玩家要付给自摸者每家二等牌资。抢杠胡牌:玩家完后碰杠时,从待摸的子尾巴进行补

    2025-01-04
    0
  • (风起云涌)一元一分广东红中麻将@在这里

    加V【nq311355】【nq86086】加不上微信就加QQ(493842285)或如果添加频繁就换一个加,麻将群七年房费全网最低,APP苹果端签约正版游戏,上下比例一样无差价。秒提 自动结账、在线上桌、无需建群寂寞的夜晚不如来打麻将吧,喜欢再玩,绝不勉强!虽然我不能保证你在我这能百分之百赢钱,但我可以保证你的钱能百分之百到账。

    2025-01-04
    0
  • 卓越品质一元一分广东红中麻将火爆进行中

    微信一元红中麻将群群主微微【nq88766】【nq311355】一元一分群内结算,红包或者发自己的收款码一元两元红中麻将,红中赖子不带风,十五张跑得快,玩法多种玩法的群任君挑选加我微信进群,时间:全天24小时 游戏类型:单挑,多人,亲友圈模式、秒上下,我不能保证你能百分百赢钱,但我能保证钱能百分之百到位. 我只知道今生有幸,

    2025-01-04
    0