

기계 번역으로 제공되는 번역입니다. 제공된 번역과 원본 영어의 내용이 상충하는 경우에는 영어 버전이 우선합니다.

# Amazon WorkSpaces Secure Browser의 브랜딩 사용자 지정
<a name="branding-customization"></a>

시각적 요소, 텍스트 콘텐츠 및 서비스 약관을 수정하여 최종 사용자에게 표시되는 로그인 및 로드 화면을 사용자 지정할 수 있습니다. 브랜딩 사용자 지정은 조직의 자격 증명에 맞는 일관된 경험을 만드는 데 도움이 됩니다.

**개요**

브랜딩 사용자 지정을 사용하면 사용자 경험의 다음 측면을 개인화할 수 있습니다.
+ **시각적 요소** - 로고, 파비콘 및 월페이퍼를 업로드하고 브랜드 아이덴티티와 일치하는 색상 테마를 선택합니다.
+ **텍스트 콘텐츠** - 로그인 흐름 전체에서 브랜드 음성을 유지하도록 환영 메시지, 브라우저 탭 제목 및 기타 선택적 텍스트 필드를 사용자 지정합니다. 특정 필드에 사용자 지정 텍스트를 지정하지 않으면 기본 텍스트가 사용됩니다. 자세한 내용은 [사용자 지정 지침](customization-guideline.md)을 참조하세요.
+ **서비스 약관(선택 사항)** - 사용자가 세션을 시작하기 전에 승인해야 하는 조직의 서비스 약관을 추가합니다.

**참고**  
포털의 도메인 이름을 사용자 지정할 수도 있습니다. 자세한 내용은 [포털에 대한 사용자 지정 도메인 구성](custom-domains.md)을 참조하세요.

**Topics**
+ [포털에 대한 브랜딩 사용자 지정 구성](configure-branding-customization.md)
+ [사용자 지정 지침](customization-guideline.md)

# 포털에 대한 브랜딩 사용자 지정 구성
<a name="configure-branding-customization"></a>

## 작동 방식
<a name="branding-how-it-works"></a>

브랜딩 사용자 지정을 구성하는 경우:
+ 시각적 요소와 텍스트 요소는 로그인 화면과 로드 화면 모두에 적용됩니다.
+ 브라우저 탭에는 사용자 지정 파비콘과 제목이 표시됩니다.
+ 최종 사용자는 새 세션을 시작할 때 사용자 지정 변경 사항을 볼 수 있습니다. 경우에 따라 변경 사항이 표시되기까지 몇 분 정도 걸릴 수 있습니다.
+ 서비스 약관이 구성된 경우 최종 사용자는 스트리밍 세션을 시작하기 전에 서비스 약관에 동의해야 합니다. 모든 세션이 시작될 때 질문을 받게 됩니다.

## 사전 조건
<a name="branding-prerequisites"></a>

시작하기 전:
+ 포털 설정을 수정하는 데 필요한 권한이 있는지 확인합니다. 섹션을 참조하세요[AWS WorkSpaces Secure Browser에 대한 관리형 정책](security-iam-awsmanpol.md).
+ 의 사양에 따라 브랜딩 자산(로고, 파비콘, 월페이퍼)을 준비합니다[사용자 지정 지침](customization-guideline.md).

## 시작하기
<a name="branding-getting-started"></a>

브랜딩 사용자 지정을 구성하려면 다음 단계를 따르세요.

1. WorkSpaces Secure Browser 콘솔([https://console.aws.amazon.com/workspaces-web/home?region=us-east-1#/](https://console.aws.amazon.com/workspaces-web/home?region=us-east-1#/))을 엽니다.

1. **WorkSpaces Secure Browser**, **웹 포털**을 차례로 선택하고 웹 포털을 선택합니다.

1. 포털을 선택하고 **사용자 설정** 탭을 선택합니다.

1. **브랜딩 사용자 지정** 섹션에서 **편집**을 선택합니다.

1. 필요에 따라 다음 섹션을 구성합니다.
   + **콘텐츠 편집기** - 모든 시각적 요소(회사 로고, 파비콘 및 선택적 월페이퍼)를 업로드하고 색상 테마를 선택합니다. 로컬 컴퓨터 또는 S3 버킷에서 파일을 업로드할 수 있습니다. S3 버킷 권한 설정에 대한 자세한 내용은 섹션을 참조하세요[S3 버킷 권한 설정](#branding-s3-permissions).
   + **텍스트 편집기** - 로그인 화면에 나타나는 텍스트 사용자 지정.
   + **서비스 약관 편집기** - 선택적으로 사용자가 승인해야 하는 용어를 추가합니다.

1. **변경 사항 저장**을 선택합니다.

각 사용자 지정 옵션에 대한 자세한 지침은 섹션을 참조하세요[사용자 지정 지침](customization-guideline.md).

## S3 버킷 권한 설정
<a name="branding-s3-permissions"></a>

컴퓨터에서 직접 브랜딩 파일을 업로드하거나 S3 버킷에서 기존 객체를 선택할 수 있습니다. S3 버킷에서 시각적 요소(회사 로고, 파비콘 및 월페이퍼)에 대한 파일을 업로드하도록 선택한 경우 S3 버킷에 대한 적절한 권한을 설정해야 합니다.

**동일한 계정에서 S3 객체 선택**

IAM 사용자 또는 역할에 브랜딩 자산이 포함된 버킷에 대한 `s3:GetObject` 권한이 이미 있는 경우 추가 구성이 필요하지 않습니다.

**다른 계정에서 S3 객체 선택**

다른 AWS 계정에서 S3 버킷을 선택하려면 소스 계정의 버킷 정책과 관리자 계정의 IAM 정책을 모두 구성해야 합니다.

**버킷 정책 예제(소스 계정에서):**

소스 계정의 S3 버킷에이 정책을 적용합니다. *123456789012*을 관리자 계정 ID로 바꾸고 *source-account-bucket-name*을 실제 버킷 이름으로 바꿉니다.

```
{
  "Version": "2012-10-17",		 	 	 
  "Statement": [
    {
      "Sid": "AllowCrossAccountAccess",
      "Effect": "Allow",
      "Principal": {
        "AWS": "arn:aws:iam::123456789012:root"
      },
      "Action": [
        "s3:GetObject"
      ],
      "Resource": [
        "arn:aws:s3:::source-account-bucket-name",
        "arn:aws:s3:::source-account-bucket-name/*"
      ]
    }
  ]
}
```

**IAM 정책 예제(관리자 계정):**

관리자 계정의 IAM 사용자 또는 역할에이 정책을 연결합니다. *source-account-bucket-name*을 소스 계정의 실제 버킷 이름으로 바꿉니다.

```
{
  "Version": "2012-10-17",		 	 	 
  "Statement": [
    {
      "Sid": "AllowCrossAccountS3Access",
      "Effect": "Allow",
      "Action": [
        "s3:GetObject"
      ],
      "Resource": [
        "arn:aws:s3:::source-account-bucket-name",
        "arn:aws:s3:::source-account-bucket-name/*"
      ]
    }
  ]
}
```

교차 계정 액세스에 대한 자세한 내용은 [S3 Access Grants 교차 계정 액세스를](https://docs.aws.amazon.com/AmazonS3/latest/userguide/access-grants-cross-accounts.html) 참조하세요.

# 사용자 지정 지침
<a name="customization-guideline"></a>

로그인 및 로드 페이지에서 브랜딩 요소와 텍스트를 업데이트하여 최종 사용자의 로그인 및 로드 환경을 사용자 지정합니다. 로고 및 월페이퍼와 같은 시각적 요소를 수정하고, 환영 메시지 및 헤더와 같은 텍스트 요소를 편집하고, 선택적으로 사용자가 세션을 시작하기 전에 수락해야 하는 서비스 약관 계약을 구성할 수 있습니다.

![\[alt text not found\]](http://docs.aws.amazon.com/ko_kr/workspaces-web/latest/adminguide/images/branding/customization-main.png)

## 콘텐츠 편집기
<a name="branding-content-editor"></a>

### 회사 로고
<a name="branding-company-logo"></a>

로고는 로그인 화면과 로딩 화면에 표시되어 사용자 경험 전반에서 일관된 브랜딩을 제공합니다.

![\[alt text not found\]](http://docs.aws.amazon.com/ko_kr/workspaces-web/latest/adminguide/images/branding/logo.png)
+ 지원되는 형식: JPG, ICO 또는 PNG
+ 최대 파일 크기: 100KB

**수행**

![\[alt text not found\]](http://docs.aws.amazon.com/ko_kr/workspaces-web/latest/adminguide/images/branding/logo-do.png)
+ 로고 변형이 다른 경우(예: 다른 색상 또는 스타일) 선택한 월페이퍼 배경과 가장 잘 대비되는 것을 선택합니다.

**하지 말 것**

![\[alt text not found\]](http://docs.aws.amazon.com/ko_kr/workspaces-web/latest/adminguide/images/branding/logo-dont.png)
+ 로고 크기를 조정할 때 종횡비를 무시하지 마세요.
+ 로고 크기가 올바르게 지정되지 않은 로고는 왜곡된 것처럼 보일 수 있으므로 사용하지 마세요.

### 파비콘
<a name="branding-favicon"></a>

파비콘은 브라우저 탭에 나타나는 작은 아이콘으로, 사용자가 여러 열린 탭에서 애플리케이션을 식별할 수 있도록 도와줍니다.

![\[alt text not found\]](http://docs.aws.amazon.com/ko_kr/workspaces-web/latest/adminguide/images/branding/favicon.png)
+ 지원되는 형식: JPG, ICO 또는 PNG
+ 최대 파일 크기: 100KB
+ 권장 가로 세로 비율: 1:1

### 월페이퍼 - 선택 사항
<a name="branding-wallpaper"></a>

월페이퍼는 모든 화면의 배경 이미지로 사용되어 통일된 시각적 경험을 제공합니다. 사용자 지정 월페이퍼를 업로드하지 않으면 아래 표시된 기본 월페이퍼가 사용됩니다. 콘텐츠 가독성을 방해하지 않으면서 브랜딩을 보완하는 이미지를 선택하세요.

![\[alt text not found\]](http://docs.aws.amazon.com/ko_kr/workspaces-web/latest/adminguide/images/branding/wallpaper.png)
+ 지원되는 형식: JPG 또는 PNG
+ 최대 파일 크기: 5MB
+ 권장 가로 세로 비율: 16:9
+ 권장 최소 해상도: 1920 x 1080

**수행**

![\[alt text not found\]](http://docs.aws.amazon.com/ko_kr/workspaces-web/latest/adminguide/images/branding/wallpaper-do.png)
+ 전경 콘텐츠를 방해하지 않는 미세하고 대비가 낮은 배경화면 또는 흐린 이미지를 사용합니다.
+ 텍스트 뒤의 바쁜 영역을 방지하려면 사전 설정된 텍스트 배치를 고려하세요.
+ 브랜드 색상을 활용하고 오버레이를 사용하여 대비와 가독성을 높입니다.

**하지 말 것**

![\[alt text not found\]](http://docs.aws.amazon.com/ko_kr/workspaces-web/latest/adminguide/images/branding/wallpaper-dont.png)
+ 중요한 텍스트 바로 뒤에 사용 중이거나 포화되었거나 세부 정보가 많은 이미지를 사용하지 마세요.
+ 시각적으로 복잡한 이미지 또는 사전 설정된 텍스트 위치에 가독성 제한이 발생하는 급격한 전환이 있는 이미지를 사용하지 마세요.
+ 충분한 대비 없이 배경에서 텍스트를 분리하기 위해 색상에만 의존하지 마세요.

### 색상 테마
<a name="branding-color-theme"></a>

글꼴, 버튼 및 모달을 반영하는 밝거나 어두운 테마 중에서 선택합니다.
+ 라이트 테마 - 어두운 배경에 적합하며, 저조도 환경에서 작업할 때 선명한 대비를 제공하고 눈의 피로를 줄입니다.
+ 다크 테마 - 밝은 배경에 최적화되어, 주변이 밝을 때 눈부심을 줄이고 편안하게 볼 수 있도록 합니다.

**수행**

![\[alt text not found\]](http://docs.aws.amazon.com/ko_kr/workspaces-web/latest/adminguide/images/branding/theme-do.png)
+ 배경 요소/벽지와 강력한 대조를 이룹니다.
+ 밝은 배경에서 어두운 색상 테마를 사용합니다.
+ 어두운 배경에서 밝은 색상 테마를 사용합니다.

**하지 말 것**

![\[alt text not found\]](http://docs.aws.amazon.com/ko_kr/workspaces-web/latest/adminguide/images/branding/theme-dont.png)
+ 이미지나 복잡한 배경화면 위에 밝거나 어두운 글꼴을 배치하지 마세요.

## 텍스트 편집기
<a name="branding-text-editor"></a>

텍스트 편집기를 사용하여 최종 사용자의 로그인 화면에 표시되는 텍스트를 사용자 지정할 수 있습니다. 브랜딩 사용자 지정을 활성화하려면 하나 이상의 언어를 추가해야 합니다.

**새 사용자의 경우:** 브라우저 언어 기본 설정이 감지되며 브랜딩 언어로 구성된 경우 해당 언어로 포털 페이지가 표시됩니다. 브라우저 언어가 구성된 언어가 아니라면 사용 가능한 경우 영어(en-US)로 기본 설정됩니다. 영어를 구성하지 않은 경우 구성된 언어에서 알파벳순으로 첫 번째 언어가 사용됩니다.

**재방문 사용자:** 이전 세션의 언어 기본 설정이 브라우저 쿠키에 저장됩니다. 해당 언어가 구성된 브랜딩 언어인 경우 해당 언어가 사용됩니다. 그렇지 않으면 동일한 대체 로직을 따라 사용 가능한 경우 영어(en-US), 아니면 알파벳순으로 구성된 첫 번째 언어가 사용됩니다.

다음 로캘(언어 코드)이 지원됩니다.
+ 독일어(de-DE)
+ 영어(en-US)
+ 스페인어(es-ES)
+ 프랑스어(fr-FR)
+ 인도네시아어(id-ID)
+ 이탈리아어(it-IT)
+ 일본어(ja-JP)
+ 한국어(ko-KR)
+ 포르투갈어(pt-BR)
+ 중국어 간체(zh-CN)
+ 중국어 번체(zh-TW)

보안상의 이유로 모든 텍스트 필드에서 다음 문자가 차단됩니다.
+ 미만
+ >(초과)
+ &(앰퍼샌드)
+ '(곧은 아포스트로피)
+ `(백틱/그레이브 악센트)
+ \$1 (물결표)
+ \$1(백슬래시)

### 브라우저 탭 제목
<a name="branding-browser-tab-title"></a>

브라우저 탭에 표시되는 텍스트입니다. 최대 25자입니다.

![\[alt text not found\]](http://docs.aws.amazon.com/ko_kr/workspaces-web/latest/adminguide/images/branding/browser-tab.png)

**권장 사항**

여러 탭이 열려 있더라도 읽을 수 있도록 짧고 명확한 제목을 사용하는 것이 좋습니다.

### 환영 설명
<a name="branding-welcome-description"></a>

로그인 화면에서 회사 로고와 함께 표시되는 간략한 설명입니다. 최대 150자입니다.

![\[alt text not found\]](http://docs.aws.amazon.com/ko_kr/workspaces-web/latest/adminguide/images/branding/welcome.png)

**권장 사항**

가독성을 높이기 위해 텍스트를 간결하게 유지합니다. 더 긴 텍스트는 자동으로 더 작은 글꼴 크기로 조정되는 반면, 더 짧은 메시지는 더 두드러지게 표시됩니다.

### 연락처 섹션
<a name="branding-contact-section"></a>

**문의 버튼 - 선택 사항**

로그인 화면의 문의 버튼 텍스트입니다. 비워 두면 “문의하기”가 표시됩니다. 최대 30자입니다.

**문의 링크 - 선택 사항**

로그인 화면의 문의 버튼 링크입니다. 다음을 사용할 수 있습니다.
+ 사용자를 웹 페이지로 안내하는 HTTPS URL
+ mailto: 사용자의 이메일 클라이언트를 여는 링크

비워 두면 문의 버튼이 화면에서 숨겨집니다.

![\[alt text not found\]](http://docs.aws.amazon.com/ko_kr/workspaces-web/latest/adminguide/images/branding/contact-link.png)

**권장 사항**

텍스트를 짧게, 이상적으로는 2\$13단어로 유지합니다.

### 로그인 섹션
<a name="branding-sign-in-section"></a>

**로그인 헤더 - 선택 사항**

로그인 페이지의 로그인 섹션에 대한 헤더입니다. 비워 두면 "로그인"이 표시됩니다. 최대 100자입니다.

**로그인 설명 - 선택 사항**

로그인 섹션에 대한 설명 텍스트입니다. 비워 두면 "WorkSpaces Secure Browser 세션에 로그인하세요"가 표시됩니다. 최대 250자.

**로그인 버튼 - 선택 사항**

로그인 버튼에 표시되는 텍스트입니다. 비워 두면 "로그인"이 표시됩니다. 최대 30자입니다.

![\[alt text not found\]](http://docs.aws.amazon.com/ko_kr/workspaces-web/latest/adminguide/images/branding/sign-in.png)

**권장 사항**
+ 텍스트를 짧게 유지합니다.
+ 로그인 버튼을 누르면 사용자가 포털에 대해 구성된 자격 증명 공급자로 이동합니다. 특정 자격 증명 공급자를 반영하도록 버튼 텍스트를 사용자 지정할 수 있습니다.

### 설명 로드
<a name="branding-loading-description"></a>

연결 중 로딩 화면에 표시되는 텍스트입니다. 비워 두면 "연결 중..."이 표시됩니다. 최대 300자.

![\[alt text not found\]](http://docs.aws.amazon.com/ko_kr/workspaces-web/latest/adminguide/images/branding/loading.png)

**권장 사항**

이 메시지는 세션이 로드되는 동안에만 표시되므로 최종 사용자가 읽을 시간이 없을 수 있습니다. 너무 길게 만들지 않도록 하세요.

## 서비스 약관 - 선택 사항
<a name="branding-terms-of-service"></a>

최종 사용자가 스트리밍 세션을 시작하기 전에 검토하고 수락해야 하는 서비스 약관을 사용자 지정할 수 있습니다. 이 콘텐츠는 마크다운 파일을 업로드하거나 내장 마크다운 편집기를 사용하여 추가할 수 있습니다.

성공적으로 로그인하면 사용자에게 서비스 약관이 표시됩니다. 사용자는 문서 전체를 스크롤하고 "수락" 버튼을 클릭해야 Secure Browser 세션으로 이동할 수 있습니다. 사용자가 "거절"을 클릭하면 로그인 페이지로 다시 리디렉션됩니다.

참고로 이는 선택적 설정입니다. 서비스 약관을 추가하지 않으면 사용자가 로그인한 후 세션으로 바로 이동하게 됩니다.

**지원되는 형식:**
+ 기본 텍스트 스타일(굵게, 기울임꼴)
+ 제목
+ 순서가 지정된 목록과 순서가 지정되지 않은 목록
+ 인용구
+ 가로선
+ 간단한 단락 및 줄 바꿈

**보안을 위해 다음 요소가 차단됩니다.**
+ 스크립트 및 코드 실행
+ 양식 및 iframe과 같은 대화형 요소
+ 안전하지 않은 프로토콜 및 파일 경로
+ HTML 속성 및 스타일
+ 외부 링크 및 테이블

서비스 약관 파일은 크기가 150KB를 초과해서는 안 됩니다.