---
title: 体验
summary: 介绍小程序体验评分中体验类规则的定义、得分标准和优化建议。
questions:
  - 体验类评分包含哪些规则？
  - 如何在小程序中使用 APP 主题变量？
  - 如何在 app.json 中配置暗黑模式？
  - 多语言使用的检测标准是什么？
  - 可交互元素的响应区域最小应该多大？
  - 如何做安全区域兼容？
  - 体验类规则是在 IDE 还是真机上检测？
---

# 体验

## 是否使用 APP 主题变量

**定义:** 小程序需要尽量多的使用 [APP 主题变量](/cn/miniapp/develop/miniapp/guide/theme/colors)，保证小程序主题色会跟随 APP 的配置而变化，该规则目前仅在 `IDE` 体验评分模式下检测。<br>
**得分标准:** 页面 `[pagePath].json` 和 app 配置 `app.json` 中是否有使用 APP 主题变量，比如 `backgroundColor`、`navigationBarBackgroundColor`<br>
**优化建议:**

- 尽量多的使用 APP 主题变量，保证小程序主题色会跟随 APP 的配置而变化。

## 是否适配暗黑模式

**定义:** 小程序是否适配暗黑模式，该规则目前仅在 `IDE` 体验评分模式下检测。<br>
**得分标准:** 判断 `app.json` 中 `darkmode` 配置是否正确配置。<br>
**优化建议:**

- `app.json` 中 `darkmode` 配置正确，并且是用 APP 主题变量可以很好的应对小程序的主题色变化以及暗黑模式的适配。

## 多语言使用

**定义:** 小程序需要适配多语言，该规则目前仅在 `IDE` 体验评分模式下检测。<br>
**得分标准:** 扫描静态代码，业务代码中是否使用中文硬编码。<br>
**优化建议:**

- 业务代码中避免使用中文硬编码，使用多语言适配。

## 可交互元素的响应区域

**定义:** 我们应该合理地设置好可交互元素的响应区域大小，如果过小会导致用户很难点中，体验很差。<br>
**得分标准:** 可交互元素的宽高都不小于 `40px`。 <br>
**优化建议:**

- 优化可交互元素的可点击区域，确保可点击区域宽高都不小于 `40px`。

## 安全区域兼容

**定义:** 所有固定位置（`position: fixed`）的可交互组件都应该在安全区域内，否则可能会无法触发事件响应，或者容易误触 Home Indicator。<br>
**得分标准:** `position: fixed` 且可交互的组件渲染在安全区域内。<br>
**优化建议:**

- 需要做好安全区域的适配，使用 `safe-area-inset-top`、`safe-area-inset-bottom` 等安全区域变量，确保可交互组件渲染在安全区域内。
