Adobe Muse(어도비 뮤즈) 시작하기 제4부

Adobe Muse(어도비 뮤즈) 시작하기 제4부

웹 페이지에 아코디언 위젯 추가

1. [위젯 라이브러리]를 엽니다. ([창] > [위젯 라이브러리]를 선택하여 이 라이브러리를 열 수 있습니다. 위젯 라이브러리가 이미 열려 있으면 고정된 패널 모음에서 상단 탭을 클릭하여 위젯 라이브러리를 활성화합니다.)

2. [패널]을 클릭하여 패널 위젯의 목록을 확장합니다. 아코디언 위젯을 선택합니다. 아코디언 위젯을 페이지 위로 드래그하여 페이지 컨텐트 영역의 왼쪽 상단에 배치합니다.

3. [선택] 도구로 위젯의 여러 구성 요소를 선택해 보십시오. 전체 위젯을 선택하면 [컨트롤] 패널의 왼쪽 위 가장자리에 있는 선택 표시자에 "위젯"이라는 단어가 표시됩니다. 마우스 단추를 다시 클릭하여 컨테이너, 텍스트 프레임 등을 선택하면 그에 맞춰 선택 표시자에 표시되는 내용이 바뀌는 것을 알 수 있습니다. 이와 같이 선택 표시자를 확인하면 현재 선택한 것이 위젯의 어느 부분인지 쉽게 알 수 있습니다. 위젯의 요소를 선택 취소하려면 Esc 키를 눌러 현재 선택 항목을 한 수준 뒤로 되돌리거나 이 키를 여러 번 눌러 중첩 요소 밖으로 완전히 벗어날 수 있습니다. 또는 페이지에서 위젯 바깥쪽의 다른 부분을 클릭하여 선택을 취소할 수도 있습니다. 

아코디언 위젯에는 기본적으로 패널 두 개가 있습니다. 위쪽 패널에는 "Lorem 1"이라는 자리 표시자 탭 이름이 표시되고, 아래쪽 패널에는 "Ipsum 2"라는 자리 표시자 탭 이름이 표시됩니다.

4. 파란색의 둥근 화살표 아이콘을 클릭하여 [위젯 옵션] 대화 상자를 엽니다. [함께 편집] 옵션이 선택되었는지 확인합니다. 이 옵션을 활성화한 상태에서 아코디언 위젯의 탭 이름 하나를 변경하면 그 변경 내용이 다른 모든 탭에도 함께 적용됩니다.

5. [선택] 도구로 위젯을 한 번 클릭하여 선택한 다음 오른쪽 핸들을 오른쪽 방향으로 드래그하여 위젯의 폭을 확장합니다. 그림 32를 참조하여 두 개의 열이 모두 표시될 정도로 충분히 넓게 확장하십시오.

 

그림 32. 위젯을 선택한 채 오른쪽 핸들을 드래그하여 두 개의 열이 모두 표시될 정도로 위젯을 확장합니다. 

6. 위젯의 아래쪽, 즉 "Ipsum 2" 패널 아래 있는 플러스 기호(+)를 클릭하여 셋째 패널을 추가합니다. 셋째 패널에 "Ipsum 3" 자리 표시자 탭 이름이 표시됩니다.

다음 단원에서는 아코디언 위젯의 패널에 텍스트 컨텐트를 배치하여 패널을 채우는 방법을 살펴볼 것입니다. 여기에서는 아코디언 위젯의 첫째 패널 위에 표시되는 맨 위쪽 탭 이름을 변경하는 방법부터 먼저 살펴보겠습니다.

1. [선택] 도구를 사용하여 현재 "Lorem 1"이라고 표시되어 있는 맨 위쪽 탭의 텍스트 프레임을 선택합니다. "Lorem 1"을 한 번 클릭하여 전체 위젯을 선택하고 맨 위쪽 탭에 상응하는 컨테이너를 확장한 다음 "Lorem 1"이라는 텍스트를 클릭하여 텍스트 프레임을 선택합니다. 텍스트 프레임을 선택하면 선택 표시자에 "텍스트 프레임"이라는 단어가 표시됩니다. 

2. 자리 표시자 텍스트 "Lorem 1"을 두 번 클릭한 다음 이를 편집하여 "THREE SPEED BLEND"라는 새로운 텍스트를 입력합니다.

3. 첫째 탭 아래 있는 좀 더 넓은 면적의 연한 회색 컨테이너를 선택합니다. [텍스트] 도구로 이 연한 회색 컨테이너를 드래그하여 텍스트 프레임을 엽니다. 

4. 새 텍스트 프레임에 "TASTING NOTES"라는 머리글 텍스트를 입력합니다.

웹 글꼴, 웹 안전 글꼴 및 시스템 글꼴 설명

텍스트 컨텐트의 서식을 지정하는 데는 다음 세 가지 글꼴을 적용할 수 있습니다. 

- 웹 글꼴

- 웹 안전 글꼴

- 시스템 글꼴

각 글꼴을 간단히 설명하자면 다음과 같습니다. 

웹 글꼴은 Typekit 웹 사이트에서 호스팅하는 글꼴입니다. Typekit 계정을 따로 설정하지 않더라도 (수백 가지 글꼴 유형이 포함된) 방대한 라이브러리에 액세스하여 원하는 글꼴을 선택한 다음 Muse에서 만드는 페이지에 해당 글꼴을 적용할 수 있습니다. 텍스트 컨텐트에 웹 글꼴을 적용하면 해당 글꼴 모음에 대한 링크를 만드는 코드가 페이지에 자동으로 추가됩니다. 브라우저를 열고 페이지를 방문하면 페이지를 렌더링하는 데 필요한 웹 글꼴이 다운로드된 후 컨텐트가 텍스트로 표시됩니다. 여기에는 여러 가지 장점이 있습니다. 

예를 들어, 머리글이나 기타 중요한 텍스트 컨텐트를 디자인하는 데 여러 가지 다양한 글꼴을 사용할 수 있고, 페이지를 게시하거나 내보내서 렌더링된 텍스트를 방문자가 선택 및 복사할 수 있습니다. 그러나 같은 페이지 내에서 웹 글꼴을 너무 많이 사용하지는 말아야 합니다. 디자인에 이미지를 너무 많이 사용하면 브라우저에서 페이지를 로드하는 속도가 느려지듯이, 페이지에 연결된 파일이 너무 많아도 로드 속도가 느려질 수 있습니다. 한 페이지에 사용되는 웹 글꼴이 세 가지를 넘지 않게 디자인을 제한하고 글꼴 크기를 어느 정도 크게 유지하여 텍스트를 읽기 쉽게 하는 것이 좋습니다. 

웹 안전 글꼴은 사이트를 방문하는 데 사용되는 거의 모든 컴퓨터에 설치되어 있는 글꼴입니다. 이러한 글꼴에는 Arial, Georgia, Times New Roman 등과 같은 표준 글꼴 모음이 포함됩니다. 종류가 다양하지는 않지만 흔히 사용되는 웹 안전 글꼴을 선택하여 라이브 사이트를 텍스트로 렌더링할 수 있습니다. 

웹 안전 글꼴은 로드 속도가 빠르지만 자칫 밋밋한 느낌을 줄 수 있습니다. 웹 안전 글꼴은 길이가 긴 텍스트 컨텐트 단락의 서식을 설정하기에 적합합니다. 웹 안전 글꼴은 웹상에서 가독성을 높이는 데 중점을 두고 최적화되었기 때문입니다. 사이트가 제 기능을 다하고 사이트를 로드하는 데 시간이 오래 걸리지 않도록 하려면 되도록 웹 안전 글꼴을 사용하는 것이 좋습니다. 

시스템 글꼴을 사용하면 디자이너의 컴퓨터에 설치되어 있는 특정 글꼴을 기반으로 좀 더 독특한 타이포그래피를 사용할 수 있습니다. 예를 들어, 정원 가꾸기 같은 특정 주제와 관련된 사이트를 디자인하는 경우 Typekit 웹 글꼴 라이브러리에서는 찾을 수 없는 매우 독특한 꽃 모양 글꼴을 설치할 수 있습니다. 

텍스트에 시스템 글꼴을 이따금씩만 적용한다면 문제 될 것이 없습니다. 그러나 이러한 텍스트 컨텐트는 이미지로 내보내진다는 점을 기억해야 합니다. 즉, 페이지를 로드하는 데 시간이 좀 더 오래 걸리며, 방문자가 페이지에 있는 텍스트를 선택하거나, 복사하거나, 붙여넣을 수 없게 됩니다. 

시스템 글꼴은 머리글 같은 특정 부분의 텍스트에만 사용하는 것이 좋습니다. 사이트를 이용하는 데 불편을 초래하지 않으려면 주소와 전화번호를 비롯하여 방문자가 자신의 일정이나 이메일 메시지에 붙여넣기 위해 복사하려 할 수 있는 컨텐트에는 시스템 글꼴을 사용하지 마십시오. 

일부 방문자는 글꼴 크기가 작으면 텍스트를 읽기 어려워서 글꼴 크기를 확대 설정한 브라우저를 사용할 수도 있습니다. 그러나 시스템 글꼴을 사용하면 텍스트가 이미지 파일로 내보내지므로 글꼴 크기가 확대되지 않는다는 점을 염두에 둬야 합니다. 또 하나 명심해야 할 것은 검색 엔진에서 사이트를 인덱싱하여 검색 결과에 사이트 순위를 매길 때 기준으로 삼는 것이 텍스트 컨텐트라는 점입니다. 이와 같은 여러 가지 이유 때문에 시스템 글꼴은 디자인 효과를 높이기 위해 정말로 필요한 곳에만 적용하는 것이 좋습니다. 웹 글꼴이나 웹 안전 글꼴 중 비슷한 것이 있으면 해당 글꼴을 대신 사용하십시오. 

이러한 세 가지 유형의 각 글꼴을 적용하려면 [텍스트] 도구를 사용하여 텍스트를 선택한 다음 [글꼴] 메뉴에서 원하는 옵션을 선택합니다(그림 33 참조).

 

그림 33. 사용할 글꼴을 [글꼴] 메뉴에서 선택합니다. 

[글꼴] 메뉴의 맨 위쪽에는 최근에 사용한 글꼴의 목록이 표시됩니다. 따라서 페이지를 디자인할 때 한 번 사용한 글꼴을 쉽게 다시 적용할 수 있습니다. 최근 사용한 글꼴이 너무 많아서 오히려 불편하거나 최근 사용한 글꼴을 목록에서 모두 지우고 싶으면 Muse 환경 설정에서 해당 부분을 변경하면 됩니다(그림 34 참조). 

 

그림 34. 최근 사용한 글꼴의 수를 설정하거나 최근 사용한 글꼴의 목록을 [글꼴] 메뉴에서 지웁니다. 

웹 글꼴 추가 및 적용 

웹 글꼴을 사용하여 작업하는 과정은 두 단계로 진행됩니다. 우선, 작업에 사용할 웹 글꼴을 웹 글꼴 라이브러리에서 선택하여 추가합니다. 글꼴이 메뉴 목록에 표시되면 웹 글꼴을 적용할 텍스트를 선택한 다음 [글꼴] 메뉴에서 웹 글꼴의 이름을 선택합니다. 

웹 글꼴을 사용하려면 다음 단계를 따릅니다.

1. [텍스트] 도구를 사용하여 텍스트를 선택한 다음 [글꼴] 메뉴를 엽니다. 

2. [웹 글꼴] > [웹 글꼴 추가]를 선택합니다(그림 35 참조).

 

그림 35. [글꼴] 메뉴에서 웹 글꼴을 추가하는 옵션을 선택합니다. 

Typekit 웹 글꼴 라이브러리가 새 창에 열립니다. 

3. 페이지 위쪽에 나열되어 있는 필터를 클릭하여 원하는 글꼴 스타일을 찾습니다. 이름을 사용하여 글꼴을 검색할 수도 있습니다(그림 36 참조). 

 

그림 36. 이름으로 글꼴을 검색하거나 유형별로 글꼴을 필터링합니다. 

4. 사용할 글꼴을 찾았으면 해당 글꼴을 선택합니다. 추가 대상에 포함된 글꼴에는 확인 표시가 나타납니다. 원한다면 여러 글꼴을 선택하여 한꺼번에 추가할 수도 있습니다. 

참고: 

오른쪽 위에 있는 단추 두 개를 사용하면 머리글에 가장 적합한 글꼴과 본문 단락에 가장 적합한 글꼴을 선별하여 볼 수 있습니다. 머리글 글꼴 모음은 글꼴 주위에 여백이 많아서 길이가 짧은 텍스트 컨텐트에 적합하며 텍스트 크기가 클 때 가장 잘 표현됩니다.

오른쪽 위 가장자리에 있는 확인 표시 단추를 클릭하면 선택한 글꼴의 목록이 표시됩니다. 생각이 바뀌어서 특정 글꼴을 추가하고 싶지 않으면 해당 이름을 다시 클릭하는 것만으로 선택을 간단히 취소할 수 있습니다(그림 37 참조).

 

그림 37. 선택한 웹 글꼴이 Muse 프로젝트에 추가됩니다. 

5. 추가할 글꼴을 모두 선택했으면 [확인]을 클릭합니다. 프로젝트에 글꼴을 추가하고 나면 [글꼴] 메뉴의 웹 글꼴 섹션에 해당 웹 글꼴의 이름이 나열됩니다(그림 38 참조). 

 

그림 38. 적용할 웹 글꼴의 이름을 목록에서 선택합니다. 

최근 사용한 글꼴 적용 및 재설정

Muse에서 텍스트에 글꼴을 적용하고 나면 해당 글꼴의 이름이 [글꼴] 메뉴의 첫째 섹션에 표시됩니다. 이 기능을 활용하면 해당 글꼴을 쉽게 찾을 수 있으므로 사이트 디자인의 다른 텍스트에도 동일한 글꼴을 간편하게 다시 적용할 수 있습니다. 어느 글꼴이 웹 글꼴인지, 웹 안전 글꼴인지, 시스템 글꼴인지 기억할 필요도 없습니다. 세 가지 유형 중 어디에 속하는 글꼴이든 일단 텍스트에 적용한 글꼴은 목록 맨 위에 표시됩니다. 

웹 사이트를 디자인할 때는 한 페이지에 사용되는 글꼴 수를 제한하는 것이 일반적인 관례입니다. 한 페이지에 사용되는 글꼴 수를 4개 이하로 제한하면 방문자가 텍스트 컨텐트를 화면으로 볼 때 그 내용을 좀 더 쉽게 읽을 수 있습니다. 그와 같은 일반적인 관례에 따라 작업을 한다면 [최근 사용한 글꼴] 섹션의 목록에 포함되는 글꼴 이름의 수가 많지 않을 것이므로 원하는 글꼴을 쉽게 찾을 수 있습니다.

그런데 때로는 디자인에 여러 가지 다른 글꼴들을 시험 삼아 사용해 볼 수도 있습니다. 또는 사이트의 각기 다른 섹션 여러 개를 디자인할 수도 있습니다. 이런 경우에는 [글꼴] 메뉴의 [최근 사용한 글꼴] 목록이 매우 길어질 수 있습니다. 목록이 너무 길어지면 원하는 글꼴을 선택하기가 오히려 더 불편합니다. 

이 경우 [최근 사용한 글꼴] 섹션에 나열되는 글꼴 표시 설정을 제어하여 불편함을 해결할 수 있습니다. 다음 단계를 따르십시오. 

1. [Adobe Muse] > [환경 설정]을 선택하여 [환경 설정] 대화 상자를 엽니다. 

2. [유형] 섹션에서 숫자 값을 직접 입력하거나 위쪽 및 아래쪽 화살표를 사용하여 [최근 글꼴 수]를 재설정합니다(그림 39 참조). 

 

그림 39. 최근 사용한 글꼴을 몇 개까지 표시할지 설정합니다. 

[최근 글꼴 지우기] 단추를 클릭하면 최근에 사용한 글꼴이 목록에서 모두 지워집니다.

3. [확인]을 클릭하여 변경 내용을 저장하고 [환경 설정] 대화 상자를 닫습니다.

텍스트 파일에서 가져온 텍스트 컨텐트를 페이지에 배치

이 샘플 프로젝트의 본문에 사용할 텍스트는 Kevins_Koffee_Kart 폴더의 소스 파일에 포함되어 있습니다. 이 텍스트는 TXT 파일로 저장되어 있습니다. Muse에서는 텍스트 파일 자체를 배치하여 페이지에 컨텐트를 추가할 수 있습니다. 텍스트 편집기로 텍스트 파일을 열고 텍스트 줄을 복사한 다음 페이지에 붙여넣는 번거로운 과정을 거치지 않아도 됩니다. 

1. [파일] > [배치]를 선택하거나 바로 가기 키 Command+D(Mac) 또는 Ctrl+D(Windows®)를 사용하여 배치 작업을 시작할 수 있습니다. 이 작업 과정은 페이지에 이미지 파일을 배치할 때와 같습니다. 

2. [가져오기] 대화 상자에서 Kevins_Koffee_Kart 폴더를 찾은 다음 TextThreeSpeed.txt라는 텍스트 파일을 선택합니다. 

3. 아코디언 위젯의 좀 더 넓은 컨테이너, 즉 "TASTING NOTES" 머리글 아래 있는 연한 회색 부분을 클릭하여 맨 위쪽 아코디언 패널에 텍스트 파일의 컨텐트를 배치합니다. 

4. 새 텍스트 프레임을 배치한 후 [선택] 도구를 사용하여 해당 텍스트 프레임의 위치를 "TASTING NOTES" 머리글 아래로 조정하고, 텍스트 프레임의 위쪽, 아래쪽 및 양 옆 핸들을 드래그하여 머리글과 그 아래 텍스트에 맞게 연한 회색 컨테이너를 필요한 만큼 확장합니다. 방금 배치한 텍스트를 클릭한 채 드래그하여 머리글 텍스트의 왼쪽에 맞춰 정렬합니다. 두 항목이 나란히 배치되면 파란색 안내선이 잠시 나타났다 사라지므로 텍스트를 쉽게 정렬할 수 있습니다. 핸들을 드래그하여 텍스트의 크기를 조정할 수 있을 뿐만 아니라, 회색 컨테이너를 클릭한 후 아래쪽 핸들을 드래그하여 컨테이너의 높이를 확장할 수도 있습니다.

5. 연한 회색 컨테이너를 선택한 상태에서 [채우기] 색상 피커를 클릭하고 패널의 배경색을 "채우기 없음"으로 설정합니다(그림 40 참조).

 

그림 40. 맨 위쪽 회색 탭에 텍스트를 추가하고 해당 컨테이너를 컨텐트에 맞춰 확장합니다. 

텍스트 서식 지정 및 단락 스타일 만들기

1. [텍스트] 도구를 사용하여 "THREE SPEED BLEND"를 선택합니다. 텍스트의 서식을 지정하려면 텍스트를 선택한 상태에서 [컨트롤] 패널의 인터페이스를 사용하거나 [텍스트] 패널의 옵션을 사용합니다. 텍스트 옵션을 다음과 같이 설정합니다.

- 글꼴: Franklin Gothic Medium

- 글꼴 크기: 34

- 색상: 흰색

- 행간: 120%

이 탭의 레이블 텍스트를 업데이트하면 그에 맞춰 다른 두 항목의 머리글 스타일도 자동으로 업데이트됩니다. 그 이유는 [함께 편집] 메뉴 옵션을 활성화했기 때문입니다.

2. [단락 스타일] 패널을 엽니다. [단락 스타일] 패널 아래쪽에 있는 [적용한 특성을 이용해 새 스타일 만들기] 아이콘(한쪽 귀퉁이가 접힌 페이지 모양의 아이콘)을 클릭합니다. 이렇게 하면 새 단락 스타일이 생성되고 패널에 "단락 스타일"이라는 이름으로 표시됩니다. "단락 스타일" 이름을 두 번 클릭하여 [스타일 옵션] 대화 상자를 엽니다.

3. [스타일 옵션] 대화 상자에서 새 스타일의 [스타일 이름]을 "Ribbon Large"라고 입력합니다.

4. 첫째 탭의 컨테이너에서 머리글 텍스트 "TASTING NOTES"를 선택합니다. 유형 특성을 다음과 같이 설정합니다.  

- 글꼴: Franklin Gothic Medium

- 글꼴 크기: 15

- 색상: 9AD64B

- 행간: 164%

5. 새 단락 스타일을 만들고 이름을 "Subhead Green"이라고 지정합니다.

6. "TASTING NOTES" 머리글 아래 있는 텍스트 본문을 선택하고 유형 특성을 다음과 같이 설정합니다. 

- 글꼴: Georgia

- 글꼴 크기: 19

- 색상: 6E6161

- 행간: 150%

7. 새 단락 스타일을 만들고 이름을 "Georgia Body Medium"이라고 지정합니다.

 

그림 41. 텍스트 컨텐트에 대해 지정한 서식을 기반으로 사이트의 다른 텍스트에도 적용할 수 있는 단락 스타일을 만듭니다. 

배경 이미지로 상단 탭을 채우도록 아코디언 패널 업데이트

1. 아코디언 위젯에서 "THREE SPEED BLEND"라는 텍스트가 있는 맨 위쪽 탭을 선택합니다. 

2. 파란색의 둥근 화살표 단추를 클릭하여 [옵션] 메뉴를 엽니다. [함께 편집] 옵션의 선택을 취소합니다. [옵션] 메뉴 바깥쪽을 클릭하여 이 메뉴를 닫습니다. 

3. 맨 위쪽 탭을 두 번 클릭하여 선택 표시자에 "텍스트 프레임"이라는 단어가 표시되게 합니다. 맨 위쪽 탭의 텍스트 프레임을 선택한 상태에서 [컨트롤] 패널의 [채우기] 링크를 클릭하여 [채우기] 메뉴를 엽니다. 색상 피커를 클릭하고 배경 채우기 색상을 기본값은 짙은 회색 대신 "없음"으로 설정합니다. 

4. [이미지] 섹션에 있는 폴더 아이콘을 클릭하여 [가져오기] 대화 상자를 엽니다. Kevins_Koffee_Kart 폴더를 찾은 다음 Acc-Green.png라는 이미지를 선택합니다. 

5. [간격] 패널을 엽니다. [안쪽 여백] 섹션에서 [L:](왼쪽) 옆에 있는 위쪽 화살표를 계속 눌러 이 탭의 리본 배경 이미지 중앙에 텍스트가 배치되도록 "THREE SPEED BLEND" 앞의 간격을 넓힙니다. 숫자 값이 약 70이면 적당합니다(그림 42 참조). 

 

그림 42. 녹색 리본 배경 이미지 채우기를 설정한 다음, [간격] 패널로 좌측 안쪽 여백 값을 늘려 "THREE SPEED BLEND" 텍스트를 가운데 정렬합니다. 

이렇게 해서 아코디언 위젯의 첫째 탭이 완성되었습니다. 녹색 리본 배경 이미지 채우기를 추가할 때 [함께 편집] 설정을 선택 취소했으므로 "CRUISER ESPRESSO" 및 "MORNING COMMUTE" 탭에는 이 배경 이미지 채우기가 표시되지 않습니다. 

다음 단계에 따라 텍스트의 스타일 지정을 마치고 나머지 배경 채우기 이미지를 추가합니다. 

1. "CRUISER ESPRESSO" 탭을 두 번 클릭합니다. 처음에는 위젯이 선택되고, 한 번 더 클릭하면 둘째 탭의 텍스트 프레임이 선택됩니다. 

2. [채우기] 메뉴를 사용하여 채우기 색상을 "없음"으로 설정합니다. [이미지] 섹션 옆에 있는 폴더 아이콘을 클릭하고 배경 이미지를 Kevins_Koffee_Kart 폴더에 있는 Acc-Blue.png라는 파일로 설정합니다. 

3. 둘째 컨테이너에서 "TASTING NOTES" 텍스트 프레임을 선택합니다. [단락 스타일] 패널에서 "Subhead Green"이라는 단락 스타일을 클릭합니다. 

4. 둘째 컨테이너에서 "TASTING NOTES" 텍스트 프레임 아래 배치된 텍스트 컨텐트를 선택합니다. [단락 스타일] 패널에서 "Georgia Body Medium"이라는 단락 스타일을 클릭합니다. 

그런 다음 이번에는 셋째 아코디언 탭의 서식과 배경 이미지 채우기를 마무리합니다.

1. "MORNING COMMUTE" 탭을 두 번 클릭합니다. 처음에는 위젯이 선택되고, 한 번 더 클릭하면 셋째 탭의 텍스트 프레임이 선택됩니다. 

2. [채우기] 메뉴를 사용하여 채우기 색상을 "없음"으로 설정합니다. [이미지] 섹션 옆에 있는 폴더 아이콘을 클릭하고 배경 이미지를 Kevins_Koffee_Kart 폴더에 있는 Acc-Yellow.png라는 파일로 설정합니다.

3. 셋째 컨테이너에서 "TASTING NOTES" 텍스트 프레임을 선택합니다. [단락 스타일] 패널에서 "Subhead Green"이라는 단락 스타일을 클릭합니다. 

4. 셋째 컨테이너에서 "TASTING NOTES" 텍스트 프레임 아래 배치된 텍스트 컨텐트를 선택합니다. [단락 스타일] 패널에서 "Georgia Body Medium"이라는 단락 스타일을 클릭합니다(그림 43 참조). 

 

그림 43. 각 탭에 대해 서로 다른 배경 채우기 이미지를 설정한 후에 표시되는 아코디언 위젯입니다. 

계속하여 Adobe Muse 시작하기, 제 5부에서는 Photoshop 파일을 롤오버 단추로 배치하는 방법을 살펴보겠습니다.

Adobe Muse(어도비 뮤즈) 시작하기 제4부

웹 페이지에 아코디언 위젯 추가

이 내용은 ADOBE 홈페이지  어도비 뮤즈<adobe muse> 도움말을 가지고 왔습니다.