• 南京不动产登记今年第二次提速 ——凤凰网房产南京 2019-05-20
  • 全国取得专利代理人资格人数达3.7万 2019-05-19
  • 计划经济走向完美,看搞好公有制计划经济存在不好说来看看?是统得太死还是要这样做才科学? 2019-05-11
  • 当粮食能满足社会需要时,就可以给年轻人设计一个轻松的环境,唱唱跳跳轻松就业,大家都会说政府真好 2019-05-03
  • 青年歌手田一歌出席《传唱中国》传承经典传递正能量 2019-05-01
  • 认真落实全面从严治党要求 深入推进新时代机关党建工作 2019-04-30
  • 坚守使命 继往开来 持续讲好中国故事 2019-04-30
  • 联大通过保护巴勒斯坦平民决议 2019-04-30
  • 近十年自主创业大学毕业生比例明显上升 创业需要注意啥? 2019-04-27
  • 端午话药浴:探秘藏东山谷里的藏药浴 2019-04-20
  • 台海形势趋于严峻,我们或将面临新的台海危机! 2019-04-20
  • 我省首例侵犯公民个人信息案终审宣判 2019-04-19
  • 你反来复去说“客观事实及其规律”,自己数一下,都说了几遍了,还不是老年痴呆?要你解释一下什么是“客观事实”,又装聋作哑。 2019-04-19
  • 小米之家南京旗舰店今日正式开业 2019-04-16
  • 《世界杯相对论》:谁能站本届世界杯的C位? 2019-04-16
  • 首页 > 网页教程 > 设计分享 > 网格设计:更科学的排版方法

    快乐十分模拟器:网格设计:更科学的排版方法

    时间:2018-08-15    作者:sky   来源:我们的设计日记

    为什么要学习网格

    快乐十分推荐直选号码 www.fenos.net 有效、有规律的设计布局是设计的一个基本原则,网格无处不在,可能只是你没有注意到它的存在,简单理解就是把一个页面,根据版心划分为无数统一尺寸的网格,广泛应用于杂志、画册、门户网站、UI设计等平面设计领域。

    它能让你的设计更有秩序、更有规律,简单来说就是用更科学的方法去排版。

    ▲ 谷歌material响应UI基于 12 列网格布局

    该网格在布局之间创建视觉一致性,同时允许各种设计的灵活性,网格列的数量根据断点系统而变化。

    2. 网格的基础概念   

    列是网格的垂直部分也可以理解为内容区域,网格中的列越多,其灵活性越大。但是列并不是越多越好,PC端一般是 12 列,移动端一般是 6 列,特别是移动端不适合列太多,列太多会让页面更碎。

    ▲ PC端 970 为分辨率网格分为 12 列

    ▲ 移动端一般分为 6 列

    行是网格的水平部分,也是横向部分,它们通常在网页设计中被省略。具有行和列的网格称为??榛?,移动端行间距用的比较少可以忽略,一般在UI设计师中就是横向的间距。

    内容???/strong>

    也叫内容区域,填充设计内容,??槭怯尚泻土薪徊娲唇ǖ目占涞ノ?。

    组合区域

    区域是形成组合元素的列,行或??榈姆肿?。

    水槽

    列和行由水槽分隔。沟渠越紧,视觉张力就越大。如果你希望你界面间距大点,水槽就可以留大,相反水槽越小,越紧凑,注意一点,水槽里面是不要放内容,除非和区域一样组合使用,内容尽量放在??槔锩?。

    ▲ 图中橙色区域就是水槽

    这里做设计时候是??楹湍?橹浼渚?,最好不要放内容。

    屏幕边距

    边距是网格列和行之外的空间,不要填充内容,移动端主要是两侧空间和屏幕边缘的距离,这里设计时候切忌不要填充内容,保持页面骨架边界。

    ▲ 黄色区域就是屏幕边距,设计时候切忌填充内容,保持设计骨架统一

    上述基本就是网格的一些常用单位,当然还有更细分的流线,标记,还有各种网格类型。但是今天我们主要学习移动端的网格,只需要掌握:移动端一般分为 6 列,内容区域(UI设计元素,内容)一般放置到内容??楹妥楹夏??,水槽和屏幕边距保持留白,不放内容。

    相关推荐
    版式设计:深入浅出学会网格系统的应用
    界面设计:如何用网格系统设计出大师般的APP界面?
    网页设计教程:20步创建完美网站布局设计
    UI布局设计:文章列表与内容详情页设计案例赏析
    新手教程:9款经典网页布局设计推荐

    精彩推荐

    热门教程

  • 南京不动产登记今年第二次提速 ——凤凰网房产南京 2019-05-20
  • 全国取得专利代理人资格人数达3.7万 2019-05-19
  • 计划经济走向完美,看搞好公有制计划经济存在不好说来看看?是统得太死还是要这样做才科学? 2019-05-11
  • 当粮食能满足社会需要时,就可以给年轻人设计一个轻松的环境,唱唱跳跳轻松就业,大家都会说政府真好 2019-05-03
  • 青年歌手田一歌出席《传唱中国》传承经典传递正能量 2019-05-01
  • 认真落实全面从严治党要求 深入推进新时代机关党建工作 2019-04-30
  • 坚守使命 继往开来 持续讲好中国故事 2019-04-30
  • 联大通过保护巴勒斯坦平民决议 2019-04-30
  • 近十年自主创业大学毕业生比例明显上升 创业需要注意啥? 2019-04-27
  • 端午话药浴:探秘藏东山谷里的藏药浴 2019-04-20
  • 台海形势趋于严峻,我们或将面临新的台海危机! 2019-04-20
  • 我省首例侵犯公民个人信息案终审宣判 2019-04-19
  • 你反来复去说“客观事实及其规律”,自己数一下,都说了几遍了,还不是老年痴呆?要你解释一下什么是“客观事实”,又装聋作哑。 2019-04-19
  • 小米之家南京旗舰店今日正式开业 2019-04-16
  • 《世界杯相对论》:谁能站本届世界杯的C位? 2019-04-16
  • 四川金7乐开奖查询 香港六合彩资料大全 15选5 重庆时时彩fc登录网址 北京赛车龙虎玩法 体彩四川金7乐开奖号 足球直播吧 幸运武林走势图 澳洲幸运10开奖公告 中国竞彩网2018世界杯 广东快乐10分走势图 江岸福彩中心电话 河内五分彩走势图三星 河南幸运武林走势 北京福彩网 足彩红人馆