[READY FOR REVIEW] Colors with Good Contrast

collections/_perspective-videos/contrast.zh-hans.md

@@ -0,0 +1,151 @@
+---
+# Translation instructions are after the "#" character in this first section. They are comments that do not show up in the web page. You do not need to translate the instructions after "#".
+# In this first section, do not translate the words before a colon. For example, do not translate "title:". Do translate the text after "title:"
+
+title: "良好的颜色对比度"
+nav_title: "良好的颜色对比度"
+lang: zh-hans    # Change "en" to the translated-language shortcode
+last_updated: 2024-07-15    # Keep the date of the English version
+order: 2
+
+translators:
+- name: "金凯"
+  link: "https://github.com/JinMokai"
+# - name: "Jan Doe"   # Replace Jan Doe with name, or delete this line if not multiple translators
+# contributors:
+# - name: "Jan Doe"   # Replace Jan Doe with contributor name, or delete this line if none
+# - name: "Jan Doe"   # Replace Jan Doe with name, or delete this line if not multiple contributors
+
+github:
+    label: wai-perspective-videos
+
+permalink: /perspective-videos/contrast/zh-hans    # Add the language shortcode to the end, with no slash at the end. For example /path/to/file/fr
+ref: /perspective-videos/contrast/  # Do not change this
+
+resource:
+    ref: /perspective-videos/ # Do not change this
+
+changelog: /perspective-videos/changelog/ # Do not change this
+acknowledgements: /perspective-videos/acknowledgements/ # Do not change this
+
+description: 关于具有良好对比度的无障碍网络色彩的视频短片--什么是无障碍网络色彩、谁依赖于无障碍网络色彩以及实现无障碍网络色彩需要做些什么。
+image: /content-images/perspective-videos/contrast.jpg
+
+# In the footer below:
+# Do not change the dates
+# Do not translate or change ACKNOWLEDGEMENTS
+# Translate the other words below.
+# Translate the Working Group name. Leave the Working Group acronym in English.
+footer: >
+  <p><strong>编辑兼项目负责人：</strong> <a href="https://www.w3.org/People/shadi">Shadi Abou-Zahra</a>。 由<a href="https://www.w3.org/WAI/EO/">欧盟委员会</a>共同资助的 <a href="https://www.w3.org/WAI/DEV/"> WAI-DEV </a>项目支持下，教育与外联工作组 (EOWG) 开发。在福特基金会的支持下更新。致谢。
+---
+
+网络无障碍对残疾人至关重要，对所有人都有用。了解无障碍环境的影响以及在各种情况下为每个人带来的益处。
+
+## 视频中的良好的颜色对比度
+{:#film.no-display}
+
+{% include video-player-data.html
+    video-id="contrast"
+    yt-id="Hui87z2Vx8o"
+    yt-id-ad="a9kNUv6N8Rk"
+%}
+
+本视频信息以[附有视觉描述的文本记录](#transcript)的形式提供。
+
+## 什么是“良好的颜色对比度”？
+{:#what}
+
+颜色必须具有足够的对比度，例如，文本颜色和背景颜色之间(技术上叫 <em>亮度对比度</em>)。这包含文本在图像、图标、按钮上。此外，交互式元素、图表、地图和其他类型内容上用于传达信息的颜色也必须区分开来。
+
+## 谁依赖这个功能？
+{:#who}
+
+-   对比敏感度低的人，这在老年人中很常见。
+-   无法区分特定颜色的人（通常称为 “色盲”）。
+
+## 有哪些其他的好处？
+{:#others}
+
+-   内容可在不同的照明条件下工作，如阳光和眩光。
+-   内容更容易被所有人阅读，包括那些没有特定视觉障碍的人。
+
+## 怎样才能做到这一点？
+{:#action}
+
+选颜色时提供足够的对比度。有一些工具可以帮助检查和选择合适的颜色组合。这最好是在早期设计阶段和选择调色板时进行。有些人需要高对比度，有些则对亮度敏感，需要[调整颜色](/perspective-videos/customizable/).
+
+## 学习更多
+{:#resources}
+
+-   **无障碍原则：**
+    -   [内容更容易看到和听到](/fundamentals/accessibility-principles/#distinguishable)
+-   **开始：**
+    -   [在前景色和背景色提供足够的对比度](/tips/designing/#provide-sufficient-contrast-between-foreground-and-background)
+-   **简单检查：**
+    -   [对比度（“色彩对比度”）](/test-evaluate/preliminary/#contrast)
+-   **用户故事：**
+    -   [Lee,无法区分某些颜色（色盲）的网购者](/people-use-web/user-stories/archived/#shopper)
+    -   [Yun，患有低视力、手颤和轻度短期记忆丧失的退休人员](/people-use-web/user-stories/archived/#retiree)
+-   **用户需要：**
+    -   [低视力者无障碍要求](https://www.w3.org/TR/low-vision-needs/)
+-   **网页内容无障碍导则([WCAG概述](/standards-guidelines/wcag/)):**
+    -   [与 “对比”有关的成功标准](https://www.w3.org/WAI/WCAG21/quickref/?tags=contrast)
+-   **移动适用性：**
+    -   [仅用颜色传递信息](/standards-guidelines/shared-experiences/#color)
+
+## 附有视觉描述的文本记录 {#transcript}
+
+<table>
+  <thead>
+    <tr>
+      <th width="65%">音频</th>
+      <th>视觉</th>
+    </tr>
+  </thead>
+  <tbody>
+    <tr>
+      <td>网络无障碍视角： 具有良好对比度的颜色</td>
+      <td>网络无障碍视角：<br>
+        具有良好对比度的颜色</td>
+    </tr>
+    <tr>
+      <td>伟大的设计往往让人几乎感觉不到它的存在。</td>
+      <td>标有方向的指示牌。一位女士正在街上开心地散步。</td>
+    </tr>
+    <tr>
+      <td>但要让事情变得混乱和令人沮丧，并不需要太多的东西。</td>
+      <td>标志的对比度变差。这位女士现在看起来很困惑。</td>
+    </tr>
+    <tr>
+      <td>选择对比度差的颜色会使导航、阅读和交互变得非常苦恼。</td>
+      <td>她看着手机上的导航应用程序。</td>
+    </tr>
+    <tr>
+      <td>良好的设计意味着前景背景和颜色之间要有足够的对比度。这不仅包括文字和图片，还包括链接、图标和按钮。</td>
+      <td>该程序有一个对比度较低的按钮，它可以变为清晰的按钮。</td>
+    </tr>
+    <tr>
+      <td>如果它重要到足以被人看到，那么它就必须清晰明了。<br>
+        这对于对比敏感度低的人来说至关重要。<br>
+        随着年龄的增长，这种情况越来越常见。</td>
+      <td>一位坐在沙发上的老人正在看平板电脑。他去读手机上的一条信息。</td>
+    </tr>
+    <tr>
+      <td>良好的颜色使得网站，应用程序能够在更多情况下更容易使用。例如不同的光照条件下。</td>
+      <td>阳光照在手机上，但文字依然清晰可读。</td>
+    </tr>
+    <tr>
+      <td>网络无障碍： 对某些人必不可少，对所有人都有用.</td>
+      <td>&nbsp;</td>
+    </tr>
+    <tr>
+      <td>请访问 w3.org/WAI/perspectives，了解有关具有良好对比度的颜色的更多信息</td>
+      <td>请访问<br>
+        w3.org/WAI/perspectives<br>
+        了解更多<br>
+        具有良好颜色对比度的信息<br>
+        W3C 无障碍网页倡议徽标</td>
+    </tr>
+  </tbody>
+</table>