B 端设计尺寸是多少,实战总结B端设计尺寸。

什么是栅格?我这里就不做说明了。很多优设的文章都写的很清晰了。这篇文章仅从我最开始接触栅格所遇到的困惑和部分设计师始终纠结的点来和大家一起讨论讨论。

B 端到底用什么尺寸进行设计?

确定布局

要弄清楚用什么尺寸设计,首先要确定布局。我们常用的就是上下布局、左右布局、"T"字布局。其他布局基本上是这三者的延伸和拓展。上下布局一般是固定顶部,有点类似于 PC 网页设计,实际上也差不多。现在的B端设计中很多都会搭配着这种布局用,比如帮助中心、消息通知,客户入网申请等(这些我都遇见并做过)。左右布局和"T"字布局,一般固定左侧,右侧区域做自适应。

B 端到底用什么尺寸进行设计?来看我的实战总结!

根据布局确定明确设计尺寸范围

我们看一下百度统计最新出来的当前计算机分辨率数据,从统计的数据中可以看出,小尺寸的屏幕是越来越少了。但是不是我们就要用最小的尺寸或者用份额最大的 1920 进行设计了?

B 端到底用什么尺寸进行设计?来看我的实战总结!

显然不是按照这个维度来确定尺寸的。对网页设计来说,设计师差不多都知道有一个 1200
有效内容区域的说法。如果没有特殊要求,上下布局也是遵循这个原则的。设计师中绝大部分,包括我很多同事平时基本上用的 1920 和 1440
两种尺寸来进行设计。对于 B 端来说,不管你采用 1920 或者 1440,在做上下布局页面定宽设计的时候,遵循 1200
有效内容区域这个原则就是没有问题的,看了很多文章上面举例了 960、990、1024、1156
等等,大家都不用纠结,没有特殊要求,这些都没啥问题。

B 端到底用什么尺寸进行设计?来看我的实战总结!

上下布局在 B 端设计中是一个补充,有的可能有,有的可能没有,所以用 1920 还是 1440
最好还是根据左右布局来,保持统一。两年前我看过一篇大厂写的布局的文章,用的是 1280
的尺寸,记得是说因为考虑缩小浏览器会发生遮挡或者挤压(别问我为啥还记得,因为当时对于尺寸纠结的太厉害,至今难以忘怀),现在因为技术等方面的发展,个人认为再用
1280 的做已经不合适了。1440 的尺寸目前做中后台是比较通用的,大家也可以参考看一下蚂蚁 Ant Design。至于 1920
的用来设计 B 端行不行呢?我认为也是可以的,我就用过,也没用户反馈说显示有问题,我就当他没问题了。不过我还是建议大家在做 B端设计的时候用
1440
的来做,特别是用户群很复杂的情况下,方便低分辨率的电脑查看。当然如果我们给某一企业做定制服务,那就没尺寸的问题了,照着客户电脑尺寸来就行了。

如何来进行栅格布局?

现在有很多插件可以进行布局,软件一般也有自带布局功能。这里不做陈述:

这里介绍我常用的 sketch 布局。

B 端到底用什么尺寸进行设计?来看我的实战总结!

这里我也创建了一个 1440 的网格系统,供大家参考,大家也可以根据自己的实际情况去建立自己的网格。

B 端到底用什么尺寸进行设计?来看我的实战总结!

顶部高度没有特殊要求建议不要超过 100px,我一般就是 60-80px 内设定的;左侧可以根据目录内容自己设定一下,一般 200 多就差不多了。边距我一般设定 20px、24px。这样再对剩下的距离做栅格就行了,列宽保持偶数即可。

有时候做栅格的时候会遇到一部分列宽是 42px,一部分列宽是 43px,这种设定也是可以的,回归到栅格系统的意义,栅格本质上不是为了保证像素级精确,而是为了保证浏览视觉级别的秩序、协调与统一,所以大家没有必要纠结。

"没有绝对正确的栅格设计,只有最适合的栅格设计",希望这篇文章可以帮助对栅格有疑惑的设计师们,同时也期待大家留言,大家一起学习探讨。

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

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

(0)
重蔚的头像重蔚管理团队
上一篇 2023年3月1日 12:46
下一篇 2023年3月1日 12:46

相关推荐

  • 如何设计好看又受欢迎的企业官网

    随着电子商务迅速发展,企业官网的数量变得越来越多,想要在如此激烈的战争中成为其中的佼佼者。企业官网不但要重视用户体验的问题,还需要设计出美观吸引用户的网站版面。那麽,如何设计好看又受欢迎的企业官网? …

    2022年6月25日 建站资讯
    0307
  • 网页制作案例:如何架设一个音乐人网站

    如何架设一个音乐人网站?进入网络世代,无论是个人还是企业都会假设一个网站吸引更多目标用户,以获取更多流量和转换,当中不乏音乐人和音像公司。如果你也是音乐发烧友,同时又想架设自己的音乐人网站,那麽接下来…

    2022年6月25日 建站资讯
    0220
  • 设计产品推广页,一定要注意这5个坑。

    产品推广页设计,看上去很简单。不就是放个Logo,配一些大图,放点文案,加个按钮吗? △ by Outcrowd @ Dribbble 但很多产品推广页,要么一味追求高大上,忘记了向用户介绍产品和销售产品的初衷,毫无转化功能。又…

    2023年3月1日 SEO操作
    033
  • 网页设计中,如何通过色彩创造更优质的用户体验

    色彩几乎是所有设计体系中不可忽略的组成部分,而在网页设计中,色彩本身所发挥的作用并不单一,除了最基本的着色构成色彩搭配的作用之外,色彩能够通过对比创造视觉焦点,构建信息层次,影响用户情绪,甚至引导访…

    2022年6月25日 建站资讯
    0121
  • 怎看待“直接加入购买车”这个设计小心机?

    不得不提小米的电商网站建设,用户在购物车页面点击查看推荐其他的商品时,并非是进入详情页面,而是直接将商品添加到购物车。这种设计小心机其实隐藏着商业目的的交互行为,因为能够很好的促成更高的交易额。 一般…

    2022年6月13日
    0128
  • 想在网页设计上玩得出色?2018年又有哪些网页设计新趋势

    如果你对以往的网页设计项目感到厌烦,有无兴趣尝试一些新东西呢?虽然最近在网页领域中并没有出现很多新奇玩法或者新趋势,但在品牌运用、色彩和UI设计上,都与不少值得一提的新趋势,下面不妨一起关注下。 趋势一…

    2022年6月25日
    0112
  • 2017年logo设计趋势包含哪些

    Logo不只是一个图形或文字组成,更是体现企业的内涵和文化。好的logo设计不仅要直观地代表企业的形象,还要跟随潮流的发展,让人印象深刻。Logo设计一旦确定下来,基本上就不能再有什麽改动,所以在设计logo的时候…

    2022年6月25日 建站资讯
    0113
  • 两招提升电商网站设计

      基於资料的使用者购买行为去预测进行设计 资料这个属於近乎可以改变绝大多数的行业,尤其是电商网站设计项目,与使用者的购物模式、商品模式有着紧密的关系。因此资料的收集和分析非常适合在电商网站设计的…

    2022年6月25日
    0127

联系我们

QQ:951076433

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