Support right-to-left languages like Arabic and Hebrew by reversing your interface as needed to match the reading direction of the related scripts.
필요에 따라 관련 스크립트의 읽기 방향과 일치하도록 인터페이스를 반대로 하여 아랍어 및 히브리어와 같은 오른쪽에서 왼쪽으로 언어를 지원합니다.
When people choose a language for their device — or just your app or game — they expect the interface to adapt in various ways (to learn more, see Localization).
역자 첨언
System-provided UI frameworks support right-to-left (RTL) by default, allowing system-provided UI components to flip automatically in the RTL context. If you use system-provided elements and standard layouts, you might not need to make any changes to your app’s automatically reversed interface.
시스템에서 제공하는 UI 프레임워크는 기본적으로 right-to-left(RTL) 기능을 지원하므로 시스템에서 제공하는 UI 구성 요소가 RTL 컨텍스트에서 자동으로 플립될 수 있습니다. 시스템에서 제공하는 요소와 표준 레이아웃을 사용하는 경우 앱의 자동으로 반대되는 인터페이스를 변경할 필요가 없을 수 있습니다.
→ SwiftUI와 UIKit과 같은 UI framework를 사용하면 자동으로 RTL이 적용됨
If you want to fine-tune your layout or enhance specific localizations to adapt to different currencies, numerals, or mathematical symbols that can occur in various locales in countries that use RTL languages, follow these guidelines.
RTL 언어를 사용하는 국가의 다양한 지역에서 발생할 수 있는 다양한 통화, 숫자 또는 수학 기호에 맞게 레이아웃을 미세 조정하거나 특정 지역화를 향상시키려면 다음 지침들을 따르세요.
역자 첨언
Adjust text alignment to match the interface direction, if the system doesn’t do so automatically. For example, if you left-align text with content in the left-to-right (LTR) context, right-align the text to match the content’s mirrored position in the RTL context.
시스템이 자동으로 정렬하지 않는 경우 인터페이스 방향과 일치하도록 텍스트 정렬을 조정하세요. 예를 들어, 왼쪽에서 오른쪽으로(LTR) 컨텍스트의 내용과 텍스트를 왼쪽으로 정렬한 경우 RTL 컨텍스트의 내용 미러 위치와 일치하도록 텍스트를 오른쪽으로 정렬합니다.
→ LTR과 RTL의 정렬은 거울과 같이 반전되게 정렬됨
Left-aligned text in the LTR context
Right-aligned content in the RTL context
Align a paragraph based on its language, not on the current context. When the alignment of a paragraph — defined as three or more lines of text — doesn’t match its language, it can be difficult to read. For example, right-aligning a paragraph that consists of LTR text can make the beginning of each line difficult to see. To improve readability, continue aligning one- and two-line text blocks to match the reading direction of the current context, but align a paragraph to match its language.
현재 컨텍스트가 아닌 언어에 따라 문단을 정렬하세요. 세 줄 이상의 텍스트로 정의된 문단의 정렬이 해당 언어와 일치하지 않으면 읽기가 어려울 수 있습니다. 예를 들어, LTR 텍스트로 구성된 문단을 오른쪽 정렬하면 각 줄의 시작 부분을 보기가 어려울 수 있습니다. 가독성을 향상시키려면 한 줄 및 두 줄 텍스트 블록을 현재 컨텍스트의 읽기 방향과 일치하도록 정렬하고 문단은 해당 언어와 일치하도록 정렬합니다.
→ 언어에 맞추어 정렬을 해야함, 아랍어와 영어가 혼용된 인터페이스라면, 아랍어는 우측정렬, 영어는 좌측정렬 되어야 함
Use a consistent alignment for all text items in a list. To ensure a comfortable reading and scanning experience, reverse the alignment of all items in a list, including items that are displayed in a different script.
목록의 모든 텍스트 항목에 대해 일관된 정렬을 사용하세요. 편안한 읽기 및 검색 환경을 위해 다른 스크립트로 표시된 항목을 포함하여 목록의 모든 항목을 정렬합니다.
→ List View를 구성할 경우, 일관된 정렬을 사용해야 한다
Different RTL languages can use different number systems. For example, Hebrew text uses Western Arabic numerals, whereas Arabic text might use either Western or Eastern Arabic numerals. The use of Western and Eastern Arabic numerals varies among countries and regions and even among areas within the same country or region.
다른 RTL 언어는 다른 번호 시스템을 사용할 수 있습니다. 예를 들어, 히브리어 텍스트는 서부 아라비아 숫자를 사용하는 반면, 아랍어 텍스트는 서부 또는 동부 아라비아 숫자를 사용할 수 있습니다. 서구 및 동부 아라비아 숫자의 사용은 국가와 지역, 심지어 동일한 국가 또는 지역 내의 지역에 따라 다릅니다.
역자 첨언
If your app focuses on mathematical concepts or other number-centric topics, it’s a good idea to identify the appropriate way to display such information in each locale you support. In contrast, apps that don’t focus on number-related topics can generally rely on system-provided number representations.
앱이 수학적 개념이나 기타 숫자 중심 주제에 중점을 둔다면 지원하는 각 로케일에서 해당 정보를 표시하는 적절한 방법을 찾는 것이 좋습니다. 이와 대조적으로, 번호 관련 주제에 초점을 맞추지 않는 앱은 일반적으로 시스템에서 제공하는 번호 표현에 의존할 수 있습니다.
→ 수학적 개념과 숫자 중심의 앱이 아닌 이상 시스템에서 제공하는 번호 표현을 그대로 사용해라
Western Arabic numerals
Eastern Arabic numerals
Don’t reverse the order of numerals in a specific number. Regardless of the current language or the surrounding content, the digits in a specific number — such as “541,” a phone number, or a credit card number — always appear in the same order.
특정 숫자의 숫자 순서를 거꾸로 하지 마세요. 현재 언어 또는 주변 내용에 관계없이 "541", 전화 번호 또는 신용 카드 번호와 같은 특정 번호의 숫자는 항상 같은 순서로 나타납니다.
→ 숫자 정보의 순서가 중요한 경우에는 순서를 바꾸지 말아라
Reverse the order of numerals that show progress or a counting direction; never flip the numerals themselves. Controls like progress bars, sliders, and rating controls often include numerals to clarify their meaning. If you use numerals in this way, be sure to reverse the order of the numerals to match the direction of the flipped control. Also reverse a sequence of numerals if you use the sequence to communicate a specific order.
진행률 또는 계수 방향을 나타내는 숫자의 순서를 반대로 하여 숫자 자체를 뒤집지 마세요. 진행 표시줄, 슬라이더 및 등급 컨트롤과 같은 컨트롤에는 종종 의미를 명확히 하기 위한 숫자가 포함됩니다. 이러한 방식으로 숫자를 사용하는 경우 숫자의 순서를 뒤집어서 컨트롤 방향과 일치시켜야 합니다. 또한 시퀀스를 사용하여 특정 순서를 전달하는 경우 숫자 시퀀스를 반대로 적용합니다.
→ 숫자의 순서와 진행방향은 일치해야한다.
Flip controls that show progress from one value to another. Because people tend to view forward progress as moving in the same direction as the language they read, it makes sense to flip controls like sliders and progress indicators in the RTL context. When you do this, also be sure to reverse the positions of the accompanying glyphs or images that depict the beginning and ending values of the control.
한 값에서 다른 값으로 진행률을 표시하는 컨트롤은 뒤집어야 합니다. 사람들은 앞으로의 진행을 그들이 읽은 언어와 같은 방향으로 움직이는 것으로 보는 경향이 있기 때문에, RTL 컨텍스트에서 슬라이더와 진행 표시기와 같은 컨트롤을 뒤집는 것이 이치에 맞습니다. 이 작업을 수행할 때는 컨트롤의 시작 값과 종료 값을 나타내는 함께 제공되는 글리프 또는 이미지의 위치도 반대로 해야 합니다.
→ 컨트롤 또한 언어 설정과 일치하는 방향으로 동작해야 한다.
Flip controls that help people navigate or access items in a fixed order. For example, in the RTL context, a back button must point to the right so the flow of screens matches the reading order of the RTL language. Similarly, next or previous buttons that let people access items in an ordered list need to flip in the RTL context to match the reading order.
항목을 고정된 순서로 탐색하거나 액세스하는 데 도움이 되는 컨트롤을 뒤집으세요. 예를 들어, RTL 컨텍스트에서 뒤로 버튼은 화면 흐름이 RTL 언어의 읽기 순서와 일치하도록 오른쪽을 가리켜야 합니다. 마찬가지로, 순서 목록의 항목에 액세스할 수 있는 다음 또는 이전 단추는 읽기 순서와 일치하도록 RTL 컨텍스트에서 플립해야 합니다.
역자 첨언
Preserve the direction of a control that refers to an actual direction or points to an onscreen area. For example, if you provide a control that means “to the right,” it must always point right, regardless of the current context.
실제 방향을 참조하거나 화면 영역을 가리키는 컨트롤의 방향을 유지하세요. 예를 들어 "오른쪽으로"를 의미하는 컨트롤을 제공하는 경우 현재 컨텍스트에 관계없이 항상 오른쪽을 가리켜야 합니다.
→ 오른쪽은 오른쪽이다. 문맥의 흐름이 바뀐다고, 오른쪽이라는 의미가 바뀌지는 않는다.
역자 첨언
Visually balance adjacent Latin and RTL scripts when necessary. In buttons, labels, and titles, Arabic or Hebrew text can appear too small when next to uppercased Latin text, because Arabic and Hebrew don’t include uppercase letters. To visually balance Arabic or Hebrew text with Latin text that uses all capitals, it often works well to increase the RTL font size by about 2 points.
필요한 경우 인접한 라틴어 및 RTL 스크립트의 균형을 시각적으로 조정하세요. 단추, 레이블 및 제목에서 아랍어 또는 히브리어 텍스트는 대문자를 포함하지 않기 때문에 대문자 옆에 있을 때 아랍어 또는 히브리어 텍스트가 너무 작게 나타날 수 있습니다. 아랍어 또는 히브리어 텍스트와 모든 대문자를 사용하는 라틴 텍스트의 시각적 균형을 맞추기 위해 RTL 글꼴 크기를 약 2points 늘리는 것이 잘 작동하는 경우가 많습니다.
→ 대문자가 없는 언어의 경우 2포인트정도 늘려서 사용하면 일관성을 늘릴 수 있음
Avoid flipping images like photographs, illustrations, and general artwork. Flipping an image often changes the image’s meaning; flipping a copyrighted image could be a violation. If an image’s content is strongly connected to reading direction, consider creating a new version of the image instead of flipping the original.
사진, 그림 및 일반 아트워크와 같은 이미지를 뒤집지 않도록 해야 합니다. 이미지를 뒤집으면 이미지의 의미가 변경되는 경우가 많습니다. 저작권이 있는 이미지를 뒤집으면 위반이 될 수 있습니다. 이미지의 내용이 읽기 방향과 강하게 연결된 경우 원본을 뒤집는 대신 이미지의 새 버전을 만드는 것이 좋습니다.
→ 이미지 자체를 반전시킬 필요는 없다.
Reverse the positions of images when their order is meaningful. For example, if you display multiple images in a specific order like chronological, alphabetical, or favorite, reverse their positions to preserve the order’s meaning in the RTL context.
순서가 의미 있는 경우 이미지의 위치를 반대로 변경하세요. 예를 들어, 여러 이미지를 시간순, 알파벳순 또는 즐겨찾기와 같은 특정 순서로 표시하는 경우 해당 위치를 반대로 하여 RTL 컨텍스트에서 순서의 의미를 보존합니다.
→ 이미지의 위치를 문맥에 따라 바꾸는 것은 필요하다
When you use SF Symbols to supply interface icons for your app, you get variants for the RTL context and localized symbols for Arabic and Hebrew, among other languages. If you create custom symbols, you can specify their directionality. For developer guidance, see Creating custom symbol images for your app.
SF 심볼을 사용하여 앱의 인터페이스 아이콘을 제공하면 RTL 컨텍스트에 대한 변형과 아랍어 및 히브리어에 대한 현지화된 심볼을 얻을 수 있습니다. 사용자 정의 기호를 작성하는 경우 방향성을 지정할 수 있습니다. 개발자 지침은 Creating custom symbol images for your app을 참조하세요.
→ SF Symbol은 방향성을 제공한다.
역자 첨언
Flip interface icons that represent text or reading direction. For example, if an interface icon uses left-aligned bars to represent text in the LTR context, right-align the bars in the RTL context.
텍스트 또는 읽기 방향을 나타내는 인터페이스 아이콘을 뒤집으세요. 예를 들어, 인터페이스 아이콘이 왼쪽 정렬 막대를 사용하여 LTR 컨텍스트에서 텍스트를 나타내는 경우, RTL 컨텍스트에서 막대를 오른쪽 정렬합니다.
Consider creating a localized version of an interface icon that displays text. Some interface icons include letters or words to help communicate a script-related concept, like font-size choice or a signature. If you have a custom interface icon that needs to display actual text, consider creating a localized version. For example, SF Symbols offers different versions of the signature, rich-text, and I-beam pointer symbols for use with Latin, Hebrew, and Arabic text, among others.
텍스트를 표시하는 인터페이스 아이콘의 지역화된 버전을 만드는 것이 좋습니다. 일부 인터페이스 아이콘에는 글꼴 크기 선택 또는 서명과 같은 스크립트 관련 개념을 전달하는 데 도움이 되는 문자 또는 단어가 포함되어 있습니다. 실제 텍스트를 표시해야 하는 사용자 지정 인터페이스 아이콘이 있는 경우 현지화된 버전을 만드는 것이 좋습니다. 예를 들어, SF 기호는 라틴어, 히브리어 및 아랍어 텍스트와 함께 사용할 수 있는 다양한 버전의 서명, 리치 텍스트 및 I-빔 포인터 기호를 제공합니다.
→ 아이콘도 현지화 해서 커스터마이징 해라
역자 첨언\
If you have a custom interface icon that uses letters or words to communicate a concept unrelated to reading or writing, consider designing an alternative image that doesn’t use text.
문자나 단어를 사용하여 읽기 또는 쓰기와 관련 없는 개념을 전달하는 사용자 지정 인터페이스 아이콘이 있는 경우 텍스트를 사용하지 않는 대체 이미지를 설계하는 것이 좋습니다.
Flip an interface icon that shows forward or backward motion. When something moves in the same direction that people read, they typically interpret that direction as forward; when something moves in the opposite direction, people tend to interpret the direction as backward. An interface icon that depicts an object moving forward or backward needs to flip in the RTL context to preserve the meaning of the motion. For example, an icon that represents a speaker typically shows sound waves emanating forward from the speaker. In the LTR context, the sound waves come from the left, so in the RTL context, the icon needs to flip to show the waves coming from the right.
앞으로 또는 뒤로 이동을 표시하는 인터페이스 아이콘을 뒤집으세요. 어떤 것이 사람들이 읽는 것과 같은 방향으로 움직일 때, 그들은 일반적으로 그 방향을 전진으로 해석합니다; 어떤 것이 반대 방향으로 움직일 때, 사람들은 그 방향을 후진으로 해석하는 경향이 있습니다. 앞으로 또는 뒤로 이동하는 개체를 나타내는 인터페이스 아이콘은 모션의 의미를 보존하기 위해 RTL 컨텍스트에서 플립해야 합니다. 예를 들어 스피커를 나타내는 아이콘은 일반적으로 스피커에서 전방으로 나오는 음파를 나타냅니다. LTR 컨텍스트에서는 음파가 왼쪽에서 오기 때문에 RTL 컨텍스트에서는 오른쪽에서 오는 파형을 표시하려면 아이콘이 뒤집혀야 합니다. → 문맥과 진행방향은 큰 상관관계가 있다.
Don’t flip logos or universal signs and marks. Displaying a flipped logo confuses people and can have legal repercussions. Always display a logo in its original form, even if it includes text. People expect universal symbols and marks like the checkmark to have a consistent appearance, so avoid flipping them.
로고나 범용 기호 및 표시를 뒤집지 마세요. 뒤집힌 로고를 표시하는 것은 사람들을 혼란스럽게 하고 법적인 영향을 미칠 수 있습니다. 텍스트가 포함된 로고라도 항상 원래 형태로 로고를 표시합니다. 사람들은 체크 표시와 같은 보편적인 기호와 표시가 일관된 모양을 갖기를 기대하므로 뒤집는 것을 피합니다.
In general, avoid flipping interface icons that depict real-world objects. Unless you use the object to indicate directionality, it’s best to avoid flipping an icon that represents a familiar item. For example, clocks work the same everywhere, so a traditional clock interface icon needs to look the same regardless of language direction. Some interface icons might seem to reference language or reading direction because they represent items that are slanted for right-handed use. However, most people are right-handed, so flipping an icon that shows a right-handed tool isn’t necessary and might be confusing.
일반적으로 실제 개체를 묘사하는 인터페이스 아이콘을 뒤집지 마세요. 개체를 사용하여 방향을 표시하지 않는 한 익숙한 항목을 나타내는 아이콘이 뒤집히지 않도록 하는 것이 좋습니다. 예를 들어 시계는 어디서나 동일하게 작동하므로 기존 시계 인터페이스 아이콘은 언어 방향에 관계없이 동일하게 보여야 합니다. 일부 인터페이스 아이콘은 오른쪽으로 기울어진 항목을 나타내기 때문에 언어 또는 읽기 방향을 참조하는 것처럼 보일 수 있습니다. 그러나 대부분의 사람들은 오른손잡이이므로 오른손잡이 도구를 보여주는 아이콘을 뒤집을 필요가 없으며 혼란스러울 수 있습니다.
Before merely flipping a complex custom interface icon, consider its individual components and the overall visual balance. In some cases, a component — like a badge, slash, or magnifying glass — needs to adhere to a visual design language regardless of localization. For example, SF Symbols maintains visual consistency by using the same backslash to represent the prohibition or negation of a symbol’s meaning in both LTR and RTL versions.
복잡한 사용자 지정 인터페이스 아이콘을 뒤집기 전에 개별 구성 요소와 전체 시각적 균형을 고려해야 합니다. 경우에 따라 배지, 슬래시 또는 돋보기와 같은 구성요소는 현지화에 관계없이 시각적 설계 언어를 준수해야 합니다. 예를 들어 SF 심볼은 LTR 및 RTL 버전 모두에서 심볼 의미의 금지 또는 부정을 나타내기 위해 동일한 백슬래시를 사용하여 시각적 일관성을 유지합니다. → 범용 기호와 방향에 따른 인터페이스 아이콘이 혼용된 경우 두 가지 요소를 모두 고려해야함
In other cases, you might need to flip a component (or its position) to ensure the localized version of the icon still makes sense. For example, if a badge represents the actual UI that people see in your app, it needs to flip if your UI flips. Alternatively, if a badge modifies the meaning of an interface icon, consider whether flipping the badge preserves both the modified meaning and the overall visual balance of the icon. In the images shown below, the badge doesn’t depict an object in the UI, but keeping it in the top-right corner visually unbalances the cart.
다른 경우에는 아이콘의 지역화된 버전이 계속 적합한지 확인하기 위해 구성 요소(또는 해당 위치)를 뒤집어야 할 수도 있습니다. 예를 들어 배지가 앱에서 사람들이 보는 실제 UI를 나타내는 경우 UI가 뒤집힐 경우 배지가 뒤집혀야 합니다. 또는 배지가 인터페이스 아이콘의 의미를 수정하는 경우 배지를 뒤집으면 수정된 의미와 아이콘의 전체 시각적 균형이 모두 유지되는지 여부를 고려합니다. 아래 그림에서 배지는 UI의 개체를 나타내지 않지만 오른쪽 상단 모서리에 개체를 유지하면 카트의 균형이 시각적으로 조정되지 않습니다.
→ 복합 아이콘의 경우 의미 전달과 Context에 따른 방향성을 모두 고려해야함.
If your custom interface icon includes a component that can imply handedness, like a tool, consider preserving the orientation of the tool while flipping the base image if necessary.
도구와 같이 사용자 지정 인터페이스 아이콘에 도구와 같이 사용자 지정 인터페이스 아이콘이 포함되어 있는 경우 도구의 방향을 유지하는 동시에 필요한 경우 기본 이미지를 뒤집습니다.
→ 도구가 표현된 경우 도구의 방향을 제외하고 이미지를 뒤집어야 한다. 위의 오른손 잡이와 같음
No additional considerations for iOS, iPadOS, macOS, tvOS, or watchOS.
Change Log
작성 날짜 | 작성자 | 수정사항 |
2023/05/30 | 규니 | 초기 번역 |
2023/12/22 | 규니 | 배포 |