知识分享

移动白色空间设计的最佳实践

发表日期:2019/1/7 11:24:21 文章编辑:莹晨建站 浏览次数:1875



移动白色空间设计的最佳实践


不可否认,需要在移动显示屏上挤入如此多的内容,这限制了您可以使用的空白区域。由于大量的空白空间不受影响,因此智能,平衡的方法是唯一的方法。使用白色空间,同时牢记该领域的一些最佳实践。


移动白色空间设计的最佳实践-莹晨建站-www.itccx.com


1.手指设计

在设计优化移动观看时,您首先需要考虑的是将点击目标限制在最小30到40像素,这是研究的触摸目标尺寸的理想范围。当然,除了大小之外,您还需要在触摸目标之间添加空白区域,以便用户达到他们所要达到的目标。


2.技术性:分配≤15分的用户注意力

当您感到有兴趣在页面上推送更多内容时,为自己分配15点用户注意力。让你添加到步伐的每个项目花费1点。

如果一个屏幕比另一个屏幕更重要,您需要为其分配额外的点以使其脱颖而出。只有有限的点可供您使用,很明显您不能将空白推出等式。


3.创造性地使用空白区域

您可以考虑使用对比色,形状,字体大小和不对称负空间来为您的布局提供更多动力。作为一个活跃的设计元素,白色空间与周围元素的感知相关。


4.重新排列导航菜单白色空间的设计响应

当您处理响应式网站设计时,您需要为您的空白区域设置不同的断点,以便为您的客户提供持续无缝的体验。

如果您的网站偏好多个链接,您别无选择,只能使用三栏汉堡图标查看隐藏菜单。“转向更小的屏幕空间,你必须永远不要失去与引人注目的设计相关的东西:易读性,简洁性,设计基调和品牌。”

如果您决定坚持使用汉堡包图标,一旦您的浏览器遇到某个断点,您就会注意到它会弹出,汉堡包会带走您现在丢失的链接。当汉堡包接管时,请注意每个链接之间的空白区域:这是将链接分开的好时机,因此它们适合手机上的手指点击。

如果你能做到这一点,你也可以让自己的导航菜单重新排列,然后再放入汉堡图标。例如,您可以定义某个断点,并将导航面板重新配置为从顶部到侧面。您的导航甚至可以在特定断点下使用汉堡菜单返回到顶部。这是一个具有挑战性的方法,但它将赢得客户的赞誉。

.

移动白色空间设计的最佳实践-莹晨建站-www.itccx.com


5.考虑垂直而不是水平

桌面为您提供了选择垂直和水平元素的便利。然而,移动设备的范围有助于降低而不是跨越页面。在这里,您需要努力使用空白区域来分解多个内容元素,即使它们彼此下降。始终追求简洁,清晰,让读者呼吸。

请记住,如果您在网页设计中遵循良好的白色空间管理,Shopify的响应式移动工具可以平滑地将相同的呼吸空间转换到您的移动界面,就像这些令人惊叹的Shopify主题所示。


6.思考响应式排版

总是在你的标题和正文段落之间找到适当的平衡,这样它们就不会像错位的弗兰肯斯坦身体部位一样。帮助自己一些响应式排版,并注意你的行高,字距,字母间距,文本块之间的边距,甚至是字体的颜色。

您可能没有桌面版本的奢华空白区域,但在处理最适合移动设备的排版时,您可以使用不同的组合,因此空白区域仍然是让读者专注于您的页面的一个积极因素。


7.移动响应图像

你能设法让你的图像自我扩展以适应更好的垂直观看,并且有合理的空白空间,那么实现电子商务成功可能是你的圣杯。您甚至可以决定在不牺牲读者对您网站的期望的情况下完全取出您的设计元素的哪些部分。您可能也喜欢:黑暗面的力量:黑暗的用户界面。


白色空间是您网站设计中不可或缺的一部分,更可能是在为移动受众设计时。移动到更小屏幕的空间,你必须永远不要失去与引人注目的设计相关的东西:易读性,简洁性,设计基调和品牌。


标签: 网站设计
将文章分享到..
相关新闻
全新新闻
随机新闻
最新网站设计案例

芭迪熊亲幼馆

托幼早教品牌 网站设计建设

北京大地风景建筑设计有限公司

景建筑设计有限公司 网站建设案例

AIP国际教育集团

国际艺术留学教育集团 网站建设案例

中金智汇

智能化商业企业网站设计

韩国 NETHOM

海外网站建设 科技类网站

博天大业集团

生物科技公司 网站设计 网站开发

人教社

人教教材中心 网站建设 网站制作

国际教育科技集团

国际教育科技集团 网站建设

新奥集团-新奥财务有限责任公司

新奥集团成员单位提供财务管理服务的非银行金融机构

北京大学-北京北大新世纪集团

北京大学旗下教育集团 网站建设 网站制作

国家文物局-水下文化遗产

中国水下文化遗产保护中心 网站建设

Hi,我来帮您!