Node.js 新官网来了,UI 和 UX 全面升级,欢迎体验和反馈!

最新消息,Node.js 新官网已发布 Beta 预览版本,正在招募测试志愿者。如果你对新的 Node.js 网站感兴趣,欢迎参与体验,并在对应 Github 仓库提供反馈和建议!

小懒也是第一时间详细体验了各个页面,在感受新网站带来的 UX 提升同时,也发现了一些问题。

新官网:首页

新版首页,相比老版本,从视觉效果、页面布局、展现内容都有了很大的提升,整体上看着更大气。Node.js 的介绍相比老版本也变得更突出、描述更全面。

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

但体验的同时,也发现几个体验问题:

  1. 首页的 Node.js LTS 下载按钮的"向右箭头"看着有些奇怪,这里的下载并不是跳转,而是直接下载文件,改成"向下箭头"可能更有语义。
  2. 右侧的代码 Tab,在切换时会造成页面闪动,体验不是太好。
  3. 搜索框在视口中没有垂直居中,对于前端同学来说,不能理解。

新官网:Learn 页面

Learn 页由老版本的两列布局变成了三列布局,同时对左侧导航菜单进行了 UX 改造,树型目录形式的呈现,第三列给出了阅读时长、反馈入库及文档目录,用户体验变得更好。

发现问题:

  1. 当滚动左侧导航目录时,点击某一菜单后,导航目录会滚回到顶部,这里的体验不是很好。
  2. 文档顶部有面包屑导航,可能体验会更好一些。

新官网:About 页面

About 页面布局和 Learn 页面类似,在介绍页新增了 Node.js 吉祥物 "火箭龟" 的图片。

新官网:Download 页面

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

新官网:Blog 页面

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

发现问题:

  1. 点击 Events 时,出现了 404 的情况 "Page could not be found"。
  2. 切换到移动端访问,下拉选择框的面板定位位置也有问题。

新官网:Docs 和 Certification 页面

Docs 和 Certification 页面没有什么变化,还是跳到现有的 API 文档页面和对应站点。

体验地址: beta-node-js-org.vercel.app/en

反馈地址: github.com/nodejs/node...

欢迎您的体验和反馈!

欢迎关注我的公号(全网同名),一起学习和进步。

相关推荐
漂流瓶jz2 小时前
Webpack中各种devtool配置的含义与SourceMap生成逻辑
前端·javascript·webpack
这是个栗子2 小时前
【问题解决】用pnpm创建的 Vue3项目找不到 .eslintrc.js文件 及 后续的eslint配置的解决办法
javascript·vue.js·pnpm·eslint
前端架构师-老李2 小时前
React 中 useCallback 的基本使用和原理解析
前端·react.js·前端框架
木易 士心2 小时前
CSS 中 `data-status` 的使用详解
前端·css
明月与玄武2 小时前
前端缓存战争:回车与刷新按钮的终极对决!
前端·缓存·回车 vs 点击刷新
牧马少女2 小时前
css 画一个圆角渐变色边框
前端·css
zy happy3 小时前
RuoyiApp 在vuex,state存储nickname vue2
前端·javascript·小程序·uni-app·vue·ruoyi
小雨青年3 小时前
Cursor 项目实战:AI播客策划助手(二)—— 多轮交互打磨播客文案的技术实现与实践
前端·人工智能·状态模式·交互
Nan_Shu_6143 小时前
学习:JavaScript(5)
开发语言·javascript·学习
533_3 小时前
[vue3] h函数,阻止事件冒泡
javascript·vue.js·elementui