最新消息,Node.js 新官网已发布 Beta 预览版本,正在招募测试志愿者。如果你对新的 Node.js 网站感兴趣,欢迎参与体验,并在对应 Github 仓库提供反馈和建议!
小懒也是第一时间详细体验了各个页面,在感受新网站带来的 UX 提升同时,也发现了一些问题。
新官网:首页
新版首页,相比老版本,从视觉效果、页面布局、展现内容都有了很大的提升,整体上看着更大气。Node.js 的介绍相比老版本也变得更突出、描述更全面。

最大的不同是增加了搜索框,提供全站检索(包含文档、博客、下载等),这样使用户检索信息变的更为快捷!

但体验的同时,也发现几个体验问题:
- 首页的 Node.js LTS 下载按钮的"向右箭头"看着有些奇怪,这里的下载并不是跳转,而是直接下载文件,改成"向下箭头"可能更有语义。
- 右侧的代码 Tab,在切换时会造成页面闪动,体验不是太好。
- 搜索框在视口中没有垂直居中,对于前端同学来说,不能理解。
新官网:Learn 页面
Learn 页由老版本的两列布局变成了三列布局,同时对左侧导航菜单进行了 UX 改造,树型目录形式的呈现,第三列给出了阅读时长、反馈入库及文档目录,用户体验变得更好。

发现问题:
- 当滚动左侧导航目录时,点击某一菜单后,导航目录会滚回到顶部,这里的体验不是很好。
- 文档顶部有面包屑导航,可能体验会更好一些。
新官网:About 页面
About 页面布局和 Learn 页面类似,在介绍页新增了 Node.js 吉祥物 "火箭龟" 的图片。

新官网:Download 页面
Download 页面的变化主要是将原有的列表 List,改成了 Select 形式,相比老版本,在历史版本、系统选择、版本选择等方便变得更为快捷。尤其是用户想下载历史版本的场景。

新官网:Blog 页面
Blog 页面的布局方式变化比较大,UX 体验更好了!内容包括最新的 Node.js 新闻,案例研究,教程和资源,同时增加了 Everything、Announcements、Releases、Vulnerabilities、Events 等 Tab 筛选,查找内容更便捷了。

发现问题:
- 点击 Events 时,出现了 404 的情况 "Page could not be found"。
- 切换到移动端访问,下拉选择框的面板定位位置也有问题。
新官网:Docs 和 Certification 页面
Docs 和 Certification 页面没有什么变化,还是跳到现有的 API 文档页面和对应站点。
欢迎您的体验和反馈!
欢迎关注我的公号(全网同名),一起学习和进步。