[ํžˆํž‰ .. ํžˆ..ํž‰ใ…Ž] Foundations - Accessibility

    ์žฌ๋ฐŒ๋‹ค. ๋„ˆ๋ฌด ์žฌ๋ฐŒ๋‹ค. ๋‚ด์ผ๋ถ€ํ„ฐ ๋งจ๋‚  ๊ณต๋ถ€ํ• ๊ฑฐ๋‹ค. ์ž‘์„ฑ์ค‘์ด์ง€๋งŒ ์Šคํ„ฐ๋”” ์ง„ํ–‰์„ ์œ„ํ•ด ๊ทธ๋ƒฅ ์ผ๋‹จ ์˜ฌ๋ ค๋ฒ„๋ฆฌ๊ธฐ ~

     

    Accessibility

    People use Apple’s accessibility features to personalize how they interact with their devices in ways that work for them.

    ์‚ฌ๋žŒ๋“ค์€ Apple์˜ ์ ‘๊ทผ์„ฑ ๊ธฐ๋Šฅ์„ ์‚ฌ์šฉํ•˜์—ฌ ์ž์‹ ์—๊ฒŒ ๋งž๋Š” ๋ฐฉ์‹์œผ๋กœ ์žฅ์น˜์™€ ์ƒํ˜ธ ์ž‘์šฉํ•˜๋Š” ๋ฐฉ๋ฒ•์„ ๊ฐœ์ธํ™”ํ•ฉ๋‹ˆ๋‹ค.

    An accessible app or game supports accessibility personalizations by design and gives everyone a great user experience, regardless of their capabilities or how they use their devices.

    Approximately one in seven people have a disability that affects the way they interact with the world and their devices. People can experience disabilities at any age, for any duration, and at varying levels of severity. For example, situational disabilities — such as a wrist injury from a fall or voice loss from overuse — can affect the way almost everyone interacts with their devices at various times.

    ์•ก์„ธ์Šค ๊ฐ€๋Šฅํ•œ ์•ฑ ๋˜๋Š” ๊ฒŒ์ž„์€ ๋””์ž์ธ์— ์˜ํ•œ ์ ‘๊ทผ์„ฑ ๊ฐœ์ธํ™”๋ฅผ ์ง€์›ํ•˜๋ฉฐ ๊ธฐ๋Šฅ์ด๋‚˜ ์žฅ์น˜ ์‚ฌ์šฉ ๋ฐฉ๋ฒ•์— ๊ด€๊ณ„์—†์ด ๋ชจ๋“  ์‚ฌ๋žŒ์—๊ฒŒ ํ›Œ๋ฅญํ•œ ์‚ฌ์šฉ์ž ๊ฒฝํ—˜์„ ์ œ๊ณตํ•ฉ๋‹ˆ๋‹ค.  ์•ฝ 7๋ช… ์ค‘ 1๋ช…์€ ์„ธ๊ณ„์™€ ๊ทธ๋“ค์˜ ์žฅ์น˜์™€ ์ƒํ˜ธ์ž‘์šฉํ•˜๋Š” ๋ฐฉ์‹์— ์˜ํ–ฅ์„ ๋ฏธ์น˜๋Š” ์žฅ์• ๋ฅผ ๊ฐ€์ง€๊ณ  ์žˆ๋‹ค. ์‚ฌ๋žŒ๋“ค์€ ์–ด๋–ค ๋‚˜์ด, ์–ด๋–ค ๊ธฐ๊ฐ„, ๊ทธ๋ฆฌ๊ณ  ๋‹ค์–‘ํ•œ ์ˆ˜์ค€์˜ ์žฅ์• ๋ฅผ ๊ฒฝํ—˜ํ•  ์ˆ˜ ์žˆ๋‹ค. ์˜ˆ๋ฅผ ๋“ค์–ด, ๋‚™์ƒ์œผ๋กœ ์ธํ•œ ์†๋ชฉ ๋ถ€์ƒ์ด๋‚˜ ๊ณผ๋„ํ•œ ์‚ฌ์šฉ์œผ๋กœ ์ธํ•œ ์Œ์„ฑ ์†์‹ค๊ณผ ๊ฐ™์€ ์ƒํ™ฉ ์žฅ์• ๋Š” ๊ฑฐ์˜ ๋ชจ๋“  ์‚ฌ๋žŒ์ด ๋‹ค์–‘ํ•œ ์‹œ๊ฐ„์— ์žฅ์น˜์™€ ์ƒํ˜ธ ์ž‘์šฉํ•˜๋Š” ๋ฐฉ์‹์— ์˜ํ–ฅ์„ ์ค„ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

    Best practices

    Design with accessibility in mind. Accessibility is not just about making information available to people with disabilities — it’s about making information available to everyone, regardless of their capabilities or situation. Designing your app with accessibility in mind means prioritizing simplicity and perceivability and examining every design decision to ensure that it doesn’t exclude people who have different abilities or interact with their devices in different ways.

    ์ ‘๊ทผ์„ฑ์„ ๊ณ ๋ คํ•œ ์„ค๊ณ„. ์ ‘๊ทผ์„ฑ์€ ๋‹จ์ˆœํžˆ ์žฅ์• ๋ฅผ ๊ฐ€์ง„ ์‚ฌ๋žŒ์ด ์ •๋ณด๋ฅผ ์ด์šฉํ•  ์ˆ˜ ์žˆ๋„๋ก ํ•˜๋Š” ๊ฒƒ์ด ์•„๋‹ˆ๋ผ ๋Šฅ๋ ฅ์ด๋‚˜ ์ƒํ™ฉ์— ๊ด€๊ณ„์—†์ด ๋ชจ๋“  ์‚ฌ๋žŒ์ด ์ •๋ณด๋ฅผ ์ด์šฉํ•  ์ˆ˜ ์žˆ๋„๋ก ํ•˜๋Š” ๊ฒƒ์ž…๋‹ˆ๋‹ค. ์ ‘๊ทผ์„ฑ์„ ์—ผ๋‘์— ๋‘๊ณ  ์•ฑ์„ ์„ค๊ณ„ํ•œ๋‹ค๋Š” ๊ฒƒ์€ ๋‹จ์ˆœ์„ฑ๊ณผ ์ง€๊ฐ์„ฑ์„ ์šฐ์„ ์‹œํ•˜๊ณ  ๋ชจ๋“  ์„ค๊ณ„ ๊ฒฐ์ •์„ ๊ฒ€ํ† ํ•˜์—ฌ ๋‹ค๋ฅธ ๋Šฅ๋ ฅ์„ ๊ฐ€์ง€๊ณ  ์žˆ๊ฑฐ๋‚˜ ๋‹ค๋ฅธ ๋ฐฉ์‹์œผ๋กœ ๊ธฐ๊ธฐ์™€ ์ƒํ˜ธ ์ž‘์šฉํ•˜๋Š” ์‚ฌ๋žŒ๋“ค์„ ๋ฐฐ์ œํ•˜์ง€ ์•Š๋Š”๋‹ค๋Š” ๊ฒƒ์„ ์˜๋ฏธํ•ฉ๋‹ˆ๋‹ค.

     

    Simplicity — Enabling familiar, consistent interactions that make complex tasks simple and straightforward to perform.

    ์‹ฌํ”Œํ•จ — ์นœ์ˆ™ํ•˜๊ณ  ์ผ๊ด€๋œ ์ƒํ˜ธ ์ž‘์šฉ์„ ํ†ตํ•ด ๋ณต์žกํ•œ ์ž‘์—…์„ ๊ฐ„๋‹จํ•˜๊ณ  ์‰ฝ๊ฒŒ ์ˆ˜ํ–‰ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

     

    Perceivability — Making sure that all content can be perceived whether people are using sight, hearing, or touch.

    ์ง€๊ฐ๊ฐ€๋Šฅ์„ฑ  — ์‚ฌ๋žŒ๋“ค์ด ์‹œ๊ฐ, ์ฒญ๊ฐ ๋˜๋Š” ์ด‰๊ฐ์„ ์‚ฌ์šฉํ•˜๋Š”์ง€ ์—ฌ๋ถ€์— ๊ด€๊ณ„์—†์ด ๋ชจ๋“  ์ฝ˜ํ…์ธ ๋ฅผ ์ธ์‹ํ•  ์ˆ˜ ์žˆ๋„๋ก ํ•ฉ๋‹ˆ๋‹ค.

     

    Support personalization. You already design your experience to adapt to environmental variations — such as device orientation, screen size, resolution, color gamut, and split view — because you want people to enjoy it in any context and on all supported devices. With minimal additional effort, you can design your app to support the accessibility features people use to personalize the ways they interact with their devices.

    When you use standard components to implement your interface, text and controls automatically adapt to several accessibility settings, such as Bold Text, Larger Text, Invert Colors, and Increase Contrast.

    ๊ฐœ์ธํ™”๋ฅผ ์ง€์›ํ•ฉ๋‹ˆ๋‹ค. ์‚ฌ์šฉ์ž๋Š” ์žฅ์น˜ ๋ฐฉํ–ฅ, ํ™”๋ฉด ํฌ๊ธฐ, ํ•ด์ƒ๋„, ์ƒ‰์—ญ ๋ฐ ๋ถ„ํ•  ๋ณด๊ธฐ์™€ ๊ฐ™์€ ํ™˜๊ฒฝ ๋ณ€ํ™”์— ๋งž๊ฒŒ ํ™˜๊ฒฝ์„ ์„ค๊ณ„ํ•ฉ๋‹ˆ๋‹ค. ์‚ฌ์šฉ์ž๋Š” ์‚ฌ์šฉ์ž๊ฐ€ ๋ชจ๋“  ์ƒํ™ฉ์—์„œ ๋ชจ๋“  ์ง€์› ์žฅ์น˜์—์„œ ์žฅ์น˜๋ฅผ ์ฆ๊ธธ ์ˆ˜ ์žˆ๊ธฐ๋ฅผ ์›ํ•˜๊ธฐ ๋•Œ๋ฌธ์ž…๋‹ˆ๋‹ค. ์ตœ์†Œํ•œ์˜ ์ถ”๊ฐ€ ์ž‘์—…๋งŒ์œผ๋กœ ์‚ฌ์šฉ์ž๊ฐ€ ์žฅ์น˜์™€ ์ƒํ˜ธ ์ž‘์šฉํ•˜๋Š” ๋ฐฉ์‹์„ ๊ฐœ์ธํ™”ํ•˜๋Š” ๋ฐ ์‚ฌ์šฉํ•˜๋Š” ์ ‘๊ทผ์„ฑ ๊ธฐ๋Šฅ์„ ์ง€์›ํ•˜๋„๋ก ์•ฑ์„ ์„ค๊ณ„ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.ํ‘œ์ค€ ๊ตฌ์„ฑ ์š”์†Œ๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ์ธํ„ฐํŽ˜์ด์Šค๋ฅผ ๊ตฌํ˜„ํ•˜๋ฉด ํ…์ŠคํŠธ ๋ฐ ์ปจํŠธ๋กค์ด ๊ตต๊ฒŒ ํ‘œ์‹œ๋œ ํ…์ŠคํŠธ, ํฐ ํ…์ŠคํŠธ, ๋ฐ˜์ „์ƒ‰ ๋ฐ ๋Œ€๋น„ ์ฆ๊ฐ€์™€ ๊ฐ™์€ ์—ฌ๋Ÿฌ ๊ฐ€์ง€ ๋‚ด๊ฒŒ ํ•„์š”ํ•œ ์˜ต์…˜ ์„ค์ •์— ์ž๋™์œผ๋กœ ์ ์šฉ๋ฉ๋‹ˆ๋‹ค.

     

    Audit and test your app or game for accessibility. An audit examines every element in your experience and gives you a comprehensive list of issues to fix. Testing helps you ensure that everyone can complete the most important tasks in your app, no matter how they interact with their devices.

    When you test important user flows with accessibility features turned on, you gain an appreciation for the challenges of interacting with a device in different ways. You also discover places where your app might fail to deliver a great user experience.

    ์•ฑ ๋˜๋Š” ๊ฒŒ์ž„์˜ ์ ‘๊ทผ์„ฑ์„ ๊ฐ์‚ฌํ•˜๊ณ  ํ…Œ์ŠคํŠธํ•ฉ๋‹ˆ๋‹ค. ๊ฐ์‚ฌ๋Š” ๊ฒฝํ—˜์˜ ๋ชจ๋“  ์š”์†Œ๋ฅผ ๊ฒ€์‚ฌํ•˜๊ณ  ํ•ด๊ฒฐํ•ด์•ผ ํ•  ๋ฌธ์ œ์˜ ํฌ๊ด„์  ์ธ ๋ชฉ๋ก์„ ์ œ๊ณตํ•ฉ๋‹ˆ๋‹ค. ํ…Œ์ŠคํŠธ๋ฅผ ํ†ตํ•ด ๋ชจ๋“  ์‚ฌ์šฉ์ž๊ฐ€ ์žฅ์น˜์™€ ์–ด๋–ป๊ฒŒ ์ƒํ˜ธ ์ž‘์šฉํ•˜๋“  ์•ฑ์—์„œ ๊ฐ€์žฅ ์ค‘์š”ํ•œ ์ž‘์—…์„ ์™„๋ฃŒํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.  ์•ก์„ธ์Šค ๊ฐ€๋Šฅ์„ฑ ๊ธฐ๋Šฅ์„ ์‚ฌ์šฉํ•˜์—ฌ ์ค‘์š”ํ•œ ์‚ฌ์šฉ์ž ํ๋ฆ„์„ ํ…Œ์ŠคํŠธํ•˜๋ฉด ๋‹ค์–‘ํ•œ ๋ฐฉ๋ฒ•์œผ๋กœ ์žฅ์น˜์™€ ์ƒํ˜ธ ์ž‘์šฉํ•˜๋Š” ๋ฌธ์ œ์— ๋Œ€ํ•œ ๊ฐ์‚ฌ๋ฅผ ์–ป์„ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ๋‹น์‹ ์€ ๋˜ํ•œ ๋‹น์‹ ์˜ ์•ฑ์ด ํ›Œ๋ฅญํ•œ ์‚ฌ์šฉ์ž ๊ฒฝํ—˜์„ ์ œ๊ณตํ•˜์ง€ ๋ชปํ•  ์ˆ˜๋„ ์žˆ๋Š” ์žฅ์†Œ๋ฅผ ๋ฐœ๊ฒฌํ•œ๋‹ค.

     

    For example, a common user flow in a social media app might be “post a response to a comment.” The tasks that make up this flow could include: 

    ์˜ˆ๋ฅผ ๋“ค์–ด, ์†Œ์…œ ๋ฏธ๋””์–ด ์•ฑ์˜ ์ผ๋ฐ˜์ ์ธ ์‚ฌ์šฉ์ž ํ๋ฆ„์€ "๋Œ“๊ธ€์— ๋Œ€ํ•œ ์‘๋‹ต ๊ฒŒ์‹œ"์ผ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.์ด ํ๋ฆ„์„ ๊ตฌ์„ฑํ•˜๋Š” ์ž‘์—…์—๋Š” ๋‹ค์Œ์ด ํฌํ•จ๋  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

    • Read posted comments ๊ฒŒ์‹œ๋œ ์ฃผ์„ ์ฝ๊ธฐ
    • Choose a comment for a response ์‘๋‹ต์— ๋Œ€ํ•œ ์ฃผ์„ ์„ ํƒ 
    • Open the response view ๋ฐ˜์‘ ๋ณด๊ธฐ ์—ด๊ธฐ
    • Edit the response  ๋ฐ˜์‘ ํŽธ์ง‘ 
    • Post the response ์‘๋‹ต ๊ฒŒ์‹œ

    For each critical user flow in your app or game, turn on an accessibility feature, such as VoiceOver, Reduce Motion, or Large Text Size, and make sure that you can complete every task in the flow without difficulty. After you fix the problems you uncover, turn on a different accessibility feature and run through the user flow again. To help you audit, test, and fix your app or game, consider using Xcode’s Accessibility Inspector.

    ์•ฑ์ด๋‚˜ ๊ฒŒ์ž„์˜ ๊ฐ ์ค‘์š”ํ•œ ์‚ฌ์šฉ์ž ํ๋ฆ„์— ๋Œ€ํ•ด VoiceOver, Reduce Motion ๋˜๋Š” Large Text Size์™€ ๊ฐ™์€ ์ ‘๊ทผ์„ฑ ๊ธฐ๋Šฅ์„ ์ผœ๊ณ  ํ๋ฆ„์˜ ๋ชจ๋“  ์ž‘์—…์„ ์–ด๋ ค์›€ ์—†์ด ์™„๋ฃŒํ•  ์ˆ˜ ์žˆ๋Š”์ง€ ํ™•์ธํ•˜์‹ญ์‹œ์˜ค. ๋ฐœ๊ฒฌํ•œ ๋ฌธ์ œ๋ฅผ ํ•ด๊ฒฐํ•œ ํ›„ ๋‹ค๋ฅธ ์ ‘๊ทผ์„ฑ ๊ธฐ๋Šฅ์„ ์ผœ๊ณ  ์‚ฌ์šฉ์ž ํ๋ฆ„์„ ๋‹ค์‹œ ์‹คํ–‰ํ•˜์‹ญ์‹œ์˜ค. ์•ฑ์ด๋‚˜ ๊ฒŒ์ž„์„ ๊ฐ์‚ฌ, ํ…Œ์ŠคํŠธ ๋ฐ ์ˆ˜์ •ํ•˜๋Š” ๋ฐ ๋„์›€์ด ๋˜๋ ค๋ฉด Xcode์˜ ์ ‘๊ทผ์„ฑ ๊ฒ€์‚ฌ๊ธฐ๋ฅผ ์‚ฌ์šฉํ•˜๋Š” ๊ฒƒ์„ ๊ณ ๋ คํ•˜์‹ญ์‹œ์˜ค.

    Interactions

    Assistive technologies like VoiceOver, and accessibility features like display accommodations, expand the ways people can interact with their devices. Because these technologies and features integrate with system-provided interactions, it’s essential that you support the system interactions correctly in your app.

    VoiceOver์™€ ๊ฐ™์€ ๋ณด์กฐ ๊ธฐ์ˆ ๊ณผ ๋””์Šคํ”Œ๋ ˆ์ด ์‹œ์„ค๊ณผ ๊ฐ™์€ ์ ‘๊ทผ์„ฑ ๊ธฐ๋Šฅ์€ ์‚ฌ๋žŒ๋“ค์ด ๊ธฐ๊ธฐ์™€ ์ƒํ˜ธ ์ž‘์šฉํ•  ์ˆ˜ ์žˆ๋Š” ๋ฐฉ๋ฒ•์„ ํ™•์žฅํ•ฉ๋‹ˆ๋‹ค. ์ด๋Ÿฌํ•œ ๊ธฐ์ˆ ๊ณผ ๊ธฐ๋Šฅ์€ ์‹œ์Šคํ…œ์—์„œ ์ œ๊ณตํ•˜๋Š” ์ƒํ˜ธ ์ž‘์šฉ๊ณผ ํ†ตํ•ฉ๋˜๋ฏ€๋กœ ์•ฑ์—์„œ ์‹œ์Šคํ…œ ์ƒํ˜ธ ์ž‘์šฉ์„ ์˜ฌ๋ฐ”๋ฅด๊ฒŒ ์ง€์›ํ•ด์•ผ ํ•ฉ๋‹ˆ๋‹ค.

    Gestures

    Don’t override the platform gestures. People expect system gestures — such as swiping down to reveal Notification Center or the macOS trackpad gestures available in System Settings — to work regardless of the app they’re using.

    ํ”Œ๋žซํผ ์ œ์Šค์ฒ˜๋ฅผ ๋ฌด์‹œํ•˜์ง€ ๋งˆ์‹ญ์‹œ์˜ค. ์‚ฌ์šฉ ์ค‘์ธ ์•ฑ์— ๊ด€๊ณ„์—†์ด Notification Center๋ฅผ ํ‘œ์‹œํ•˜๋„๋ก ์•„๋ž˜๋กœ ์“ธ์–ด๋‚ด๋ฆฌ๊ฑฐ๋‚˜ ์‹œ์Šคํ…œ ์„ค์ •์—์„œ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ๋Š” macOS ํŠธ๋ž™ํŒจ๋“œ ์ œ์Šค์ฒ˜์™€ ๊ฐ™์€ ์‹œ์Šคํ…œ ์ œ์Šค์ฒ˜๊ฐ€ ์ž‘๋™ํ•˜๊ธฐ๋ฅผ ๊ธฐ๋Œ€ํ•ฉ๋‹ˆ๋‹ค.

    ๐Ÿค”๊ฐœ์ธ์ ์œผ๋กœ '์˜ค..! ' ์‹ถ์—ˆ๋˜ ๋ถ€๋ถ„. ์ผ๋ฐ˜์ ์œผ๋กœ ์œ ์ €๋กœ๋ถ€ํ„ฐ ๊ธฐ๋Œ€๋˜๋Š” ์ œ์Šค์ฒ˜๊ฐ€ ์•ฑ์— ๋“ค์–ด๊ฐ”๋Š”์ง€ ํ™•์ธํ•ด๋ณด๋Š” ๊ฒƒ์ด ์ข‹๊ฒ ๋‹ค. 

     

    Prefer simplified gestures for common interactions. Complex gestures such as multifinger gestures, long presses, or repeated button presses can be challenging for many people. Using the simplest gestures possible improves the experience for everyone who interacts with your app.

    ์ผ๋ฐ˜์ ์ธ ์ƒํ˜ธ ์ž‘์šฉ์„ ์œ„ํ•ด ๋‹จ์ˆœํ™”๋œ ์ œ์Šค์ฒ˜๋ฅผ ์„ ํ˜ธํ•ฉ๋‹ˆ๋‹ค. ์—ฌ๋Ÿฌ ์†๊ฐ€๋ฝ ์ œ์Šค์ฒ˜, ๊ธธ๊ฒŒ ๋ˆ„๋ฅด๊ฑฐ๋‚˜ ๋ฒ„ํŠผ์„ ๋ฐ˜๋ณต์ ์œผ๋กœ ๋ˆ„๋ฅด๋Š” ๊ฒƒ๊ณผ ๊ฐ™์€ ๋ณต์žกํ•œ ์ œ์Šค์ฒ˜๋Š” ๋งŽ์€ ์‚ฌ๋žŒ๋“ค์—๊ฒŒ ์–ด๋ ค์šธ ์ˆ˜ ์žˆ๋‹ค. ๊ฐ€๋Šฅํ•œ ํ•œ ๊ฐ„๋‹จํ•œ ์ œ์Šค์ฒ˜๋ฅผ ์‚ฌ์šฉํ•˜๋ฉด ์•ฑ๊ณผ ์ƒํ˜ธ ์ž‘์šฉํ•˜๋Š” ๋ชจ๋“  ์‚ฌ์šฉ์ž์˜ ๊ฒฝํ—˜์ด ํ–ฅ์ƒ๋ฉ๋‹ˆ๋‹ค.

    ๐Ÿค”์ œ์Šค์ฒ˜๋Š” ์–ด์จ‹๊ฑฐ๋‚˜ ์‚ฌ์šฉ์ž ๊ฒฝํ—˜์„ ํ–ฅ์ƒ์‹œํ‚ค๋Š” ๋ฐ์— ๋„์›€์„ ์ค€๋‹ค. ํŠน์ • ์ œ์Šค์ณ๋ฅผ ํŠน์ • ๊ธฐ๋Šฅ์— ์ ์šฉ์‹œํ‚ฌ ๋•Œ, ์ด๊ฒŒ ์‚ฌ์šฉ์ž๋กœ ํ•˜์—ฌ๊ธˆ ํ˜ผ๋ž€์„ ๋นš๋Š”์ง€, ๊ธ์ •์  ํšจ๊ณผ๋ฅผ ๊ฐ€์ ธ์˜ค๋Š”์ง€๋ฅผ ๊นŠ๊ฒŒ ์ƒ๊ฐํ•ด๋ณด๋Š” ๊ณผ์ •์ด ๊ผญ ํ•„์š”ํ•˜๋‹ค๊ณ  ๋Š๋‚€๋‹ค.

     

    Provide alternative ways to perform gesture-based actions. Include an option for people who may not be able to perform a specific gesture. For example, if swiping deletes a row in a table, you can also provide an alternative way to delete items through an edit mode or by offering a Delete button in an item detail view.

    ์ œ์Šค์ฒ˜ ๊ธฐ๋ฐ˜ ์ž‘์—…์„ ์ˆ˜ํ–‰ํ•˜๋Š” ๋‹ค๋ฅธ ๋ฐฉ๋ฒ•์„ ์ œ๊ณตํ•ฉ๋‹ˆ๋‹ค. ํŠน์ • ์ œ์Šค์ฒ˜๋ฅผ ์ˆ˜ํ–‰ํ•  ์ˆ˜ ์—†๋Š” ์‚ฌ์šฉ์ž๋ฅผ ์œ„ํ•œ ์˜ต์…˜์„ ํฌํ•จํ•ฉ๋‹ˆ๋‹ค. ์˜ˆ๋ฅผ ๋“ค์–ด, ์Šค์™€์ดํ”„๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ํ…Œ์ด๋ธ”์˜ ํ–‰์„ ์‚ญ์ œํ•˜๋Š” ๊ฒฝ์šฐ ํŽธ์ง‘ ๋ชจ๋“œ๋ฅผ ํ†ตํ•ด ๋˜๋Š” ํ•ญ๋ชฉ ์„ธ๋ถ€ ์ •๋ณด ๋ณด๊ธฐ์—์„œ ์‚ญ์ œ ๋‹จ์ถ”๋ฅผ ์ œ๊ณตํ•˜์—ฌ ํ•ญ๋ชฉ์„ ์‚ญ์ œํ•  ์ˆ˜๋„ ์žˆ์Šต๋‹ˆ๋‹ค.

    ๐Ÿค” ์™€ ๋„ˆ๋ฌด ์žฌ๋ฐŒ์–ด.. ์›๋ž˜ ๊ฐ™์€ ๊ธฐ๋Šฅ์„ ํ•˜๋Š” ์š”์†Œ๋Š” ๋‘๊ฐœ ์ด์ƒ ๋ฐฐ์น˜ํ•˜๋Š” ๊ฑธ ์ตœ๋Œ€ํ•œ ํ”ผํ•˜๊ณค ํ–ˆ๋Š”๋ฐ, ์–ด์ฉŒ๋ฉด ๋‘๊ฐœ๊นŒ์ง„ ๊ดœ์ฐฎ์„์ง€๋„..? ์™œ๋ƒ๋ฉด ์• ํ”Œ์ด ๊ทธ๋ ‡๊ฒŒ ํ•˜๋‹ˆ๊นŒ ...

    When possible, make your app’s core functionality accessible through more than one type of physical interaction. For example, Camera on iPhone and iPad lets people take a photo by tapping the onscreen button or by pressing the device's volume down button. In addition to making photo-capture more convenient for everyone, these alternative interactions provide options to people who might have limited grip strength or dexterity.

    ๊ฐ€๋Šฅํ•œ ๊ฒฝ์šฐ ๋‘ ๊ฐ€์ง€ ์ด์ƒ์˜ ๋ฌผ๋ฆฌ์  ์ƒํ˜ธ ์ž‘์šฉ์„ ํ†ตํ•ด ์•ฑ์˜ ํ•ต์‹ฌ ๊ธฐ๋Šฅ์— ์•ก์„ธ์Šคํ•  ์ˆ˜ ์žˆ๋„๋ก ํ•ฉ๋‹ˆ๋‹ค. ์˜ˆ๋ฅผ ๋“ค์–ด, iPhone๊ณผ iPad์˜ Camera๋ฅผ ์‚ฌ์šฉํ•˜๋ฉด ํ™”๋ฉด ๋ฒ„ํŠผ์„ ๋ˆ„๋ฅด๊ฑฐ๋‚˜ ์žฅ์น˜์˜ ๋ณผ๋ฅจ์„ ๋‚ฎ์ถฐ์„œ ์‚ฌ์ง„์„ ์ฐ์„ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ์ด๋Ÿฌํ•œ ๋Œ€์ฒด ์ƒํ˜ธ ์ž‘์šฉ์€ ์‚ฌ์ง„ ์ดฌ์˜์„ ๋ชจ๋‘์—๊ฒŒ ๋” ํŽธ๋ฆฌํ•˜๊ฒŒ ํ•  ๋ฟ๋งŒ ์•„๋‹ˆ๋ผ ๊ทธ๋ฆฝ ๊ฐ•๋„๋‚˜ ์†์žฌ์ฃผ๊ฐ€ ์ œํ•œ๋œ ์‚ฌ๋žŒ๋“ค์—๊ฒŒ ์˜ต์…˜์„ ์ œ๊ณตํ•œ๋‹ค.

     

    Make drag and drop accessible in your iOS or iPadOS app. When you use the *accessibility APIs to identify drag sources and drop targets in your app, assistive technologies can help people drag and drop onscreen items. For developer guidance, see accessibilityDragSourceDescriptors and accessibilityDropPointDescriptors.

    iOS ๋˜๋Š” iPadOS ์•ฑ์—์„œ ๋“œ๋ž˜๊ทธ ์•ค ๋“œ๋กญ์— ์•ก์„ธ์Šคํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ์ ‘๊ทผ์„ฑ API๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ์•ฑ์—์„œ ๋“œ๋ž˜๊ทธ ์†Œ์Šค์™€ ๋“œ๋กญ ๋Œ€์ƒ์„ ์‹๋ณ„ํ•  ๋•Œ ๋ณด์กฐ ๊ธฐ์ˆ ์€ ์‚ฌ๋žŒ๋“ค์ด ํ™”๋ฉด ํ•ญ๋ชฉ์„ ๋“œ๋ž˜๊ทธ ์•ค ๋“œ๋กญํ•˜๋Š” ๊ฒƒ์„ ๋„์šธ ์ˆ˜ ์žˆ๋‹ค. ๊ฐœ๋ฐœ์ž ์ง€์นจ์€ ์œ„ ๋งํฌ๋ฅผ ์ฐธ์กฐํ•˜์‹ญ์‹œ์˜ค.

    *์œ„ ๋งํฌ ๋‘๊ฐœ๋ฅผ ๋“ค์–ด๊ฐ€๋ณด๋‹ˆ, Object C ๋Ÿฐํƒ€์ž„ ํ•จ์ˆ˜์ธ ๊ฒƒ ๊ฐ™์•„ ๋ณด์ธ๋‹ค. low-level access ๋ผ๊ณ  ํ•œ๋‹ค. 

    ๐Ÿค” swift ๋ž‘์€ ์–ด๋–ค ๊ด€๊ณ„๊ฐ€ ์žˆ๋Š”์ง€, ์–ด๋–ป๊ฒŒ ์‚ฌ์šฉํ•ด์•ผํ•˜๋Š” ์ง€๋Š” swift๊ณต๋ถ€๋ฅผ ํ•˜๋ฉด Object-C ์˜ ์ž”ํ•ด(?)๋ฅผ ์•Œ ์ˆ˜ ์žˆ์„ ๊ฑฐ๋ผ ์ƒ๊ฐํ•œ๋‹ค. 

     

    Buttons and controls

    Give all touchscreen controls and interactive elements a hit target that measures at least 44x44 pt. People with limited mobility need larger hit targets to help them interact with your app. It can be frustrating to interact with too-small controls in any platform, even when people use a pointer.

    ๋ฒ„ํŠผ ๋ฐ ์ปจํŠธ๋กค๋ชจ๋“  ํ„ฐ์น˜์Šคํฌ๋ฆฐ ์ปจํŠธ๋กค๊ณผ ๋Œ€ํ™”ํ˜• ์š”์†Œ์— ์ตœ์†Œ 44x44pt์˜ ์ ์ค‘ ํ‘œ์ ์„ ์ง€์ •ํ•œ๋‹ค. ์ด๋™์„ฑ์ด ์ œํ•œ๋œ ์‚ฌ์šฉ์ž๋Š” ์•ฑ๊ณผ ์ƒํ˜ธ ์ž‘์šฉํ•  ์ˆ˜ ์žˆ๋„๋ก ๋” ํฐ ์ ์ค‘ ๋Œ€์ƒ์ด ํ•„์š”ํ•ฉ๋‹ˆ๋‹ค. ์‚ฌ๋žŒ๋“ค์ด ํฌ์ธํ„ฐ๋ฅผ ์‚ฌ์šฉํ•˜๋Š” ๊ฒฝ์šฐ์—๋„ ์–ด๋–ค ํ”Œ๋žซํผ์—์„œ๋“  ๋„ˆ๋ฌด ์ž‘์€ ์ปจํŠธ๋กค๊ณผ ์ƒํ˜ธ ์ž‘์šฉํ•˜๋Š” ๊ฒƒ์€ ๋‹ต๋‹ตํ•  ์ˆ˜ ์žˆ๋‹ค.

     

    Characterize the accessibility of custom elements. You can use system APIs to tell assistive technologies how a component behaves. For example, using button or NSAccessibilityButton to characterize a view as a button means that VoiceOver speaks the view’s description followed by the word button, which tells people that the view behaves like a button.

    ์‚ฌ์šฉ์ž ์ง€์ • ์š”์†Œ์˜ ์ ‘๊ทผ์„ฑ์„ ํŠน์„ฑํ™”ํ•ฉ๋‹ˆ๋‹ค. ์‹œ์Šคํ…œ API๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ๋ณด์กฐ ๊ธฐ์ˆ ์— ๊ตฌ์„ฑ ์š”์†Œ๊ฐ€ ์–ด๋–ป๊ฒŒ ๋™์ž‘ํ•˜๋Š”์ง€ ์•Œ๋ ค์ค„ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ์˜ˆ๋ฅผ ๋“ค์–ด, ๋ฒ„ํŠผ ๋˜๋Š” NS AccessibilityButton์„ ์‚ฌ์šฉํ•˜์—ฌ ๋ณด๊ธฐ๋ฅผ ๋ฒ„ํŠผ๋กœ ํŠน์„ฑํ™”ํ•˜๋Š” ๊ฒƒ์€ VoiceOver๊ฐ€ ๋ณด๊ธฐ์˜ ์„ค๋ช…์„ ๋งํ•˜๊ณ  ๋‹จ์–ด ๋ฒ„ํŠผ ๋‹ค์Œ์— ๋ณด๊ธฐ๊ฐ€ ๋ฒ„ํŠผ์ฒ˜๋Ÿผ ์ž‘๋™ํ•œ๋‹ค๋Š” ๊ฒƒ์„ ์˜๋ฏธํ•ฉ๋‹ˆ๋‹ค.

     

    Use a consistent style hierarchy to communicate the relative importance of buttons. When you use a consistent hierarchy of button styles, people can grasp the importance of buttons based on their appearance. In iOS, iPadOS, and tvOS, *for example, you can use the visually prominent filled style for the button that performs the most likely action in a view, using less prominent styles — such as gray or plain — for buttons that enable less important actions. (For developer guidance, see UIButton.Configuration.) People can also turn on Button Shapes to make it easier to distinguish active buttons from surrounding content.

    ์ผ๊ด€๋œ ์Šคํƒ€์ผ ๊ณ„์ธต์„ ์‚ฌ์šฉํ•˜์—ฌ ๋ฒ„ํŠผ์˜ ์ƒ๋Œ€์  ์ค‘์š”์„ฑ์„ ์ „๋‹ฌํ•ฉ๋‹ˆ๋‹ค. ๋ฒ„ํŠผ ์Šคํƒ€์ผ์˜ ์ผ๊ด€๋œ ๊ณ„์ธต ๊ตฌ์กฐ๋ฅผ ์‚ฌ์šฉํ•  ๋•Œ ์‚ฌ๋žŒ๋“ค์€ ๋ชจ์–‘์— ๋”ฐ๋ผ ๋ฒ„ํŠผ์˜ ์ค‘์š”์„ฑ์„ ํŒŒ์•…ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ์˜ˆ๋ฅผ ๋“ค์–ด iOS, iPadOS ๋ฐ TVOS์—์„œ๋Š” ๋ณด๊ธฐ์—์„œ ๊ฐ€์žฅ ๊ฐ€๋Šฅ์„ฑ์ด ๋†’์€ ์ž‘์—…์„ ์ˆ˜ํ–‰ํ•˜๋Š” ๋ฒ„ํŠผ์— ์‹œ๊ฐ์ ์œผ๋กœ ๋ˆˆ์— ๋„๋Š” ์ฑ„์›Œ์ง„ ์Šคํƒ€์ผ์„ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ์œผ๋ฉฐ, ๋œ ์ค‘์š”ํ•œ ์ž‘์—…์„ ์‚ฌ์šฉํ•˜๋Š” ๋ฒ„ํŠผ์—๋Š” ํšŒ์ƒ‰ ๋˜๋Š” ์ผ๋ฐ˜ ์Šคํƒ€์ผ์„ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค(๊ฐœ๋ฐœ์ž ์ง€์นจ์€ UIButton ์ฐธ์กฐ).๊ตฌ์„ฑ) ๋˜ํ•œ ๋ฒ„ํŠผ ๋ชจ์–‘์„ ์„ค์ •ํ•˜์—ฌ ํ™œ์„ฑ ๋ฒ„ํŠผ๋ฅผ ์ฃผ๋ณ€ ๋‚ด์šฉ๊ณผ ์‰ฝ๊ฒŒ ๊ตฌ๋ถ„ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

     

    * ์• ํ”Œ์—์„œ ๋งํ•˜๋Š” filled button์ด ๋ญ”์ง€ ๊ถ๊ธˆํ•ด์„œ ๋ฒ„ํŠผ ๋‚ด์šฉ์„ ๊ฐ€์„œ ๋ฏธ๋ฆฌ ๋ณด๊ณ  ์™”๋‹ค. 

    ์•„๋ž˜ ๋ฒ„ํŠผ๋“ค ์ค‘ ์–ด๋–ค ๋ฒ„ํŠผ์„ ์‚ฌ์šฉํ• ์ง€๋ฅผ ๊ฒฐ์ •ํ•˜๋Š” ๋ฐ ํฐ ์˜ํ–ฅ์„ ๋ฏธ์น˜๋Š” ๊ฒƒ์ด ์ค‘์š”์„ฑ์ด๋ผ๋Š” ๊ฑธ ํ™•์ธํ•  ์ˆ˜ ์žˆ์—ˆ๋‹ค. 

     

    Prefer the system-provided switch component. SwiftUI provides a switch that indicates its state by the position of its knob and its fill color. For some people, however, the addition of labels makes it easier to perceive whether a switch is on or off. When you use system-provided switches, iOS, iPadOS, tvOS, and watchOS automatically displays on/off glyphs within them when people turn on On/Off Labels.

    ์‹œ์Šคํ…œ์—์„œ ์ œ๊ณตํ•˜๋Š” ์Šค์œ„์น˜ ๊ตฌ์„ฑ ์š”์†Œ๋ฅผ ์„ ํ˜ธํ•ฉ๋‹ˆ๋‹ค. SwiftUI๋Š” ๋…ธ๋ธŒ์˜ ์œ„์น˜์™€ ์ฑ„์šฐ๊ธฐ ์ƒ‰์ƒ์œผ๋กœ ์ƒํƒœ๋ฅผ ํ‘œ์‹œํ•˜๋Š” ์Šค์œ„์น˜๋ฅผ ์ œ๊ณตํ•ฉ๋‹ˆ๋‹ค. ๊ทธ๋Ÿฌ๋‚˜ ์ผ๋ถ€ ์‚ฌ๋žŒ๋“ค์—๊ฒŒ๋Š” ๋ผ๋ฒจ์„ ์ถ”๊ฐ€ํ•˜๋ฉด ์Šค์œ„์น˜๊ฐ€ ์ผœ์ ธ ์žˆ๋Š”์ง€ ๋˜๋Š” ๊บผ์ ธ ์žˆ๋Š”์ง€๋ฅผ ๋” ์‰ฝ๊ฒŒ ์ธ์‹ํ•  ์ˆ˜ ์žˆ๋‹ค. ์‹œ์Šคํ…œ ์ œ๊ณต ์Šค์œ„์น˜, iOS, iPadOS, TVOS ๋ฐ ์‹œ๊ณ„๋ฅผ ์‚ฌ์šฉํ•˜๋Š” ๊ฒฝ์šฐOS๋Š” ์‚ฌ๋žŒ๋“ค์ด On/Off ๋ผ๋ฒจ์„ ์ผค ๋•Œ ์ž๋™์œผ๋กœ ๊ทธ ์•ˆ์— ์žˆ๋Š” ๊ธ€๋ฆฌํ”„๋ฅผ ํ‘œ์‹œํ•ฉ๋‹ˆ๋‹ค.

     

    ๐Ÿค” ํ† ๊ธ€๋ฒ„ํŠผ์—์„œ ๋ผ๋ฒจ์„ ์ถ”๊ฐ€ํ•˜๋ฉด ๋ช‡๋ช‡ ์‚ฌ๋žŒ๋“ค์€ ๋” ์ธ์‹์„ ์ž˜ ํ•  ์ˆ˜ ์žˆ๋‹ค๊ณ  ํ•˜๋Š”๋ฐ.. ์Œ ์‚ฌ์‹ค ์ž˜ ๋ชจ๋ฅด๊ฒ ๋‹ค. ์˜คํžˆ๋ ค ๋‚œ ๊ฑฐ์Šฌ๋ฆฌ๋˜๋ฐ..

     

     

     

     

     

    Consider giving links a visual indicator in addition to color, such as an underline. It’s fine to use color to identify a link, but if you use it as the only indicator, people — such as those with color blindness or cognitive or situational attention impairments — may not be able to perceive the distinction.

    ๋งํฌ์— ๋ฐ‘์ค„๊ณผ ๊ฐ™์€ ์ƒ‰์ƒ ์™ธ์— ์‹œ๊ฐ์  ํ‘œ์‹œ๊ธฐ๋ฅผ ์ œ๊ณตํ•˜๋Š” ๊ฒƒ์„ ๊ณ ๋ คํ•˜์‹ญ์‹œ์˜ค. ๋งํฌ๋ฅผ ์‹๋ณ„ํ•˜๊ธฐ ์œ„ํ•ด ์ƒ‰์„ ์‚ฌ์šฉํ•˜๋Š” ๊ฒƒ์€ ๊ดœ์ฐฎ์ง€๋งŒ, ๊ทธ๊ฒƒ์„ ์œ ์ผํ•œ ์ง€ํ‘œ๋กœ ์‚ฌ์šฉํ•˜๋ฉด ์ƒ‰๋งน์ด๋‚˜์ธ์ง€ ๋˜๋Š” ์ƒํ™ฉ ์ฃผ์˜๋ ฅ ์žฅ์• ๊ฐ€์žˆ๋Š” ์‚ฌ๋žŒ๋“ค๊ณผ ๊ฐ™์€ ์‚ฌ๋žŒ๋“ค์ด ๊ตฌ๋ณ„์„ ์ธ์‹ํ•˜์ง€ ๋ชปํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

    ๐Ÿค” ์™€ ์ด๊ฑด ์ƒ์ƒ์น˜๋„ ๋ชปํ•œ ...๋ฐฐ๋ ค ... ์ง„์งœ ๋Œ€๋ฐ•์ด๋‹ค. ์ƒ๊ฐํ•ด๋ณด๋ฉด ์• ํ”Œ ๋ฟ๋งŒ ์•„๋‹ˆ๋ผ ๋‹ค๋ฅธ ๊ณณ์—์„œ๋„ ๋ณดํŽธ์ ์œผ๋กœ ๊ทธ๋Ÿฐ ๊ฒƒ์„ ์•Œ ์ˆ˜ ์žˆ๋‹ค.

    ๋‚˜๋„ ์ฝ”๋”ฉ ํ•˜๋‹ค๋ณด๋ฉด ์ž๋™์œผ๋กœ ์ƒ‰์ƒ+๋ฐ‘์ค„์ด ์ถ”๊ฐ€๋˜์–ด ๊ตณ์ด ๊ทธ ์Šคํƒ€์ผ๋“ค์„ ๋นผ๊ณ  ์‚ฌ์šฉํ•˜๊ณค ํ–ˆ๊ณ , ๋งŒ์•ฝ์— hoverํšจ๊ณผ๋‚˜ active ํšจ๊ณผ๋ฅผ ๋„ฃ์„ ๋•Œ ์ƒ‰๊น”๋งŒ ๋ฐ”๊พธ๊ณค ํ–ˆ๋Š”๋ฐ.. ์‹ฌ๋ฏธ์ ์ธ ๋ชฉ์ ๋งŒ ์ถฉ์กฑํ•˜๋ฉด ๋˜๋Š” ์›น/์•ฑ์—์„œ๋Š” ๊ทธ๋ ‡๊ฒŒ ํ•ด๋„ ์ƒ๊ด€ ์—†๊ฒ ์ง€๋งŒ, ๋‹ค์ˆ˜์˜ ์œ ์ €๋ฅผ ํƒ€๊นƒ์œผ๋กœ ํ•˜๋Š” ์ƒ‰๋งน์ด๋‚˜ ์ƒํ™ฉ ์ฃผ์˜๋ ฅ ์žฅ์• ๊ฐ€ ์žˆ๋Š” ์‚ฌ๋žŒ๋“ค๊นŒ์ง€ ๊ณ ๋ คํ•ด์•ผ๊ฒ ๋‹ค๋Š” ์ƒ๊ฐ! 

     

    User input

    Let people input information by speaking instead of typing. Adding a dictation button in a text entry field lets people choose speech as their preferred input method. If you create a custom keyboard, be sure to include a microphone key for dictation.

    ์‚ฌ๋žŒ๋“ค์ด ์ž…๋ ฅํ•˜๋Š” ๋Œ€์‹  ๋ง๋กœ ์ •๋ณด๋ฅผ ์ž…๋ ฅํ•˜๋„๋ก ํ•ฉ๋‹ˆ๋‹ค. ํ…์ŠคํŠธ ์ž…๋ ฅ ํ•„๋“œ์— ๋ฐ›์•„์“ฐ๊ธฐ ๋‹จ์ถ”๋ฅผ ์ถ”๊ฐ€ํ•˜๋ฉด ์‚ฌ์šฉ์ž๊ฐ€ ์„ ํ˜ธํ•˜๋Š” ์ž…๋ ฅ ๋ฐฉ๋ฒ•์œผ๋กœ ์Œ์„ฑ์„ ์„ ํƒํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ์‚ฌ์šฉ์ž ์ง€์ • ํ‚ค๋ณด๋“œ๋ฅผ ๋งŒ๋“œ๋Š” ๊ฒฝ์šฐ ๋ฐ›์•„์“ฐ๊ธฐ๋ฅผ ์œ„ํ•œ ๋งˆ์ดํฌ ํ‚ค๋ฅผ ํฌํ•จํ•ด์•ผ ํ•ฉ๋‹ˆ๋‹ค.

    ๐Ÿค” ๊ฐ€๋” ๋งˆ์ดํฌ ๊ธฐ๋Šฅ์ด ์ž˜๋ชป ๋ˆŒ๋ ค ์ผœ์ง€๋ฉด ์ข€ ํ‚น๋ฐ›๊ธด ํ•˜์ง€๋งŒ.. ๋ฉฐ์น  ์ „ ํŒ”์— ๋งˆ๋น„์™”์„ ๋•Œ ์ •๋ง ์œ ์šฉํ•˜๊ฒŒ ์ผ๋‹ค. 

     

    Support Siri or Shortcuts for performing important tasks by voice alone. To learn more about enabling Siri interactions in your app, see Siri.

    ์Œ์„ฑ๋งŒ์œผ๋กœ ์ค‘์š”ํ•œ ์ž‘์—…์„ ์ˆ˜ํ–‰ํ•  ์ˆ˜ ์žˆ๋Š” ๋ฐ”๋กœ ๊ฐ€๊ธฐ ํ‚ค๋ฅผ ์ง€์›ํ•ฉ๋‹ˆ๋‹ค. ์•ฑ์—์„œ Siri ์ƒํ˜ธ ์ž‘์šฉ์„ ํ™œ์„ฑํ™”ํ•˜๋Š” ๋ฐฉ๋ฒ•์— ๋Œ€ํ•œ ์ž์„ธํ•œ ๋‚ด์šฉ์€ Siri๋ฅผ ์ฐธ์กฐํ•˜์‹ญ์‹œ์˜ค.

     

    When possible, don’t prevent people from selecting plain text. Many people rely on using selected text as input for translations and definitions.

    ๊ฐ€๋Šฅํ•œ ๊ฒฝ์šฐ ์ผ๋ฐ˜ ํ…์ŠคํŠธ๋ฅผ ์„ ํƒํ•˜๋Š” ๊ฒƒ์„ ๊ธˆ์ง€ํ•˜์ง€ ๋งˆ์‹ญ์‹œ์˜ค. ๋งŽ์€ ์‚ฌ๋žŒ๋“ค์ด ๋ฒˆ์—ญ๊ณผ ์ •์˜๋ฅผ ์œ„ํ•ด ์„ ํƒ๋œ ํ…์ŠคํŠธ๋ฅผ ์ž…๋ ฅ์œผ๋กœ ์‚ฌ์šฉํ•ฉ๋‹ˆ๋‹ค.

    ๐Ÿค” ๊พธ์šฑ ๋ˆŒ๋ €์„ ๋•Œ ๋ณต๋ถ™/๋ถ™์—ฌ๋„ฃ๊ธฐ/๋ฒˆ์—ญ ๋“ฑ์˜ ์„ ํƒ๋œ ํ…์ŠคํŠธ๋กœ ํ•˜์—ฌ๊ธˆ ์ถ”๊ฐ€์ ์ธ ๊ธฐ๋Šฅ์„ ์ˆ˜ํ–‰ํ•  ์ˆ˜ ์žˆ๋‹ค. ์•„์ดํฐ์—” ๊ธฐ๋ณธ์ ์œผ๋กœ ์žˆ๋Š” ๊ฒƒ ๊ฐ™๋‹ค. ๊ทธ๋Ÿฌ๋‹ˆ ๊ตณ~์ด ๊ธˆ์ง€ํ•  ํ•„์š” ์—†๋‹ค๋Š” ๋œป,,  ๊ตณ์ด ๊ท€์ฐฎ๊ฒŒ ์ฝ”๋“œ ํ•œ์ค„ ๋” ์“ธ ์ผ์€ ์—†์œผ๋‹ˆ๊น .. 

     

    Haptics

    Support the system-defined haptics. Many people rely on haptics to help them interact with apps when they can’t see the screen. For example, system apps play haptics to notify people when a task has succeeded or failed or when an event is about to happen. Be sure to use the system-defined haptics consistently in your app so that you don’t confuse people. For guidance, see Playing haptics.

    ์‹œ์Šคํ…œ์ด ์ •์˜ํ•œ ํ–…ํ‹ฑ์„ ์ง€์›ํ•ฉ๋‹ˆ๋‹ค. ๋งŽ์€ ์‚ฌ๋žŒ๋“ค์ด ํ™”๋ฉด์„ ๋ณผ ์ˆ˜ ์—†์„ ๋•Œ ์•ฑ๊ณผ ์ƒํ˜ธ ์ž‘์šฉํ•  ์ˆ˜ ์žˆ๋„๋ก ํ–…ํ‹ฑ์— ์˜์กดํ•ฉ๋‹ˆ๋‹ค. ์˜ˆ๋ฅผ ๋“ค์–ด, ์‹œ์Šคํ…œ ์•ฑ์€ ์ž‘์—…์ด ์„ฑ๊ณตํ–ˆ๊ฑฐ๋‚˜ ์‹คํŒจํ–ˆ์„ ๋•Œ ๋˜๋Š” ์ด๋ฒคํŠธ๊ฐ€ ๋ฐœ์ƒํ•  ๋•Œ ์‚ฌ๋žŒ๋“ค์—๊ฒŒ ์•Œ๋ฆฌ๊ธฐ ์œ„ํ•ด ํ–…ํ‹ฑ์„ ์žฌ์ƒํ•ฉ๋‹ˆ๋‹ค. ์‹œ์Šคํ…œ ์ •์˜ ํ–…ํ‹ฑ์„ ์•ฑ์—์„œ ์ผ๊ด€๋˜๊ฒŒ ์‚ฌ์šฉํ•˜์—ฌ ์‚ฌ๋žŒ๋“ค์„ ํ˜ผ๋™ํ•˜์ง€ ์•Š๋„๋ก ํ•˜์‹ญ์‹œ์˜ค. ์ž์„ธํ•œ ๋‚ด์šฉ์€ ํ–…ํ‹ฑ ์žฌ์ƒ์„ ์ฐธ์กฐํ•˜์‹ญ์‹œ์˜ค.

    ๐Ÿค” ์˜คํ˜ธ.. ์†Œ๋ฆฌ๊ฐ€ ์•„๋‹ˆ๋ผ ๋ฌผ๋ฆฌ์ ์œผ๋กœ ๋ฌด์–ธ๊ฐ€ ๋Š๊ปด์ง€๊ฒŒ ํ•˜๋Š” ๊ฒƒ๋„ ์ฝ”๋”ฉ์œผ๋กœ ํ• ์ˆ˜๊ฐ€ ์žˆ๊ฒ ๊ตฌ๋‚˜. ํ•œ๋ฒˆ ๋งŒ๋“ค์–ด๋ณด๊ณ  ์‹ถ๋‹ค. ๋„˜ ์žฌ๋ฐŒ๊ฒ ๋‹ค! 

     

    VoiceOver

    VoiceOver gives audible descriptions of onscreen content, helping people get information and navigate when they can’t see the screen.

    VoiceOver๋Š” ํ™”๋ฉด ์ฝ˜ํ…์ธ ์— ๋Œ€ํ•œ ์Œ์„ฑ ์„ค๋ช…์„ ์ œ๊ณตํ•˜์—ฌ ์‚ฌ๋žŒ๋“ค์ด ํ™”๋ฉด์„ ๋ณผ ์ˆ˜ ์—†์„ ๋•Œ ์ •๋ณด๋ฅผ ์–ป๊ณ  ํƒ์ƒ‰ํ•˜๋Š” ๋ฐ ๋„์›€์ด ๋ฉ๋‹ˆ๋‹ค.

     

    Content descriptions

    Provide alternative descriptions for all images that convey meaning. If you don’t describe the meaningful images in your content, you prevent VoiceOver users from fully experiencing your app. To create a useful description, start by reporting what would be self-explanatory to someone who is able to see the image. Because VoiceOver reads the text surrounding the image and any captions, focus your description on information that’s conveyed by the image itself.

    ์˜๋ฏธ๋ฅผ ์ „๋‹ฌํ•˜๋Š” ๋ชจ๋“  ์ด๋ฏธ์ง€์— ๋Œ€ํ•ด ๋Œ€์ฒด ์„ค๋ช…์„ ์ œ๊ณตํ•ฉ๋‹ˆ๋‹ค. ์ฝ˜ํ…์ธ ์—์„œ ์˜๋ฏธ ์žˆ๋Š” ์ด๋ฏธ์ง€๋ฅผ ์„ค๋ช…ํ•˜์ง€ ์•Š์œผ๋ฉด VoiceOver ์‚ฌ์šฉ์ž๊ฐ€ ์•ฑ์„ ์™„์ „ํžˆ ๊ฒฝํ—˜ํ•˜์ง€ ๋ชปํ•˜๊ฒŒ ๋ฉ๋‹ˆ๋‹ค. ์œ ์šฉํ•œ ์„ค๋ช…์„ ๋งŒ๋“ค๋ ค๋ฉด ์ด๋ฏธ์ง€๋ฅผ ๋ณผ ์ˆ˜ ์žˆ๋Š” ์‚ฌ๋žŒ์—๊ฒŒ ์„ค๋ช…ํ•  ๋‚ด์šฉ์„ ๋ณด๊ณ ํ•˜๋Š” ๊ฒƒ์œผ๋กœ ์‹œ์ž‘ํ•˜์‹ญ์‹œ์˜ค. VoiceOver๋Š” ์ด๋ฏธ์ง€์™€ ์บก์…˜์„ ๋‘˜๋Ÿฌ์‹ผ ํ…์ŠคํŠธ๋ฅผ ์ฝ๊ธฐ ๋•Œ๋ฌธ์— ์ด๋ฏธ์ง€ ์ž์ฒด๊ฐ€ ์ „๋‹ฌํ•˜๋Š” ์ •๋ณด์— ์„ค๋ช…์„ ์ง‘์ค‘ํ•˜์‹ญ์‹œ์˜ค.

     

    The alternative description for this image is “Man and woman signing on FaceTime.”

     

    Make infographics fully accessible. Provide a concise description of the infographic that explains what it conveys. If people can interact with the infographic to get more or different information, you need to make these interactions available to VoiceOver users, too. The accessibility APIs provide ways to represent custom interactive elements so that assistive technologies can help people use them.

    ์ธํฌ๊ทธ๋ž˜ํ”ฝ์— ์™„์ „ํžˆ ์•ก์„ธ์Šคํ•  ์ˆ˜ ์žˆ๋„๋ก ํ•ฉ๋‹ˆ๋‹ค. ์ธํฌ๊ทธ๋ž˜ํ”ฝ์ด ์ „๋‹ฌํ•˜๋Š” ๋‚ด์šฉ์„ ์„ค๋ช…ํ•˜๋Š” ๊ฐ„๊ฒฐํ•œ ์„ค๋ช…์„ ์ œ๊ณตํ•˜์‹ญ์‹œ์˜ค. ์‚ฌ๋žŒ๋“ค์ด ์ธํฌ๊ทธ๋ž˜ํ”ฝ๊ณผ ์ƒํ˜ธ ์ž‘์šฉํ•˜์—ฌ ๋” ๋งŽ๊ฑฐ๋‚˜ ๋‹ค๋ฅธ ์ •๋ณด๋ฅผ ์–ป์„ ์ˆ˜ ์žˆ๋‹ค๋ฉด VoiceOver ์‚ฌ์šฉ์ž๋„ ์ด๋Ÿฌํ•œ ์ƒํ˜ธ ์ž‘์šฉ์„ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ๋„๋ก ํ•ด์•ผ ํ•ฉ๋‹ˆ๋‹ค. ์ ‘๊ทผ์„ฑ API๋Š” ๋ณด์กฐ ๊ธฐ์ˆ ์ด ์‚ฌ๋žŒ๋“ค์ด ์‚ฌ์šฉํ•˜๋Š” ๊ฒƒ์„ ๋„์šธ ์ˆ˜ ์žˆ๋„๋ก ์‚ฌ์šฉ์ž ์ง€์ • ๋Œ€ํ™”ํ˜• ์š”์†Œ๋ฅผ ๋‚˜ํƒ€๋‚ด๋Š” ๋ฐฉ๋ฒ•์„ ์ œ๊ณตํ•œ๋‹ค.

     

    When an image is purely decorative and isn't intended to communicate anything, hide it from assistive technologies. Making VoiceOver describe a purely decorative image can waste people’s time and add to their cognitive load without providing any benefit.

    ์ด๋ฏธ์ง€๊ฐ€ ์ˆœ์ „ํžˆ ์žฅ์‹์ ์ด๊ณ  ์–ด๋–ค ๊ฒƒ๋„ ์ „๋‹ฌํ•˜๊ธฐ ์œ„ํ•œ ๊ฒƒ์ด ์•„๋‹ˆ๋ผ๋ฉด ๋ณด์กฐ ๊ธฐ์ˆ ๋กœ๋ถ€ํ„ฐ ์ˆจ๊ธฐ์‹ญ์‹œ์˜ค. VoiceOver๊ฐ€ ์ˆœ์ „ํžˆ ์žฅ์‹์ ์ธ ์ด๋ฏธ์ง€๋ฅผ ๋ฌ˜์‚ฌํ•˜๋„๋ก ๋งŒ๋“œ๋Š” ๊ฒƒ์€ ์‚ฌ๋žŒ๋“ค์˜ ์‹œ๊ฐ„์„ ๋‚ญ๋น„ํ•˜๊ณ  ์•„๋ฌด๋Ÿฐ ์ด์ ๋„ ์ œ๊ณตํ•˜์ง€ ์•Š๊ณ  ๊ทธ๋“ค์˜ ์ธ์ง€์  ๋ถ€๋‹ด์„ ๊ฐ€์ค‘์‹œํ‚ฌ ์ˆ˜ ์žˆ๋‹ค.

     

    Give each screen a unique title and provide headings that identify sections in your information hierarchy. When people arrive on a screen, the title is the first piece of information they receive from an assistive technology. To help people understand the structure of your app, create a unique title for each screen that succinctly describes its contents or purpose. Similarly, people need accurate section headings to help them build a mental map of the information hierarchy of each screen.

    ๊ฐ ํ™”๋ฉด์— ๊ณ ์œ ํ•œ ์ œ๋ชฉ์„ ์ง€์ •ํ•˜๊ณ  ์ •๋ณด ๊ณ„์ธต์—์„œ ์„น์…˜์„ ์‹๋ณ„ํ•˜๋Š” ์ œ๋ชฉ์„ ์ œ๊ณตํ•ฉ๋‹ˆ๋‹ค. ์‚ฌ๋žŒ๋“ค์ด ํ™”๋ฉด์— ๋„์ฐฉํ–ˆ์„ ๋•Œ, ์ œ๋ชฉ์€ ๊ทธ๋“ค์ด ๋ณด์กฐ ๊ธฐ์ˆ ๋กœ๋ถ€ํ„ฐ ๋ฐ›๋Š” ์ฒซ ๋ฒˆ์งธ ์ •๋ณด์ด๋‹ค. ์‚ฌ๋žŒ๋“ค์ด ์•ฑ์˜ ๊ตฌ์กฐ๋ฅผ ์ดํ•ดํ•  ์ˆ˜ ์žˆ๋„๋ก ๊ฐ ํ™”๋ฉด์˜ ๋‚ด์šฉ์ด๋‚˜ ์šฉ๋„๋ฅผ ๊ฐ„๊ฒฐํ•˜๊ฒŒ ์„ค๋ช…ํ•˜๋Š” ๊ณ ์œ ํ•œ ์ œ๋ชฉ์„ ๋งŒ๋“œ์‹ญ์‹œ์˜ค. ๋งˆ์ฐฌ๊ฐ€์ง€๋กœ, ์‚ฌ๋žŒ๋“ค์€ ๊ฐ ํ™”๋ฉด์˜ ์ •๋ณด ๊ณ„์ธต ๊ตฌ์กฐ์— ๋Œ€ํ•œ ์ •์‹ ์  ์ง€๋„๋ฅผ ๊ตฌ์ถ•ํ•˜๋Š” ๋ฐ ๋„์›€์ด ๋˜๋Š” ์ •ํ™•ํ•œ ์„น์…˜ ์ œ๋ชฉ์ด ํ•„์š”ํ•˜๋‹ค.

     

    Help everyone enjoy your video and audio content. When you provide closed captions, audio descriptions, and transcripts, you can help people benefit from audio and video content in ways that work for them.

    Closed captions give people a textual equivalent for the audible information in a video. You can also use closed captions to provide multiple translations for the same content, letting the system choose the version that matches the device’s current settings. Because closed captions aren’t always available, it’s important to provide subtitles, too.

    Audio descriptions provide a spoken narration of important information that’s presented only visually.

    A transcript provides a complete textual description of a video, covering both audible and visual information, so that people can enjoy the video in different ways.

    For developer guidance, see Selecting subtitles and alternative audio tracks.

    ๋ชจ๋“  ์‚ฌ์šฉ์ž๊ฐ€ ๋น„๋””์˜ค ๋ฐ ์˜ค๋””์˜ค ์ฝ˜ํ…์ธ ๋ฅผ ์ฆ๊ธธ ์ˆ˜ ์žˆ๋„๋ก ์ง€์›ํ•ฉ๋‹ˆ๋‹ค. ์ž๋ง‰, ์˜ค๋””์˜ค ์„ค๋ช… ๋ฐ ์Šคํฌ๋ฆฝํŠธ๋ฅผ ์ œ๊ณตํ•˜๋ฉด ์‚ฌ์šฉ์ž์—๊ฒŒ ์ ํ•ฉํ•œ ๋ฐฉ์‹์œผ๋กœ ์˜ค๋””์˜ค ๋ฐ ๋น„๋””์˜ค ์ฝ˜ํ…์ธ ์˜ ์ด์ ์„ ์ œ๊ณตํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ํ์‡„ ์บก์…˜์€ ์‚ฌ๋žŒ๋“ค์—๊ฒŒ ๋น„๋””์˜ค์˜ ๊ฐ€์ฒญ ์ •๋ณด์™€ ๋™๋“ฑํ•œ ํ…์ŠคํŠธ๋ฅผ ์ œ๊ณตํ•œ๋‹ค. ๋˜ํ•œ ํ์‡„ ์บก์…˜์„ ์‚ฌ์šฉํ•˜์—ฌ ๋™์ผํ•œ ์ฝ˜ํ…์ธ ์— ๋Œ€ํ•ด ์—ฌ๋Ÿฌ ๊ฐœ์˜ ๋ฒˆ์—ญ์„ ์ œ๊ณตํ•˜์—ฌ ์‹œ์Šคํ…œ์—์„œ ์žฅ์น˜์˜ ํ˜„์žฌ ์„ค์ •๊ณผ ์ผ์น˜ํ•˜๋Š” ๋ฒ„์ „์„ ์„ ํƒํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ์ž๋ง‰์„ ํ•ญ์ƒ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ๋Š” ๊ฒƒ์€ ์•„๋‹ˆ๋ฏ€๋กœ ์ž๋ง‰์„ ์ œ๊ณตํ•˜๋Š” ๊ฒƒ๋„ ์ค‘์š”ํ•ฉ๋‹ˆ๋‹ค.์˜ค๋””์˜ค ์„ค๋ช…์€ ์‹œ๊ฐ์ ์œผ๋กœ๋งŒ ํ‘œ์‹œ๋˜๋Š” ์ค‘์š”ํ•œ ์ •๋ณด์˜ ์Œ์„ฑ ๋‚ด๋ ˆ์ด์…˜์„ ์ œ๊ณตํ•ฉ๋‹ˆ๋‹ค.๋…น์ทจ๋ก์€ ์‚ฌ๋žŒ๋“ค์ด ๋‹ค์–‘ํ•œ ๋ฐฉ๋ฒ•์œผ๋กœ ๋น„๋””์˜ค๋ฅผ ์ฆ๊ธธ ์ˆ˜ ์žˆ๋„๋ก ์ฒญ๊ฐ ๋ฐ ์‹œ๊ฐ ์ •๋ณด๋ฅผ ๋ชจ๋‘ ํฌํ•จํ•˜๋Š” ๋น„๋””์˜ค์— ๋Œ€ํ•œ ์™„์ „ํ•œ ํ…์ŠคํŠธ ์„ค๋ช…์„ ์ œ๊ณตํ•œ๋‹ค.๊ฐœ๋ฐœ์ž ์ง€์นจ์€ ์ž๋ง‰ ๋ฐ ๋Œ€์ฒด ์˜ค๋””์˜ค ํŠธ๋ž™ ์„ ํƒ์„ ์ฐธ์กฐํ•˜์‹ญ์‹œ์˜ค.

     

    Make sure VoiceOver users can navigate to every element. VoiceOver uses accessibility information from onscreen elements to help people understand the location of each element and what it can do. System-provided UI components include this accessibility information by default, but VoiceOver can’t help people discover and use custom elements unless you provide the information. For developer guidance, see Accessibility modifiers.

    VoiceOver ์‚ฌ์šฉ์ž๊ฐ€ ๋ชจ๋“  ์š”์†Œ๋ฅผ ํƒ์ƒ‰ํ•  ์ˆ˜ ์žˆ๋Š”์ง€ ํ™•์ธํ•ฉ๋‹ˆ๋‹ค. VoiceOver๋Š” ํ™”๋ฉด ์š”์†Œ์˜ ์ ‘๊ทผ์„ฑ ์ •๋ณด๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ์‚ฌ๋žŒ๋“ค์ด ๊ฐ ์š”์†Œ์˜ ์œ„์น˜์™€ ์ˆ˜ํ–‰ํ•  ์ˆ˜ ์žˆ๋Š” ์ž‘์—…์„ ์ดํ•ดํ•˜๋Š” ๋ฐ ๋„์›€์„์ค๋‹ˆ๋‹ค. ์‹œ์Šคํ…œ์—์„œ ์ œ๊ณตํ•˜๋Š” UI ๊ตฌ์„ฑ ์š”์†Œ์—๋Š” ๊ธฐ๋ณธ์ ์œผ๋กœ ์ด๋Ÿฌํ•œ ์ ‘๊ทผ์„ฑ ์ •๋ณด๊ฐ€ ํฌํ•จ๋˜์–ด ์žˆ์ง€๋งŒ VoiceOver๋Š” ์‚ฌ์šฉ์ž๊ฐ€ ์ •๋ณด๋ฅผ ์ œ๊ณตํ•˜์ง€ ์•Š๋Š” ํ•œ ์‚ฌ์šฉ์ž ์ •์˜ ์š”์†Œ๋ฅผ ๊ฒ€์ƒ‰ํ•˜๊ณ  ์‚ฌ์šฉํ•˜๋Š” ๋ฐ ๋„์›€์„ ์ค„ ์ˆ˜ ์—†์Šต๋‹ˆ๋‹ค. ๊ฐœ๋ฐœ์ž ์•ˆ๋‚ด๋Š” ์ ‘๊ทผ์„ฑ ์ˆ˜์ •์ž๋ฅผ ์ฐธ์กฐํ•˜์‹ญ์‹œ์˜ค. 

     

    Improve the VoiceOver experience by specifying how elements should be grouped, ordered, or linked. Proximity, alignment, and other contextual cues can help sighted people perceive the relationships among onscreen elements, but these cues don’t work well for VoiceOver users. Examine your app for places where relationships among elements are visual only, and describe these relationships to VoiceOver.

    For example, the layout below relies on proximity and centering to imply that each phrase is a caption for the image above it. However, if you don’t tell VoiceOver that each image should be grouped with its phrase, VoiceOver reads, “A large container holding a variety of mangoes. A large container holding many green artichokes. Mangoes come from trees that belong to the genus Mangifera. Artichokes come from a variety of a species of thistle.” This happens because VoiceOver reads elements from top to bottom by default. For developer guidance, see shouldGroupAccessibilityChildren and accessibilityTitleUIElement.

    ์š”์†Œ๋ฅผ ๊ทธ๋ฃนํ™”, ์ •๋ ฌ ๋˜๋Š” ์—ฐ๊ฒฐํ•˜๋Š” ๋ฐฉ๋ฒ•์„ ์ง€์ •ํ•˜์—ฌ VoiceOver ๊ฒฝํ—˜์„ ํ–ฅ์ƒ์‹œํ‚ต๋‹ˆ๋‹ค. ๊ทผ์ ‘์„ฑ, ์ •๋ ฌ ๋ฐ ๊ธฐํƒ€ ์ƒํ™ฉ ๋ณ„ ๋‹จ์„œ๋Š” ์‚ฌ๋žŒ๋“ค์ด ํ™”๋ฉด ์š”์†Œ ๊ฐ„์˜ ๊ด€๊ณ„๋ฅผ ์ธ์‹ํ•˜๋Š” ๋ฐ ๋„์›€์ด ๋  ์ˆ˜ ์žˆ์ง€๋งŒ ์ด๋Ÿฌํ•œ ๋‹จ์„œ๋Š” VoiceOver ์‚ฌ์šฉ์ž์—๊ฒŒ๋Š” ์ž˜ ์ž‘๋™ํ•˜์ง€ ์•Š์Šต๋‹ˆ๋‹ค. ์•ฑ์—์„œ ์š”์†Œ ๊ฐ„์˜ ๊ด€๊ณ„๊ฐ€ ์‹œ๊ฐ์ ์œผ๋กœ๋งŒ ํ‘œ์‹œ๋˜๋Š” ์žฅ์†Œ๋ฅผ ํ™•์ธํ•˜๊ณ  ์ด๋Ÿฌํ•œ ๊ด€๊ณ„๋ฅผ VoiceOver์— ์„ค๋ช…ํ•˜์‹ญ์‹œ์˜ค.  

    ์˜ˆ๋ฅผ ๋“ค์–ด, ์•„๋ž˜ ๋ ˆ์ด์•„์›ƒ์€ ๊ฐ ๊ตฌ๊ฐ€ ๊ทธ ์œ„์— ์žˆ๋Š” ์ด๋ฏธ์ง€์— ๋Œ€ํ•œ ์บก์…˜์ž„์„ ์•”์‹œํ•˜๊ธฐ ์œ„ํ•ด ๊ทผ์ ‘์„ฑ๊ณผ ์ค‘์•™ ๋ฐฐ์น˜์— ์˜์กดํ•ฉ๋‹ˆ๋‹ค. ๊ทธ๋Ÿฌ๋‚˜ ๊ฐ ์ด๋ฏธ์ง€๋ฅผ ๋ฌธ๊ตฌ๋กœ ๊ทธ๋ฃนํ™”ํ•ด์•ผ ํ•œ๋‹ค๊ณ  VoiceOver์— ์ง€์‹œํ•˜์ง€ ์•Š์œผ๋ฉด VoiceOver๋Š” “๋‹ค์–‘ํ•œ ๋ง๊ณ ๊ฐ€ ๋“ค์–ด ์žˆ๋Š” ํฐ ์ปจํ…Œ์ด๋„ˆ. ๋งŽ์€ ๋…น์ƒ‰ ์•„ํ‹ฐ์ดˆํฌ๊ฐ€ ๋“ค์–ด ์žˆ๋Š” ํฐ ์šฉ๊ธฐ. ๋ง๊ณ ๋Š” Mangifera ์†์— ์†ํ•˜๋Š” ๋‚˜๋ฌด์—์„œ ๋‚˜์˜ต๋‹ˆ๋‹ค. ์•„ํ‹ฐ์ดˆํฌ๋Š” ๋‹ค์–‘ํ•œ ์—‰๊ฒ…ํ€ด ์ข…์—์„œ ๋‚˜์˜ต๋‹ˆ๋‹ค.” ์ด๋Š” VoiceOver๊ฐ€ ๊ธฐ๋ณธ์ ์œผ๋กœ ์œ„์—์„œ ์•„๋ž˜๋กœ ์š”์†Œ๋ฅผ ์ฝ๊ธฐ ๋•Œ๋ฌธ์— ๋ฐœ์ƒํ•ฉ๋‹ˆ๋‹ค. ๊ฐœ๋ฐœ์ž ์ง€์นจ์€ shouldGroupAccessibilityChildren ๋ฐ accessibilityTitleUIElement๋ฅผ ์ฐธ์กฐํ•˜์‹ญ์‹œ์˜ค.

     

    Mangoes come from trees that belong to the genus Mangifera.

     

    Artichokes come from a variety of a species of thistle.

     

    Tell VoiceOver when onscreen content or layout changes. An unexpected change in content or layout can be very confusing to VoiceOver users, because it means that their mental map of the screen is no longer accurate. It’s crucial to report onscreen changes so that VoiceOver and other assistive technologies can help people update their understanding of the screen. For developer guidance, see UIAccessibility.Notification (UIKit) or NSAccessibility.Notification (AppKit).

     

     

    Help people predict when a control opens a different webpage or app. An unexpected change in context can cause confusion and require people to suddenly rebuild their mental model of the onscreen environment. One way to draw attention to a potential change in context is append an ellipsis to a button’s title. Throughout the system, an ellipsis trailing the title is the standard way for a button to communicate that it opens another window or view in which people can complete the action. For example, Mail in iOS and iPadOS appends an ellipsis to the Move Message button, signaling that a separate view opens, listing the destinations people can choose.

    ์ปจํŠธ๋กค์ด ๋‹ค๋ฅธ ์›น ํŽ˜์ด์ง€๋‚˜ ์•ฑ์„ ์—ฌ๋Š” ์‹œ๊ธฐ๋ฅผ ์˜ˆ์ธกํ•  ์ˆ˜ ์žˆ๋„๋ก ๋„์™€์ค๋‹ˆ๋‹ค. ๋ฌธ๋งฅ์˜ ์˜ˆ๊ธฐ์น˜ ์•Š์€ ๋ณ€ํ™”๋Š” ํ˜ผ๋ž€์„ ์•ผ๊ธฐํ•  ์ˆ˜ ์žˆ๊ณ  ์‚ฌ๋žŒ๋“ค์ด ๊ฐ‘์ž๊ธฐ ํ™”๋ฉด ํ™˜๊ฒฝ์— ๋Œ€ํ•œ ๊ทธ๋“ค์˜ ์ •์‹ ์  ๋ชจ๋ธ์„ ์žฌ๊ตฌ์ถ•ํ•ด์•ผ ํ•œ๋‹ค. ๋ฌธ๋งฅ์˜ ์ž ์žฌ์  ๋ณ€ํ™”์— ์ฃผ์˜๋ฅผ ๋„๋Š” ํ•œ ๊ฐ€์ง€ ๋ฐฉ๋ฒ•์€ ๋ฒ„ํŠผ ์ œ๋ชฉ์— ์ค„์ž„ํ‘œ๋ฅผ ์ถ”๊ฐ€ํ•˜๋Š” ๊ฒƒ์ด๋‹ค. ์‹œ์Šคํ…œ ์ „์ฒด์—์„œ ์ค„์ž„ํ‘œ๋Š” ๋ฒ„ํŠผ์ด ๋‹ค๋ฅธ ์ฐฝ์ด๋‚˜ ๋ณด๊ธฐ๋ฅผ ์—ด์–ด ์‚ฌ๋žŒ๋“ค์ด ์ž‘์—…์„ ์™„๋ฃŒํ•  ์ˆ˜ ์žˆ๋„๋ก ์ „๋‹ฌํ•˜๋Š” ํ‘œ์ค€ ๋ฐฉ๋ฒ•์ž…๋‹ˆ๋‹ค. ์˜ˆ๋ฅผ ๋“ค์–ด iOS์™€ ์•„์ดํŒจ๋“œOS์˜ ๋ฉ”์ผ์€ ๋ฉ”์‹œ์ง€ ์ด๋™ ๋ฒ„ํŠผ์— ์ค„์ž„ํ‘œ๋ฅผ ์ถ”๊ฐ€ํ•˜์—ฌ ์‚ฌ๋žŒ๋“ค์ด ์„ ํƒํ•  ์ˆ˜ ์žˆ๋Š” ๋ชฉ์ ์ง€๋ฅผ ๋‚˜์—ดํ•˜๋Š” ๋ณ„๋„์˜ ๋ณด๊ธฐ๊ฐ€ ์—ด๋ฆฌ๋Š” ๊ฒƒ์„ ์•Œ๋ฆฝ๋‹ˆ๋‹ค.

     

    Provide alternative text labels for all important interface elements. Alternative text labels aren’t visible onscreen, but they let VoiceOver audibly describe onscreen elements, making navigation easier for people with visual disabilities. System-provided controls have useful labels by default, but you need to create labels for custom elements. For example, if you create an accessibility element that represents a custom rating button, you might supply the label “Rate.”

    ๋ชจ๋“  ์ค‘์š”ํ•œ ์ธํ„ฐํŽ˜์ด์Šค ์š”์†Œ์— ๋Œ€ํ•ด ๋Œ€์ฒด ํ…์ŠคํŠธ ๋ ˆ์ด๋ธ”์„ ์ œ๊ณตํ•ฉ๋‹ˆ๋‹ค. ๋‹ค๋ฅธ ํ…์ŠคํŠธ ๋ ˆ์ด๋ธ”์€ ํ™”๋ฉด์— ํ‘œ์‹œ๋˜์ง€ ์•Š์ง€๋งŒ VoiceOver๊ฐ€ ํ™”๋ฉด ์š”์†Œ๋ฅผ ์ฒญ๊ฐ ์ ์œผ๋กœ ์„ค๋ช… ํ•  ์ˆ˜์žˆ๊ฒŒํ•˜์—ฌ ์‹œ๊ฐ ์žฅ์• ๊ฐ€์žˆ๋Š” ์‚ฌ๋žŒ๋“ค์ด ์‰ฝ๊ฒŒ ํƒ์ƒ‰ ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ์‹œ์Šคํ…œ์—์„œ ์ œ๊ณตํ•˜๋Š” ์ปจํŠธ๋กค์—๋Š” ๊ธฐ๋ณธ์ ์œผ๋กœ ์œ ์šฉํ•œ ๋ ˆ์ด๋ธ”์ด ์žˆ์ง€๋งŒ ์‚ฌ์šฉ์ž ์š”์†Œ์— ๋Œ€ํ•œ ๋ ˆ์ด๋ธ”์„ ์ž‘์„ฑํ•ด์•ผ ํ•ฉ๋‹ˆ๋‹ค. ์˜ˆ๋ฅผ ๋“ค์–ด ์‚ฌ์šฉ์ž ์ง€์ • ๋“ฑ๊ธ‰ ๋ฒ„ํŠผ์„ ๋‚˜ํƒ€๋‚ด๋Š” ์ ‘๊ทผ์„ฑ ์š”์†Œ๋ฅผ ์ž‘์„ฑํ•˜๋Š” ๊ฒฝ์šฐ {๋“ฑ๊ธ‰} ๋ ˆ์ด๋ธ”์„ ์ œ๊ณตํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

     

    Support the VoiceOver rotor when necessary. VoiceOver users can use an onscreen control called the rotor to navigate a document or webpage by headings, links, or other section types. The rotor can also bring up the braille keyboard. You can help VoiceOver users navigate among related items in your app by identifying these items to the rotor. For developer guidance, see UIAccessibilityCustomRotor and NSAccessibilityCustomRotor.

    ํ•„์š”ํ•œ ๊ฒฝ์šฐ VoiceOver ๋กœํ„ฐ๋ฅผ ์ง€์›ํ•ฉ๋‹ˆ๋‹ค. VoiceOver ์‚ฌ์šฉ์ž๋Š” ์ œ๋ชฉ, ๋งํฌ ๋˜๋Š” ๋‹ค๋ฅธ ์„น์…˜ ์œ ํ˜•์œผ๋กœ ๋ฌธ์„œ ๋˜๋Š” ์›น ํŽ˜์ด์ง€๋ฅผ ํƒ์ƒ‰ํ•˜๊ธฐ ์œ„ํ•ด ํšŒ ์ „์ž๋ผ๋Š” ํ™”๋ฉด ์ œ์–ด๋ฅผ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ๋กœํ„ฐ๋Š” ์ ์ž ํ‚ค๋ณด๋“œ๋ฅผ ๋“ค์–ด์˜ฌ๋ฆด ์ˆ˜๋„ ์žˆ๋‹ค. VoiceOver ์‚ฌ์šฉ์ž๊ฐ€ ํšŒ ์ „์ž์— ์ด๋Ÿฌํ•œ ํ•ญ๋ชฉ์„ ์‹๋ณ„ํ•˜์—ฌ ์•ฑ์˜ ๊ด€๋ จ ํ•ญ๋ชฉ์„ ํƒ์ƒ‰ํ•˜๋Š” ๋ฐ ๋„์›€์„ ์ค„ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ๊ฐœ๋ฐœ์ž ์ง€์นจ์€ UIAccessibilityCustomRotor ๋ฐ NSAccessibilityCustomRotor๋ฅผ ์ฐธ์กฐํ•˜์‹ญ์‹œ์˜ค.

     

    In iPadOS and macOS, make sure people can use the keyboard to navigate and interact with all onscreen components in your app. Ideally, people can turn on Full Keyboard Access and perform every task in your experience using only the keyboard. In addition to accessibility keyboard shortcuts, the system defines a large number of other keyboard shortcuts that many people use all the time. To support all users, it’s important to avoid overriding any system-defined keyboard shortcuts in your app. For guidance, see Keyboards.

    iPadOS ๋ฐ macOS์—์„œ๋Š” ์‚ฌ์šฉ์ž๊ฐ€ ํ‚ค๋ณด๋“œ๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ์•ฑ์˜ ๋ชจ๋“  ํ™”๋ฉด ๊ตฌ์„ฑ ์š”์†Œ๋ฅผ ํƒ์ƒ‰ํ•˜๊ณ  ์ƒํ˜ธ ์ž‘์šฉํ•  ์ˆ˜ ์žˆ๋Š”์ง€ ํ™•์ธํ•ฉ๋‹ˆ๋‹ค. ์ „์ฒด ํ‚ค๋ณด๋“œ ์•ก์„ธ์Šค๋ฅผ ์„ค์ •ํ•˜๊ณ  ํ‚ค๋ณด๋“œ๋งŒ ์‚ฌ์šฉํ•˜์—ฌ ์‚ฌ์šฉ์ž ํ™˜๊ฒฝ์˜ ๋ชจ๋“  ์ž‘์—…์„ ์ˆ˜ํ–‰ํ•  ์ˆ˜ ์žˆ๋Š” ๊ฒƒ์ด ์ด์ƒ์ ์ž…๋‹ˆ๋‹ค. ์ ‘๊ทผ์„ฑ ํ‚ค๋ณด๋“œ ๋‹จ์ถ•ํ‚ค ์™ธ์—๋„, ์‹œ์Šคํ…œ์€ ๋งŽ์€ ์‚ฌ๋žŒ๋“ค์ด ํ•ญ์ƒ ์‚ฌ์šฉํ•˜๋Š” ๋งŽ์€ ๋‹ค๋ฅธ ํ‚ค๋ณด๋“œ ๋‹จ์ถ•ํ‚ค๋ฅผ ์ •์˜ํ•ฉ๋‹ˆ๋‹ค. ๋ชจ๋“  ์‚ฌ์šฉ์ž๋ฅผ ์ง€์›ํ•˜๋ ค๋ฉด ์•ฑ์—์„œ ์‹œ์Šคํ…œ ์ •์˜ ํ‚ค๋ณด๋“œ ๋‹จ์ถ•ํ‚ค๋ฅผ ์žฌ์ •์˜ํ•˜์ง€ ์•Š๋Š” ๊ฒƒ์ด ์ค‘์š”ํ•ฉ๋‹ˆ๋‹ค. ์ž์„ธํ•œ ๋‚ด์šฉ์€ ํ‚ค๋ณด๋“œ๋ฅผ ์ฐธ์กฐํ•˜์‹ญ์‹œ์˜ค.

     

    Text display

    In iOS, iPadOS, tvOS, and watchOS, use Dynamic Type and test that your app’s layout adapts to all font sizes. Dynamic Type lets people pick the font size that works for them. Verify that your design can scale and that both text and glyphs are legible at all font sizes. On iPhone or iPad, for example, turn on Larger Accessibility Text Sizes in Settings > Accessibility > Display & Text Size > Larger Text, and make sure your app remains comfortably readable. You can download the Dynamic Type size tables in the Sketch, Photoshop, and Adobe XD Apple Design Resources for each platform.

    iOS, iPadOS, tvOS ๋ฐ watchOS์—์„œ Dynamic Type์„ ์‚ฌ์šฉํ•˜์—ฌ ์•ฑ์˜ ๋ ˆ์ด์•„์›ƒ์ด ๋ชจ๋“  ๊ธ€๊ผด ํฌ๊ธฐ์— ๋งž๊ฒŒ ์กฐ์ •๋˜๋Š”์ง€ ํ…Œ์ŠคํŠธํ•ฉ๋‹ˆ๋‹ค. ๋™์  ์œ ํ˜•์„ ์‚ฌ์šฉํ•˜๋ฉด ์‚ฌ์šฉ์ž๊ฐ€ ์ž์‹ ์—๊ฒŒ ์ ํ•ฉํ•œ ๊ธ€๊ผด ํฌ๊ธฐ๋ฅผ ์„ ํƒํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ์„ค๊ณ„์—์„œ ์ถ•์ฒ™์ด ๊ฐ€๋Šฅํ•˜๊ณ  ํ…์ŠคํŠธ์™€ ๋ฌธ์ž๊ฐ€ ๋ชจ๋‘ ๋ชจ๋“  ๊ธ€๊ผด ํฌ๊ธฐ์—์„œ ์ฝ์„ ์ˆ˜ ์žˆ๋Š”์ง€ ํ™•์ธํ•ฉ๋‹ˆ๋‹ค. ์˜ˆ๋ฅผ ๋“ค์–ด, iPhone ๋˜๋Š” iPad์˜ ๊ฒฝ์šฐ, ์„ค์ • > ๋‚ด๊ฒŒ ํ•„์š”ํ•œ ์˜ต์…˜ > ๋””์Šคํ”Œ๋ ˆ์ด & ํ…์ŠคํŠธ ํฌ๊ธฐ > ํฐ ํ…์ŠคํŠธ์—์„œ ๋‚ด๊ฒŒ ํ•„์š”ํ•œ ์˜ต์…˜ ํ…์ŠคํŠธ ํฌ๊ธฐ๋ฅผ ์„ค์ •ํ•˜๊ณ  ์•ฑ์„ ํŽธ์•ˆํ•˜๊ฒŒ ์ฝ์„ ์ˆ˜ ์žˆ๋„๋ก ํ•ฉ๋‹ˆ๋‹ค. Dynamic Type ํฌ๊ธฐ ํ‘œ๋Š” ๊ฐ ํ”Œ๋žซํผ์˜ Sketch, Photoshop ๋ฐ Adobe XD Apple Design Resources์—์„œ ๋‹ค์šด๋กœ๋“œํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

     

     

    As font size increases, keep text truncation to a minimum. In general, aim to display as much useful text in the largest accessibility font size as you do in the largest standard font size. Avoid truncating text in scrollable regions unless people can open a separate view to read the rest of the content. You can prevent text truncation in a label by configuring it to use as many lines as needed to display a useful amount of text; for developer guidance, see numberOfLines.

    ๊ธ€๊ผด ํฌ๊ธฐ๊ฐ€ ์ฆ๊ฐ€ํ•˜๋ฉด ํ…์ŠคํŠธ ์ž˜๋ผ๋‚ด๊ธฐ๋ฅผ ์ตœ์†Œํ™”ํ•ฉ๋‹ˆ๋‹ค. ์ผ๋ฐ˜์ ์œผ๋กœ ๊ฐ€์žฅ ํฐ ํ‘œ์ค€ ๊ธ€๊ผด ํฌ๊ธฐ์—์„œ์™€ ๋งˆ์ฐฌ๊ฐ€์ง€๋กœ ๊ฐ€์žฅ ํฐ ์ ‘๊ทผ์„ฑ ๊ธ€๊ผด ํฌ๊ธฐ์— ์œ ์šฉํ•œ ํ…์ŠคํŠธ๋ฅผ ํ‘œ์‹œํ•˜๋Š” ๊ฒƒ์„ ๋ชฉํ‘œ๋กœ ํ•ฉ๋‹ˆ๋‹ค. ์‚ฌ์šฉ์ž๊ฐ€ ๋ณ„๋„์˜ ๋ณด๊ธฐ๋ฅผ ์—ด์–ด ๋‚˜๋จธ์ง€ ๋‚ด์šฉ์„ ์ฝ์„ ์ˆ˜ ์—†๋Š” ๊ฒฝ์šฐ์—๋Š” ์Šคํฌ๋กค ๊ฐ€๋Šฅํ•œ ์˜์—ญ์—์„œ ํ…์ŠคํŠธ๋ฅผ ์ž˜๋ผ๋‚ด์ง€ ๋งˆ์‹ญ์‹œ์˜ค. ์œ ์šฉํ•œ ์–‘์˜ ํ…์ŠคํŠธ๋ฅผ ํ‘œ์‹œํ•˜๋Š” ๋ฐ ํ•„์š”ํ•œ๋งŒํผ์˜ ํ–‰์„ ์‚ฌ์šฉํ•˜๋„๋ก ๋ ˆ์ด๋ธ”์„ ๊ตฌ์„ฑํ•˜์—ฌ ๋ ˆ์ด๋ธ”์˜ ํ…์ŠคํŠธ ์ž˜๋ผ ๋‚ด๊ธฐ๋ฅผ ๋ฐฉ์ง€ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ๊ฐœ๋ฐœ์ž ์•ˆ๋‚ด๋Š” numberOfLines๋ฅผ ์ฐธ์กฐํ•˜์‹ญ์‹œ์˜ค.

     

    Consider adjusting layout at large font sizes. When font size increases, inline items and container boundaries can crowd text, making it less readable. For example, if you display text inline with secondary items — such as glyphs or timestamps — the text has less horizontal space. At large font sizes, an inline layout might cause text to truncate or result in overlapping text and secondary items. In this case, consider using a stacked layout where the text appears above the secondary items. Similarly, multiple columns of text can become less readable at large font sizes because each column constrains horizontal space. In this case, consider reducing the number of columns when font size increases to avoid text truncation and improve overall readability. For developer guidance, see isAccessibilityCategory.

    ํฐ ๊ธ€๊ผด ํฌ๊ธฐ๋กœ ๋ ˆ์ด์•„์›ƒ์„ ์กฐ์ •ํ•˜๋Š” ๊ฒƒ์ด ์ข‹์Šต๋‹ˆ๋‹ค. ๊ธ€๊ผด ํฌ๊ธฐ๊ฐ€ ์ฆ๊ฐ€ํ•˜๋ฉด ์ธ๋ผ์ธ ํ•ญ๋ชฉ๊ณผ ์ปจํ…Œ์ด๋„ˆ ๊ฒฝ๊ณ„๊ฐ€ ํ…์ŠคํŠธ๋ฅผ ๊ตฐ์ง‘ํ™”ํ•˜์—ฌ ์ฝ์„ ์ˆ˜ ์—†๊ฒŒ ๋ฉ๋‹ˆ๋‹ค. ์˜ˆ๋ฅผ ๋“ค์–ด, ๋ฌธ์ž๋‚˜ ํƒ€์ž„์Šคํƒฌํ”„์™€ ๊ฐ™์€ ๋ณด์กฐ ํ•ญ๋ชฉ์— ์ค„์„ ๋งž์ถฐ ํ…์ŠคํŠธ๋ฅผ ํ‘œ์‹œํ•˜๋Š” ๊ฒฝ์šฐ ํ…์ŠคํŠธ์˜ ์ˆ˜ํ‰ ๊ณต๊ฐ„์ด ์ค„์–ด๋“ญ๋‹ˆ๋‹ค. ๊ธ€๊ผด ํฌ๊ธฐ๊ฐ€ ํฌ๋ฉด ์ธ๋ผ์ธ ๋ ˆ์ด์•„์›ƒ์œผ๋กœ ์ธํ•ด ํ…์ŠคํŠธ๊ฐ€ ์ž˜๋ฆฌ๊ฑฐ๋‚˜ ํ…์ŠคํŠธ ๋ฐ ๋ณด์กฐ ํ•ญ๋ชฉ์ด ๊ฒน์น  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ์ด ๊ฒฝ์šฐ ํ…์ŠคํŠธ๊ฐ€ ๋ณด์กฐ ํ•ญ๋ชฉ ์œ„์— ๋‚˜ํƒ€๋‚˜๋Š” ์Šคํƒํ˜• ๋ ˆ์ด์•„์›ƒ์„ ์‚ฌ์šฉํ•˜๋Š” ๊ฒƒ์ด ์ข‹์Šต๋‹ˆ๋‹ค. ๋งˆ์ฐฌ๊ฐ€์ง€๋กœ, ๊ฐ ์—ด์ด ์ˆ˜ํ‰ ๊ณต๊ฐ„์„ ์ œํ•œํ•˜๊ธฐ ๋•Œ๋ฌธ์— ํฐ ๊ธ€๊ผด ํฌ๊ธฐ์—์„œ ํ…์ŠคํŠธ์˜ ์—ฌ๋Ÿฌ ์—ด์„ ์ฝ์„ ์ˆ˜ ์—†์Šต๋‹ˆ๋‹ค. ์ด ๊ฒฝ์šฐ ํ…์ŠคํŠธ ์ž˜๋ฆผ์„ ๋ฐฉ์ง€ํ•˜๊ณ  ์ „์ฒด ๊ฐ€๋…์„ฑ์„ ํ–ฅ์ƒ์‹œํ‚ค๊ธฐ ์œ„ํ•ด ๊ธ€๊ผด ํฌ๊ธฐ๊ฐ€ ์ฆ๊ฐ€ํ•  ๋•Œ ์—ด ์ˆ˜๋ฅผ ์ค„์ด๋Š” ๊ฒƒ์ด ์ข‹์Šต๋‹ˆ๋‹ค. ๊ฐœ๋ฐœ์ž ์ง€์นจ์€ isAccessibilityCategory๋ฅผ ์ฐธ์กฐํ•˜์‹ญ์‹œ์˜ค.

    At smaller text sizes, Mail displays the date inline with the sender’s name. / At the largest accessibility text size, Mail displays the date below the recipient’s name.

     

    Increase the size of meaningful interface icons as font size increases. If you use interface icons to communicate important information, make sure they are easy to view at larger font sizes, too. When you use SF Symbols, you get icons that scale automatically with Dynamic Type size changes.

    ๊ธ€๊ผด ํฌ๊ธฐ๊ฐ€ ์ฆ๊ฐ€ํ•จ์— ๋”ฐ๋ผ ์˜๋ฏธ ์žˆ๋Š” ์ธํ„ฐํŽ˜์ด์Šค ์•„์ด์ฝ˜์˜ ํฌ๊ธฐ๋ฅผ ๋Š˜๋ฆฝ๋‹ˆ๋‹ค. ์ค‘์š”ํ•œ ์ •๋ณด๋ฅผ ์ „๋‹ฌํ•˜๊ธฐ ์œ„ํ•ด ์ธํ„ฐํŽ˜์ด์Šค ์•„์ด์ฝ˜์„ ์‚ฌ์šฉํ•˜๋Š” ๊ฒฝ์šฐ, ๋” ํฐ ๊ธ€๊ผด ํฌ๊ธฐ์—์„œ๋„ ์‰ฝ๊ฒŒ ๋ณผ ์ˆ˜ ์žˆ๋„๋ก ํ•˜์‹ญ์‹œ์˜ค. SF ๊ธฐํ˜ธ๋ฅผ ์‚ฌ์šฉํ•˜๋ฉด ๋™์  ์œ ํ˜• ํฌ๊ธฐ๊ฐ€ ๋ณ€๊ฒฝ๋˜์–ด ์ž๋™์œผ๋กœ ํ™•์žฅ๋˜๋Š” ์•„์ด์ฝ˜์ด ๋‚˜ํƒ€๋‚ฉ๋‹ˆ๋‹ค.

     

    Maintain a consistent information hierarchy regardless of the current font size. For example, keep primary elements toward the top of the screen even when the font size is very large, so that people don’t lose track of these elements.

    ํ˜„์žฌ ๊ธ€๊ผด ํฌ๊ธฐ์— ๊ด€๊ณ„์—†์ด ์ผ๊ด€๋œ ์ •๋ณด ๊ณ„์ธต์„ ์œ ์ง€ํ•ฉ๋‹ˆ๋‹ค. ์˜ˆ๋ฅผ ๋“ค์–ด ๊ธ€๊ผด ํฌ๊ธฐ๊ฐ€ ๋งค์šฐ ํฐ ๊ฒฝ์šฐ์—๋„ ๊ธฐ๋ณธ ์š”์†Œ๋ฅผ ํ™”๋ฉด ๋งจ ์œ„๋กœ ์œ ์ง€ํ•˜์—ฌ ์‚ฌ์šฉ์ž๊ฐ€ ์ด๋Ÿฌํ•œ ์š”์†Œ๋ฅผ ์ถ”์ ํ•˜์ง€ ์•Š๋„๋ก ํ•ฉ๋‹ˆ๋‹ค.

     

    Prefer regular or heavy font weights in your app. Consider using Regular, Medium, Semibold, or Bold font weights, because they are easier to see. Avoid Ultralight, Thin, and Light font weights, which can be more difficult to see.

    ์•ฑ์—์„œ ์ผ๋ฐ˜ ๋˜๋Š” ๋ฌด๊ฑฐ์šด ๊ธ€๊ผด ๊ฐ€์ค‘์น˜๋ฅผ ์„ ํ˜ธํ•ฉ๋‹ˆ๋‹ค. ์ผ๋ฐ˜, ์ค‘๊ฐ„, ์„ธ๋ฏธ๋ณผ๋“œ ๋˜๋Š” ๊ตต์€ ๊ธ€๊ผด ๊ฐ€์ค‘์น˜๋ฅผ ์‚ฌ์šฉํ•˜๋Š” ๊ฒƒ์ด ๋” ๋ณด๊ธฐ ์‰ฝ๊ธฐ ๋•Œ๋ฌธ์— ๊ณ ๋ คํ•ด ๋ณด์‹ญ์‹œ์˜ค. ๋ณด๊ธฐ๊ฐ€ ๋” ์–ด๋ ค์šธ ์ˆ˜ ์žˆ๋Š” ์ดˆ๊ฒฝ๋Ÿ‰, ์–‡์€ ๋ฐ ๊ฐ€๋ฒผ์šด ๊ธ€๊ผด ๊ฐ€์ค‘์น˜๋Š” ํ”ผํ•ฉ๋‹ˆ๋‹ค.

     

    Ensure your app responds correctly and looks good when people enable bold text. In iOS, iPadOS, tvOS, and watchOS, people turn on the bold text accessibility setting to make text and symbols easier to see. In response, your app should make all text bolder and give all glyphs an increased stroke weight. The system fonts and SF symbols automatically adjust to the bold text accessibility setting.

    ์‚ฌ๋žŒ๋“ค์ด ๊ตต์€ ํ…์ŠคํŠธ๋ฅผ ์‚ฌ์šฉํ•  ๋•Œ ์•ฑ์ด ์˜ฌ๋ฐ”๋ฅด๊ฒŒ ์‘๋‹ตํ•˜๊ณ  ๋ชจ์–‘์ด ์ข‹์€์ง€ ํ™•์ธํ•˜์‹ญ์‹œ์˜ค. iOS, iPadOS, tvOS, watchOS์—์„œ ์‚ฌ๋žŒ๋“ค์€ ํ…์ŠคํŠธ์™€ ๊ธฐํ˜ธ๋ฅผ ๋” ์‰ฝ๊ฒŒ ๋ณผ ์ˆ˜ ์žˆ๋„๋ก ๊ตต์€ ํ…์ŠคํŠธ ์ ‘๊ทผ์„ฑ ์„ค์ •์„ ์ผ ๋‹ค. ์ด์— ๋Œ€์‘ํ•˜์—ฌ ์•ฑ์€ ๋ชจ๋“  ํ…์ŠคํŠธ๋ฅผ ๋” ๊ตต๊ฒŒ ๋งŒ๋“ค๊ณ  ๋ชจ๋“  ๊ธ€๋ฆฌํ”„์— ์ŠคํŠธ๋กœํฌ ๋ฌด๊ฒŒ๋ฅผ ์ฆ๊ฐ€์‹œ์ผœ์•ผ ํ•œ๋‹ค. ์‹œ์Šคํ…œ ๊ธ€๊ผด๊ณผ SF ๊ธฐํ˜ธ๋Š” ๊ตต์€ ํ…์ŠคํŠธ ์ ‘๊ทผ์„ฑ ์„ค์ •์— ์ž๋™์œผ๋กœ ์กฐ์ •๋ฉ๋‹ˆ๋‹ค.

     

     

    Make sure custom fonts are legible. Custom typefaces can sometimes be difficult to read. Unless your app has a compelling need for a custom font, such as for branding purposes or to create an immersive gaming experience, it’s usually best to use the system fonts. If you do use a custom font, make sure it’s easy to read, even at small sizes.

    ์‚ฌ์šฉ์ž ์ง€์ • ๊ธ€๊ผด์„ ์ฝ์„ ์ˆ˜ ์žˆ๋Š”์ง€ ํ™•์ธํ•ฉ๋‹ˆ๋‹ค. ์‚ฌ์šฉ์ž ์ •์˜ ๊ธ€๊ผด์€ ๋•Œ๋•Œ๋กœ ์ฝ๊ธฐ ์–ด๋ ค์šธ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ๋ธŒ๋žœ๋”ฉ ๋ชฉ์ ์ด๋‚˜ ๋ชฐ์ž…ํ˜• ๊ฒŒ์ž„ ํ™˜๊ฒฝ๊ณผ ๊ฐ™์€ ์‚ฌ์šฉ์ž ์ง€์ • ๊ธ€๊ผด์ด ์•ฑ์— ๊ฐ•์ œ์ ์œผ๋กœ ํ•„์š”ํ•œ ๊ฒฝ์šฐ๊ฐ€ ์•„๋‹ˆ๋ผ๋ฉด ์ผ๋ฐ˜์ ์œผ๋กœ ์‹œ์Šคํ…œ ๊ธ€๊ผด์„ ์‚ฌ์šฉํ•˜๋Š” ๊ฒƒ์ด ๊ฐ€์žฅ ์ข‹์Šต๋‹ˆ๋‹ค. ์‚ฌ์šฉ์ž ์ง€์ • ๊ธ€๊ผด์„ ์‚ฌ์šฉํ•˜๋Š” ๊ฒฝ์šฐ ์ž‘์€ ํฌ๊ธฐ์—์„œ๋„ ์‰ฝ๊ฒŒ ์ฝ์„ ์ˆ˜ ์žˆ๋Š”์ง€ ํ™•์ธํ•˜์‹ญ์‹œ์˜ค.

     

    Avoid full text justification. The whitespace created by fully justified text can create patterns that make it difficult for many people to read and focus on the text. Left justification — or right justification in right-to-left languages — provides a framing reference for people with learning and literacy challenges, such as dyslexia.

    ์ „์ฒด ํ…์ŠคํŠธ ์ •๋‹นํ™”๋ฅผ ํ”ผํ•ฉ๋‹ˆ๋‹ค. ์™„์ „ํžˆ ์ •๋‹นํ™”๋œ ํ…์ŠคํŠธ์— ์˜ํ•ด ๋งŒ๋“ค์–ด์ง„ ๊ณต๋ฐฑ์€ ๋งŽ์€ ์‚ฌ๋žŒ๋“ค์ด ํ…์ŠคํŠธ๋ฅผ ์ฝ๊ณ  ์ง‘์ค‘ํ•˜๊ธฐ ์–ด๋ ต๊ฒŒ ๋งŒ๋“œ๋Š” ํŒจํ„ด์„ ๋งŒ๋“ค ์ˆ˜ ์žˆ๋‹ค. ์™ผ์ชฝ ์ •๋‹นํ™” ๋˜๋Š” ์˜ค๋ฅธ์ชฝ์—์„œ ์™ผ์ชฝ ์–ธ์–ด๋กœ ๋œ ์˜ค๋ฅธ์ชฝ ์ •๋‹นํ™”๋Š” ๋‚œ๋…์ฆ๊ณผ ๊ฐ™์€ ํ•™์Šต ๋ฐ ์ฝ๊ธฐ ๋Šฅ๋ ฅ ๋ฌธ์ œ๊ฐ€ ์žˆ๋Š” ์‚ฌ๋žŒ๋“ค์—๊ฒŒ ํ”„๋ ˆ์ž„ ์ฐธ์กฐ๋ฅผ ์ œ๊ณตํ•œ๋‹ค.

     

    Avoid using italics or all caps for long passages of text. Italics and all caps are great for occasional emphasis, but overuse of these styles makes text hard to read.

    ํ…์ŠคํŠธ์˜ ๊ธด ๊ตฌ์ ˆ์—๋Š” ๊ธฐ์šธ์ž„๊ผด ๋˜๋Š” ๋ชจ๋‘ ๋Œ€๋ฌธ์ž๋ฅผ ์‚ฌ์šฉํ•˜์ง€ ๋งˆ์‹ญ์‹œ์˜ค. ์ดํƒค๋ฆญ์ฒด์™€ ๋ชจ๋“  ๋Œ€๋ฌธ์ž๋Š” ๋•Œ๋•Œ๋กœ ๊ฐ•์กฐํ•  ๋•Œ ์œ ์šฉํ•˜์ง€๋งŒ, ์ด๋Ÿฌํ•œ ์Šคํƒ€์ผ์„ ๊ณผ๋„ํ•˜๊ฒŒ ์‚ฌ์šฉํ•˜๋ฉด ํ…์ŠคํŠธ๋ฅผ ์ฝ๊ธฐ๊ฐ€ ์–ด๋ ต์Šต๋‹ˆ๋‹ค.

     

    Color and effects

    Don’t rely solely on color to differentiate between objects or communicate important information. If you use color to convey information, be sure to provide text labels or glyph shapes to help everyone perceive it.

    ์‚ฌ๋ฌผ์„ ๊ตฌ๋ณ„ํ•˜๊ฑฐ๋‚˜ ์ค‘์š”ํ•œ ์ •๋ณด๋ฅผ ์ „๋‹ฌํ•˜๊ธฐ ์œ„ํ•ด ์ƒ‰์ƒ์—๋งŒ ์˜์กดํ•˜์ง€ ๋งˆ์‹ญ์‹œ์˜ค. ๋งŒ์•ฝ ์—ฌ๋Ÿฌ๋ถ„์ด ์ •๋ณด๋ฅผ ์ „๋‹ฌํ•˜๊ธฐ ์œ„ํ•ด ์ƒ‰์„ ์‚ฌ์šฉํ•œ๋‹ค๋ฉด, ๋ชจ๋“  ์‚ฌ๋žŒ๋“ค์ด ๊ทธ๊ฒƒ์„ ์ธ์‹ํ•  ์ˆ˜ ์žˆ๋„๋ก ํ…์ŠคํŠธ ๋ผ๋ฒจ์ด๋‚˜ ๊ธ€๋ฆฌํ”„ ๋ชจ์–‘์„ ์ œ๊ณตํ•ด์•ผ ํ•ฉ๋‹ˆ๋‹ค.

     

    Prefer system colors for text. When you use system colors in text, it responds correctly to accessibility settings such as Invert Colors and Increase Contrast.

    ํ…์ŠคํŠธ์— ๋Œ€ํ•œ ์‹œ์Šคํ…œ ์ƒ‰์ƒ์„ ์„ ํ˜ธํ•ฉ๋‹ˆ๋‹ค. ํ…์ŠคํŠธ์—์„œ ์‹œ์Šคํ…œ ์ƒ‰์„ ์‚ฌ์šฉํ•˜๋ฉด ์ƒ‰ ๋ฐ˜์ „ ๋ฐ ๋Œ€๋น„ ์ฆ๊ฐ€์™€ ๊ฐ™์€ ์ ‘๊ทผ์„ฑ ์„ค์ •์— ์˜ฌ๋ฐ”๋ฅด๊ฒŒ ์‘๋‹ตํ•ฉ๋‹ˆ๋‹ค.

     

    Avoid using color combinations as the only way to distinguish between two states or values. Many colorblind people find it difficult to distinguish blue from orange; other problematic combinations are red and green, red and black, and either red or green combined with gray. When it makes sense to use a combination of colors to communicate states or values, include additional visual indicators so everyone can perceive the information. For example, instead of using red and green circles to indicate offline and online, you could use a red square and a green circle. Some image-editing software includes tools that can help you proof for colorblindness.

    ๋‘ ์ƒํƒœ ๋˜๋Š” ๊ฐ’์„ ๊ตฌ๋ณ„ํ•˜๋Š” ์œ ์ผํ•œ ๋ฐฉ๋ฒ•์œผ๋กœ ์ƒ‰์ƒ ์กฐํ•ฉ์„ ์‚ฌ์šฉํ•˜์ง€ ์•Š๋„๋ก ํ•ฉ๋‹ˆ๋‹ค. ๋งŽ์€ ์ƒ‰๋งน์ธ ์‚ฌ๋žŒ๋“ค์€ ํŒŒ๋ž€์ƒ‰๊ณผ ์ฃผํ™ฉ์ƒ‰์„ ๊ตฌ๋ณ„ํ•˜๋Š” ๊ฒƒ์„ ์–ด๋ ค์›Œํ•œ๋‹ค; ๋‹ค๋ฅธ ๋ฌธ์ œ๊ฐ€ ๋˜๋Š” ์กฐํ•ฉ์€ ๋นจ๊ฐ•๊ณผ ์ดˆ๋ก, ๋นจ๊ฐ•๊ณผ ๊ฒ€์ •, ๊ทธ๋ฆฌ๊ณ  ๋นจ๊ฐ•๊ณผ ์ดˆ๋ก์ด ํšŒ์ƒ‰๊ณผ ๊ฒฐํ•ฉ๋œ ๊ฒƒ์ž…๋‹ˆ๋‹ค. ์ƒํƒœ๋‚˜ ๊ฐ’์„ ์ „๋‹ฌํ•˜๊ธฐ ์œ„ํ•ด ์ƒ‰์ƒ ์กฐํ•ฉ์„ ์‚ฌ์šฉํ•˜๋Š” ๊ฒƒ์ด ํƒ€๋‹นํ•  ๊ฒฝ์šฐ, ๋ชจ๋“  ์‚ฌ๋žŒ์ด ์ •๋ณด๋ฅผ ์ธ์‹ํ•  ์ˆ˜ ์žˆ๋„๋ก ์ถ”๊ฐ€ ์‹œ๊ฐ์  ํ‘œ์‹œ๊ธฐ๋ฅผ ํฌํ•จํ•ฉ๋‹ˆ๋‹ค. ์˜ˆ๋ฅผ ๋“ค์–ด ๋นจ๊ฐ„์ƒ‰๊ณผ ๋…น์ƒ‰ ์›์„ ์‚ฌ์šฉํ•˜์—ฌ ์˜คํ”„๋ผ์ธ ๋ฐ ์˜จ๋ผ์ธ์„ ํ‘œ์‹œํ•˜๋Š” ๋Œ€์‹  ๋นจ๊ฐ„์ƒ‰ ์‚ฌ๊ฐํ˜•๊ณผ ๋…น์ƒ‰ ์›์„ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ์ผ๋ถ€ ์ด๋ฏธ์ง€ ํŽธ์ง‘ ์†Œํ”„ํŠธ์›จ์–ด์—๋Š” ์ƒ‰๋งน์„ ๋ฐฉ์ง€ํ•˜๋Š” ๋ฐ ๋„์›€์ด ๋˜๋Š” ๋„๊ตฌ๊ฐ€ ํฌํ•จ๋˜์–ด ์žˆ์Šต๋‹ˆ๋‹ค.

    ๐Ÿค” ์žฌ์ค€์ด๋ฅผ ์œ„ํ•œ ๋ฐฐ๋ ค๊ตฐ.. ์žฌ์ค€์•„ ๋‚œ ์˜ค๋Š˜ ๋„ ์œ„ํ•œ ์ปฌ๋Ÿฌ ์„ ํƒ ๋ฐฉ๋ฒ•์„ ๊ณต๋ถ€ํ–ˆ์–ด.. 

     

     

     

                As seen without colorblindness.                                                                  As seen with red-green colorblindness.

     

    Ensure your views respond correctly to Invert Colors. People can turn on Invert Colors when they prefer to view items on a dark background. In the Smart Invert mode of Invert Colors, images, video, and full-color icons (such as app icons and nontemplate images) don’t invert, and dark UI stays dark. Test your app or game to find places where you might need to prevent an image — like a photo in a custom view — from inverting.

    ๋ณด๊ธฐ๊ฐ€ ์ƒ‰์ƒ ๋ฐ˜์ „์— ์˜ฌ๋ฐ”๋ฅด๊ฒŒ ๋ฐ˜์‘ํ•˜๋Š”์ง€ ํ™•์ธํ•ฉ๋‹ˆ๋‹ค. ์–ด๋‘์šด ๋ฐฐ๊ฒฝ์˜ ํ•ญ๋ชฉ์„ ๋ณด๋Š” ๊ฒƒ์„ ์„ ํ˜ธํ•  ๋•Œ ์ƒ‰ ๋ฐ˜์ „์„ ์„ค์ •ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ์ƒ‰์ƒ ๋ฐ˜์ „์˜ ์Šค๋งˆํŠธ ๋ฐ˜์ „ ๋ชจ๋“œ์—์„œ๋Š” ์ด๋ฏธ์ง€, ๋น„๋””์˜ค ๋ฐ ์ „์ฒด ์ƒ‰์ƒ ์•„์ด์ฝ˜(์˜ˆ: ์•ฑ ์•„์ด์ฝ˜ ๋ฐ ํ…œํ”Œ๋ฆฟ์ด ์•„๋‹Œ ์ด๋ฏธ์ง€)์ด ๋ฐ˜์ „๋˜์ง€ ์•Š๊ณ  ์–ด๋‘์šด UI๊ฐ€ ์–ด๋‘ก๊ฒŒ ์œ ์ง€๋ฉ๋‹ˆ๋‹ค. ์•ฑ์ด๋‚˜ ๊ฒŒ์ž„์„ ํ…Œ์ŠคํŠธํ•˜์—ฌ ์‚ฌ์šฉ์ž ์ง€์ • ๋ณด๊ธฐ์˜ ์‚ฌ์ง„๊ณผ ๊ฐ™์ด ์ด๋ฏธ์ง€๊ฐ€ ๋’ค์ง‘ํžˆ์ง€ ์•Š๋„๋ก ํ•ด์•ผ ํ•  ์œ„์น˜๋ฅผ ์ฐพ์Šต๋‹ˆ๋‹ค.

     

    Use strongly contrasting colors to improve readability. Many factors affect the perception of color, including font size and weight, color brightness, screen resolution, and lighting conditions. When you increase color contrast of visual elements like text, glyphs, and controls, you can help more people use your app in more situations. To find out if the contrast of adjacent colors in your UI meets minimum acceptable levels, you can use Xcode’s Accessibility Inspector or an online color calculator based on the Web Content Accessibility Guidelines (WCAG) color contrast formula. In general, smaller or lighter-weight text needs to have greater contrast to be legible. Use the following values for guidance.

    ๊ฐ€๋…์„ฑ์„ ํ–ฅ์ƒ์‹œํ‚ค๋ ค๋ฉด ๊ฐ•ํ•˜๊ฒŒ ๋Œ€๋น„๋˜๋Š” ์ƒ‰์ƒ์„ ์‚ฌ์šฉํ•˜์‹ญ์‹œ์˜ค. ๊ธ€๊ผด ํฌ๊ธฐ์™€ ๋ฌด๊ฒŒ, ์ƒ‰ ๋ฐ๊ธฐ, ํ™”๋ฉด ํ•ด์ƒ๋„ ๋ฐ ์กฐ๋ช… ์กฐ๊ฑด์„ ํฌํ•จํ•˜์—ฌ ๋งŽ์€ ์š”์†Œ๊ฐ€ ์ƒ‰์ƒ ์ธ์‹์— ์˜ํ–ฅ์„ ๋ฏธ์นฉ๋‹ˆ๋‹ค. ํ…์ŠคํŠธ, ๊ธ€๋ฆฌํ”„ ๋ฐ ์ปจํŠธ๋กค๊ณผ ๊ฐ™์€ ์‹œ๊ฐ์  ์š”์†Œ์˜ ์ƒ‰์ƒ ๋Œ€๋น„๋ฅผ ๋Š˜๋ฆฌ๋ฉด ๋” ๋งŽ์€ ์‚ฌ๋žŒ์ด ๋” ๋งŽ์€ ์ƒํ™ฉ์—์„œ ์•ฑ์„ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ๋„๋ก ๋„์™€์ค„ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. UI์˜ ์ธ์ ‘ ์ƒ‰์ƒ ๋Œ€๋น„๊ฐ€ ํ—ˆ์šฉ ๊ฐ€๋Šฅํ•œ ์ตœ์†Œ ์ˆ˜์ค€์„ ์ถฉ์กฑํ•˜๋Š”์ง€ ํ™•์ธํ•˜๋ ค๋ฉด Xcode์˜ ๋‚ด๊ฒŒ ํ•„์š”ํ•œ ์˜ต์…˜ ๊ฒ€์‚ฌ๊ธฐ ๋˜๋Š” WCAG(Web Content Accessibility Guidelines) ์ƒ‰์ƒ ๋Œ€๋น„ ๊ณต์‹์„ ๊ธฐ๋ฐ˜์œผ๋กœ ํ•˜๋Š” ์˜จ๋ผ์ธ ์ƒ‰ ๊ณ„์‚ฐ๊ธฐ๋ฅผ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ์ผ๋ฐ˜์ ์œผ๋กœ ๋” ์ž‘๊ฑฐ๋‚˜ ๊ฐ€๋ฒผ์šด ํ…์ŠคํŠธ๋Š” ์ฝ๊ธฐ ์‰ฝ๋„๋ก ๋Œ€๋น„๊ฐ€ ๋” ์ปค์•ผ ํ•œ๋‹ค. ์ง€์นจ์œผ๋กœ ๋‹ค์Œ ๊ฐ’์„ ์‚ฌ์šฉํ•˜์‹ญ์‹œ์˜ค.

     

    Text sizeText weightMinimum contrast ratio

    Up to 17 points All 4.5:1
    18 points and larger All 3:1
    All Bold 3:1

    Avoid requiring animations unless they’re essential for your experience. In general, let people use your app without relying on any animations.

    ์‚ฌ์šฉ์ž ๊ฒฝํ—˜์— ํ•„์ˆ˜์ ์ธ ์• ๋‹ˆ๋ฉ”์ด์…˜์ด ์•„๋‹Œ ๊ฒฝ์šฐ ์• ๋‹ˆ๋ฉ”์ด์…˜์„ ์š”๊ตฌํ•˜์ง€ ๋งˆ์‹ญ์‹œ์˜ค. ์ผ๋ฐ˜์ ์œผ๋กœ, ์‚ฌ๋žŒ๋“ค์ด ์• ๋‹ˆ๋ฉ”์ด์…˜์— ์˜์กดํ•˜์ง€ ์•Š๊ณ  ๋‹น์‹ ์˜ ์•ฑ์„ ์‚ฌ์šฉํ•˜๋„๋ก ํ•˜์„ธ์š”.

     

    Play tightened animations when Reduce Motion is on. People can turn on Reduce Motion if they tend to get distracted or experience dizziness or nausea when viewing animations that include effects such as zooming, scaling, spinning, or peripheral motion. In response to this setting, you need to turn off or reduce animations that are known to cause problems (to learn more, see Responsive design for motion). If you use a problematic animation to communicate important information, consider designing a non animated alternative or tightening the physics of the animation to reduce its motion.

    ๋ชจ์…˜ ์ถ•์†Œ๊ฐ€ ์ผœ์ ธ ์žˆ์„ ๋•Œ ๊ฐ•ํ™”๋œ ์• ๋‹ˆ๋ฉ”์ด์…˜์„ ์žฌ์ƒํ•ฉ๋‹ˆ๋‹ค. ์คŒ, ์Šค์ผ€์ผ๋ง, ํšŒ์ „ ๋˜๋Š” ์ฃผ๋ณ€ ์›€์ง์ž„๊ณผ ๊ฐ™์€ ํšจ๊ณผ๊ฐ€ ํฌํ•จ๋œ ์• ๋‹ˆ๋ฉ”์ด์…˜์„ ๋ณผ ๋•Œ ์ฃผ์˜๊ฐ€ ์‚ฐ๋งŒํ•ด์ง€๊ฑฐ๋‚˜ ์–ด์ง€๋Ÿฌ์›€ ๋˜๋Š” ๋ฉ”์Šค๊บผ์›€์„ ๊ฒฝํ—˜ํ•˜๋Š” ๊ฒฝํ–ฅ์ด ์žˆ๋Š” ๊ฒฝ์šฐ ๋ชจ์…˜ ์ถ•์†Œ๋ฅผ ์„ค์ •ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ์ด ์„ค์ •์— ๋”ฐ๋ผ ๋ฌธ์ œ๋ฅผ ์ผ์œผํ‚ค๋Š” ๊ฒƒ์œผ๋กœ ์•Œ๋ ค์ง„ ์• ๋‹ˆ๋ฉ”์ด์…˜์„ ๋„๊ฑฐ๋‚˜ ์ค„์—ฌ์•ผ ํ•ฉ๋‹ˆ๋‹ค(์ž์„ธํ•œ ๋‚ด์šฉ์€ ๋ฐ˜์‘ํ˜• ๋””์ž์ธ์˜ ๋ชจ์…˜ ์ฐธ์กฐ). ๋ฌธ์ œ๊ฐ€ ์žˆ๋Š” ์• ๋‹ˆ๋ฉ”์ด์…˜์„ ์‚ฌ์šฉํ•˜์—ฌ ์ค‘์š”ํ•œ ์ •๋ณด๋ฅผ ์ „๋‹ฌํ•˜๋Š” ๊ฒฝ์šฐ ์• ๋‹ˆ๋ฉ”์ด์…˜์ด ์•„๋‹Œ ๋Œ€์•ˆ์„ ์„ค๊ณ„ํ•˜๊ฑฐ๋‚˜ ์• ๋‹ˆ๋ฉ”์ด์…˜์˜ ๋ฌผ๋ฆฌ์ ์ธ ์›€์ง์ž„์„ ์ค„์ด๊ธฐ ์œ„ํ•ด ์• ๋‹ˆ๋ฉ”์ด์…˜์˜ ๋ฌผ๋ฆฌํ•™์„ ์กฐ์ด๋Š” ๊ฒƒ์„ ๊ณ ๋ คํ•˜์‹ญ์‹œ์˜ค. 

    For example:

    • Tighten springs to reduce bounce effects or track 1:1 with the user’s finger ์Šคํ”„๋ง์„ ์กฐ์—ฌ ๋ฐ”์šด์Šค ํšจ๊ณผ๋ฅผ ์ค„์ด๊ฑฐ๋‚˜ ์‚ฌ์šฉ์ž์˜ ์†๊ฐ€๋ฝ์œผ๋กœ 1:1 ํŠธ๋ž™์„ ๋Œ๋ฆฝ๋‹ˆ๋‹ค
    • Avoid animating depth changes in z-axis layers z์ถ• ๋ ˆ์ด์–ด์—์„œ ์• ๋‹ˆ๋ฉ”์ด์…˜ ์‹ฌ๋„ ๋ณ€๊ฒฝ์€ ํ”ผํ•˜์„ธ์š”.
    • Avoid animating into or out of blurs ๋ธ”๋Ÿฌ ์•ˆํŒŽ์œผ๋กœ ์• ๋‹ˆ๋ฉ”์ด์…˜์„ ์ ์šฉํ•˜์ง€ ๋งˆ์‹ญ์‹œ์˜ค.
    • Replace a slide with a fade to avoid motion ์›€์ง์ž„์„ ๋ฐฉ์ง€ํ•˜๊ธฐ ์œ„ํ•ด ์Šฌ๋ผ์ด๋“œ๋ฅผ ํŽ˜์ด๋“œ๋กœ ๋ฐ”๊ฟ‰๋‹ˆ๋‹ค

    Let people control video and other motion effects. Avoid autoplaying video or effects without also providing a button or other way to control them.

    ์‚ฌ๋žŒ๋“ค์ด ๋น„๋””์˜ค ๋ฐ ๊ธฐํƒ€ ๋ชจ์…˜ ํšจ๊ณผ๋ฅผ ์ œ์–ดํ•  ์ˆ˜ ์žˆ๋„๋ก ํ•ฉ๋‹ˆ๋‹ค. ๋น„๋””์˜ค ๋˜๋Š” ํšจ๊ณผ๋ฅผ ์ œ์–ดํ•˜๋Š” ๋ฒ„ํŠผ์ด๋‚˜ ๋‹ค๋ฅธ ๋ฐฉ๋ฒ•์„ ์ œ๊ณตํ•˜์ง€ ์•Š๊ณ  ์ž๋™์œผ๋กœ ์žฌ์ƒํ•˜์ง€ ๋งˆ์‹ญ์‹œ์˜ค.  

     

    Be cautious when displaying moving or blinking elements. Although subtle movement and blinking can draw people’s attention, these effects can also be distracting and they aren’t useful for people with visual disabilities. Worse, some blinking elements can cause epileptic episodes. In all cases, avoid using movement and blinking as the only way to convey information.

    ์›€์ง์ด๊ฑฐ๋‚˜ ๊นœ๋ฐ•์ด๋Š” ์š”์†Œ๋ฅผ ํ‘œ์‹œํ•  ๋•Œ๋Š” ์ฃผ์˜ํ•˜์‹ญ์‹œ์˜ค. ๋ฏธ๋ฌ˜ํ•œ ์›€์ง์ž„๊ณผ ๊นœ๋นก์ž„์€ ์‚ฌ๋žŒ๋“ค์˜ ์ฃผ์˜๋ฅผ ๋Œ ์ˆ˜ ์žˆ์ง€๋งŒ, ์ด๋Ÿฌํ•œ ํšจ๊ณผ๋Š” ๋˜ํ•œ ์ฃผ์˜๋ฅผ ์‚ฐ๋งŒํ•˜๊ฒŒ ํ•  ์ˆ˜ ์žˆ๊ณ  ์‹œ๊ฐ ์žฅ์• ๊ฐ€ ์žˆ๋Š” ์‚ฌ๋žŒ๋“ค์—๊ฒŒ๋Š” ์œ ์šฉํ•˜์ง€ ์•Š์Šต๋‹ˆ๋‹ค. ๋” ์ตœ์•…์œผ๋กœ๋Š”, ์ผ๋ถ€ ๊นœ๋นก์ด๋Š” ์š”์†Œ๋“ค์ด ๊ฐ„์งˆ ๋ฐœ์ž‘์„ ์ผ์œผํ‚ฌ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ๋ชจ๋“  ๊ฒฝ์šฐ์— ์ •๋ณด๋ฅผ ์ „๋‹ฌํ•˜๋Š” ์œ ์ผํ•œ ๋ฐฉ๋ฒ•์œผ๋กœ ์›€์ง์ž„๊ณผ ๊นœ๋ฐ•์ž„์„ ์‚ฌ์šฉํ•˜์ง€ ๋งˆ์‹ญ์‹œ์˜ค. 

     

    Change blurring and transparency when people turn on Reduce Transparency. For example, make areas of blurred content and translucency mostly opaque. For best results, use a color value in the opaque area that’s different from the original color value you used when the area was blurred or translucent.

     ์‚ฌ๋žŒ๋“ค์ด ํˆฌ๋ช…์„ฑ ๊ฐ์†Œ๋ฅผ ์ผค ๋•Œ ํ๋ฆฟํ•จ๊ณผ ํˆฌ๋ช…๋„๋ฅผ ๋ณ€๊ฒฝํ•˜์‹ญ์‹œ์˜ค. ์˜ˆ๋ฅผ ๋“ค์–ด, ํ๋ฆฟํ•œ ๋‚ด์šฉ๊ณผ ๋ฐ˜ํˆฌ๋ช…ํ•œ ๋ถ€๋ถ„์„ ๋Œ€๋ถ€๋ถ„ ๋ถˆํˆฌ๋ช…ํ•˜๊ฒŒ ๋งŒ๋“ญ๋‹ˆ๋‹ค. ์ตœ์ƒ์˜ ๊ฒฐ๊ณผ๋ฅผ ์–ป์œผ๋ ค๋ฉด ์˜์—ญ์ด ํ๋ ค์ง€๊ฑฐ๋‚˜ ๋ฐ˜ํˆฌ๋ช… ํ•  ๋•Œ ์‚ฌ์šฉํ•œ ์›๋ž˜ ์ƒ‰์ƒ ๊ฐ’๊ณผ ๋‹ค๋ฅธ ๋ถˆํˆฌ๋ช… ์˜์—ญ์˜ ์ƒ‰์ƒ ๊ฐ’์„ ์‚ฌ์šฉํ•˜์‹ญ์‹œ์˜ค.

    ๋ฐ˜์‘ํ˜•

    ๋Œ“๊ธ€