导航栏是引导用户前往全站的重要内容,这一波优化除了要让它更好看,我们还要让它的引导功能强大起来!
导航栏NavBar
一览
- 新增了一些内容:Community、登录
- 展开内容提升屏占比❓用户专心于导航栏与它的菜单时,原页面内容并没有显示的必要
状态1: 默认

- 调整选项
Home | Business | Service Provider | Smartphone | Support | Community |
---|---|---|---|---|---|
不变 | 不变 | 不变 | 不变 | Product Support, Setup Videos, Documents, Downloads, Replacements and Warranty, Register Product |
Blog, SOHO Community, SMB Community, Link Bucks |
- ⭐改Search为按钮形式❓减少空间占用,使导航栏更简洁
- ⭐Search和Log in用图标表示
- ⭐🔃新增账户登录按钮,Tether、Community注册过均可直接登录
状态2: 激活大型二级菜单
- ⭐二级大分类+三级小分类+示意图组合显示的大型菜单
- ⭐鼠标移在分类条目上时有效果
- ⭐展开与收起提供动效
- 🔃点击二级分类前往产品线页面
- 🔃点击三级分类前往产品线页面的对应章节(锚或history方法)
- 🔃点击示意图前往相关页面(TP-Link Mesh)
状态3: 激活小型二级菜单
- Support下选项:Product Support, Setup Videos, Documents, Downloads, Replacements and Warranty, Register Product
- Community下选项:Blog, SOHO Community, SMB Community, Link Bucks
- ⭐展开与收起提供动效
状态3: 激活搜索
- ⭐鼠标移过搜索按钮时有特殊效果
- ⭐下拉栏展开收起提供动效
- 🔃点击按钮后,展开并聚焦输入框、弹出QuickLink栏位,提供两部分链接
- 根据后台记录,显示最常搜索的前5个产品❓快速解决热门产品的搜索需求
- ⚡根据CMS上的设定记录,显示不多于5条推荐内容(当CMS上没有手动设定记录时,显示为Blog系统的前5条信息)更多与本记录相关细节详见搜索页Search一章
- ⭐🔃搜索过程中弹出的备选内容中出现产品型号、产品名(描述文字)
- 原来Archer AX11000 =>新搜索Archer AX11000 — AX11000 Next-Gen Tri-Band Gaming Router
状态4: 激活Login面板
- 🔃鼠标移上即激活本面板
- 🔃点击Your Devices跳转至RMA系统的Product List
- 🔃Refer a friend跳转到Link Bucks页面 (Link Bucks尚未完成时,显示Make a topic跳转到Community)
- *%%*可添加Deco、Tether等App的下载链接