先说结论:可以借它制造手感,不能借一句 WCAG AA 跳过测试
Jelly UI 最吸睛的地方,是把常见表单控件做出像软糖一样的形变和回弹。官方页面称它不依赖其他框架,用一个模块脚本即可加载 40 个自定义元素,并提供暗色模式、从右到左排版和 WCAG AA 颜色 token。对做作品集、产品发布页、互动教程和品牌实验的创作者来说,它提供了一套比普通 hover 动画更有辨识度的视觉语言。
但“颜色达到 AA 对比度”只是可访问性的一个切面。真正的表单还要回答:Tab 能否按合理顺序移动,焦点是否清楚,Enter 和空格是否按预期触发,滑块是否能被读屏理解,页面放大到 200% 是否仍可操作,系统要求减少动态效果时是否停止弹跳。自定义元素内部如果只是把原生控件包起来,语义也可能因为 Shadow DOM、标签关联或事件转发方式而发生变化。
最值得做的不是展示页,而是一份生产实测
可以选三个高频场景做最小测试:发布按钮、价格范围滑块、邮件订阅表单。先记录原生 HTML 的键盘、读屏和性能表现,再接入 Jelly UI,逐项比较焦点、错误提示、触控区域、输入延迟和动画帧率。这样内容既有漂亮画面,也不会把“能跑的 demo”误写成“已经适合所有用户”。
怎样避免把新鲜感做成干扰
软体物理适合用在确认、拖动、切换这类“动作已经发生”的瞬间,不适合让所有卡片和文字持续漂浮。中文页面信息密度通常较高,动效范围越大,越容易与标题层级、阅读节奏和输入任务争夺注意力。更稳妥的策略是只给一到两个关键交互分配强动效,其余组件保持克制,并把动画时长、振幅和阻尼做成可配置 token。
性能同样不能靠观感猜测。展示页流畅不代表十几个组件同时更新时仍流畅,也不代表中低端安卓机和省电模式下没有卡顿。上线前应在真实移动设备上记录主线程占用和长任务,同时验证脚本加载失败时,底层表单是否仍然可见、可提交。Jelly UI 的价值,是让网页交互重新有触感;负责任的用法,是把触感建立在原生语义、减少动态效果和渐进增强之上。