正能量资讯
微信小程序开发导航栏目设计技巧!

微信小程序开发导航栏目设计技巧!

  正能量小编为大家讲解下微信小程序开发的关键因素,只要用户进入到我们的微信小程序页面,我们就有责任和义务告知客户身在何处,迅速找到自己想要的产品或服务,确保用户在页面中不迷路,导航是确保用户在网页中浏览跳转时不迷路的最关键因素。

  微信系统内的所有小程序的全部页面,均会自带有微信提供的导航栏,统一解决当前在哪,如何回去的问题。其实除了微信小程序,企业还可以制作微信商城,具体可查看《正能量解析微信商城网站制作具体步骤!》在微信层级导航保持体验一致,有助于用户在微信内形成统一的体验和交互认知,无需在各小程序和其他微信页面的切换中新增学习成本或改变使用习惯。

微信小程序开发导航栏目设计技巧!

  1、微信小程序开发导航栏

  微信小程序导航栏,直接继承于客户端,除导航栏颜色之外,开发者无需亦不可对其中的内容进行自定义。但开发者需要规定小程序各个页面的跳转关系,让导航系统能够以合理的方式工作。

  微信导航栏分为导航区域、标题区域以及操作区域。其中导航区控制程序页面进程,正能量小编提醒大家目前导航栏分深浅两种基本配色。


  2、导航区(iOS系统)

  微信进入小程序的第一个页面,导航区通常只有一个操作——“返回”即返回进入小程序前的微信页面。进入小程序后的次级页面,导航区的操作为——“返回”和“关闭”。正能量小编发现“返回”即返回上一级小程序界面或微信界面;“关闭”即在当前界面直接退出小程序,回到进入小程序前的微信页面。


  3、导航区(Android系统)

  导航区仅存在唯一操作——直接退出小程序,回到进入小程序前的微信或系统桌面,安卓手机自带的硬件返回键执行返回上一级页面的操作。

  安卓导航存在一类特殊情况:当用户通过操作区的菜单将小程序添加至安卓桌面,并从安卓桌面打开小程序时,小程序的首页,不展示导航按钮。仅展示小程序标题和操作区。小程序次级页面,导航区只有返回上一级页面的操作,而点击安卓手机自带的硬件返回键也起到相同作用。


  4、微信导航栏自定义颜色规则(iOS和Android)

  小程序导航栏支持基本的背景颜色自定义功能,选择的颜色需要在满足可用性前提下,和谐搭配微信提供的两套主导航栏图标。


  5、页面内导航

  开发者可根据自身功能设计需要在页面内添加自有导航。并保持不同页面间导航一致。但是受限于手机屏幕尺寸的限制,小程序页面的导航应尽量简单,若仅为一般线性浏览的页面建议仅使用微信导航栏即可。

  微信小程序开发者可选择小程序页面添加标签分页(Tab)导航。标签分页栏可固定在页面顶部或者底部,便于用户在不同的分页间做切换。标签数量不得少于2个,最多不得超过5个,为确保点击区域,建议标签数量不超过4项。一个页面也不应出现一组以上的标签分页栏。其中小程序首页可选择微信提供的原生底部标签分页样式,该样式仅供小程序首页使用。开发时可自定义图标样式、标签文案以及文案颜色等,具体设置项如图标尺寸等参考可参考开发文档和WeUI基础控件库。

  顶部标签分页栏颜色可自定义,在自定义颜色选择中,务必注意保持分页栏标签的可用性、可视性和可操作性。


  正能量深圳网站制作公司专注赢利型网站制作、企业竞价托管、网站优化、网站维护、提升企业品牌官网,如有需求请及时联系我们,免费电话:400-008-3268。

  深圳微信小程序开发导航栏目设计技巧!由正能量深圳网站制作公司(http://www.znlds.com/ )小编整理,如需转载请注明出处!


标签:微信小程序,微信小程序开发,深圳微信小程序开发,正能量

如需转载请注明原文出处: 微信小程序开发导航栏目设计技巧!     http://www.znlds.com/hyqw/194.html

Tags:微信小程序,微信小程序开发,深圳微信小程序开发,正能量