Adobe Muse(어도비 뮤즈) 시작하기 제6부
임베디드 HTML을 사용하여 웹 페이지에 Google 지도 삽입
이번 단원에서는 Google 지도를 통해 생성된 지도를 로드하는 임베디드 HTML을 삽입하여 "KART MAP" 페이지에 컨텐트를 추가해 보겠습니다. 이는 사이트에 임베디드 HTML을 사용할 수 있는 여러 가지 방법 중 또 하나의 작은 예일 뿐입니다. YouTube, Flickr, Picasa 등 기타 수많은 타사 사이트로부터 가져온 컨텐트를 통합할 수 있을 뿐만 아니라, 해당 사이트에서 자신의 계정으로 액세스하고 컨텐트를 게시하여 관리하는 여러 가지 양식, 블로그 및 기타 복잡한 사이트 기능을 추가할 수 있습니다.
1. 새 브라우저 창을 열고 maps.google.com을 방문합니다.
2. 지도를 만드는 데 사용할 실제 주소를 찾기 위해 주소를 입력하거나 "Adobe SF" 같은 검색어를 입력합니다.
3. 인터페이스 오른쪽 윗부분에 [링크] 단추가 나타나면 이를 클릭하여 [이메일 또는 메신저에 링크 붙여넣기] 옵션을 표시합니다.
4. [삽입할 지도 맞춤설정 및 미리보기]를 클릭하여 [사용자 설정] 창을 열고 지도 크기를 폭 850, 높이 470으로 설정합니다. 창에 표시된 지도의 위치를 조정하여 주소 텍스트가 완전히 보이게 합니다.
5. Google 창에서 HTML 코드를 복사합니다. 이 실습을 진행하면서 Google 지도 코드를 직접 생성하고 싶지 않으면 아래 나와 있는 소스 코드를 복사해도 됩니다.
<!-- Google Public Location Badge -->
<iframe src="http://www.google.com/latitude/apps/badge/api?user=3988005937557250144&type=iframe&maptype=roadmap" width="872
" height="600" frameborder="0"></iframe>
<!-- To disable location sharing, you *must* visit https://www.google.com/latitude/apps/badge and disable the Google Public Location badge. Removing this code snippet is not enough! -->
그림 58. Google 지도 창에서 HTML 소스 코드를 복사합니다.
6. Muse로 돌아갑니다. 페이지를 마우스 오른쪽 단추로 클릭하고 [붙여넣기]를 선택하여 코드를 배치합니다. [개체] > [HTML 삽입]을 선택하여 [HTML 코드] 창을 열거나 표준 바로 가기 키(Mac의 경우 Command+V, Windows의 경우 Ctrl+V)를 사용하여 코드를 붙여넣을 수도 있습니다.
7. [선택] 도구를 사용하여 지도를 페이지 왼쪽에 배치합니다.
8. [미리 보기]를 클릭하여 Google 지도가 라이브 사이트에서 방문자에게 어떻게 표시되는지 확인합니다. 지도의 탐색 단추를 클릭하여 기능이 완벽하게 작동하는지 확인하고, 포함된 창 내에서 지도를 확대/축소하거나 이동할 수 있는지 확인합니다.
사이트에 iframe을 추가하여 다른 사이트 페이지를 임베디드 HTML로 표시
임베디드 HTML을 사용하여 타사 웹 사이트에서 가져온 코드를 삽입할 수 있을 뿐만 아니라, 동일한 방법을 사용하여 iframe 내에 전체 웹 페이지를 포함할 수도 있습니다. 예를 들어, 다음과 같은 코드 조각을 입력할 수 있습니다.
<iframe title="A Title for this Content" src="http://yoururlhere.com" width="900" height="500" style="border: 0;"></iframe>
위 코드에서 title="" 및 url="" 부분의 텍스트를 외부 웹 페이지의 제목과 URL로 바꿀 수 있습니다. 사이트 디자인에 맞게 iframe 창의 폭과 높이를 원하는 값으로 사용자 정의할 수도 있습니다.
원한다면 여는 iframe 태그에 다음 내용을 삽입하여 iframe에 스크롤바가 표시되지 않도록 특성을 추가할 수도 있습니다.
scrolling="no"
[개체] > [HTML 삽입]을 선택하여 [HTML 코드] 창을 새로 열고 사이트에서 임의의 위치에 iframe을 포함한 다음 임의의 URL(www.google.com 등과 같은 사이트 주소)을 설정하여 인터넷에서 서비스되고 있는 사이트를 자신의 사이트 내에 표시할 수 있습니다.
Adobe Edge를 사용하여 만든 HTML5 애니메이션 같은 개체를 포함하는 데 iframe을 사용할 수도 있습니다. Adobe Edge를 사용하여 만든 HTML 파일의 이름을 찾은 다음 iframe의 URL 특성에 해당 파일 이름을 사용하면 됩니다.
<iframe src="Project-Header-r1v1.html" width="100%" height="100%" scrolling="no">
</iframe>
그런 다음 Adobe Edge HTML 파일(및 종속 파일)을 Muse 사이트 파일이 있는 동일한 호스트 서버에 업로드해야 합니다. 사이트를 FTP로 내보내는 경우 그 과정에서 Muse를 통해 생성된 폴더로 HTML 파일을 복사할 수 있습니다. Muse에서 [게시] 링크를 클릭하여 Adobe Business Catalyst® 호스팅 서버에 직접 게시하는 경우 Adobe Dreamweaver® 소프트웨어나 임의의 FTP 클라이언트를 사용하여 파일을 업로드할 수 있습니다. FTP를 통해 Business Catalyst 호스팅 서버에 파일을 업로드하는 방법은 "타사 FTP 클라이언트를 사용하여 에셋을 호스팅된 Muse 사이트에 업로드" 문서를 참조하십시오.
여러 마스터 페이지 사용 및 애니메이션 통합
이번 단원에서는 사이트의 섹션을 여러 개로 나누면서도 전체적인 일관성을 유지할 수 있도록 공통 사이트 컨텐트를 여러 개의 마스터 페이지에 표시하는 방법을 설명하고, 마스터 페이지를 다루는 기타 여러 가지 방법을 함께 살펴보겠습니다. 여기에서는 마스터 페이지의 요소를 이동하는 방법도 설명합니다. 이 방법은 여러 개의 마스터 페이지를 만들고 각 페이지별로 특정 그래픽만 사용하도록 사이트를 디자인하고 싶을 때 유용할 수 있습니다. 이 단원에서는 일반적으로 마스터 페이지에 배치되는 요소를 특정 개별 페이지로 이동하는 방법도 설명합니다. 이렇게 하면 각 항목을 서로 겹치게 배열하여 독특한 디자인 효과를 얻을 수도 있습니다.
마스터 페이지 컨텐트 편집 및 마스터 페이지에서 개별 페이지로 컨텐트 이동
마스터 페이지에 배치한 개체는 개별 페이지에 배치하는 다른 모든 컨텐트 아래 층위에 표시됩니다. 예를 들어, 홈 페이지의 머리글이나 바닥글에 배치하는 모든 개체는 마스터 페이지의 머리글과 바닥글에 배치한 배경 위에 겹쳐 표시됩니다. 바로 이와 같은 이유 때문에 때로는 마스터 페이지의 요소를 개별 페이지의 다른 요소 위에 표시하기 위해 마스터 페이지에서 개별 페이지로 요소를 이동 배치해야 하는 상황이 발생할 수도 있습니다.
마스터 페이지에 추가한 컨텐트는 나중에 마스터 페이지를 열고 편집해야 합니다. 마스터 페이지와 연결된 페이지를 열고 머리글, 바닥글 또는 기타 마스터 페이지 컨텐트를 편집하려고 하면 해당 항목이 잠겨 있어 편집할 수가 없습니다. 마스터 페이지의 컨텐트를 변경해야 할 때 사용할 수 있는 방법으로는 두 가지가 있습니다.
1. [플랜] 보기에서 마스터 페이지 축소판을 두 번 클릭한 다음 [디자인] 보기에서 마스터 페이지의 컨텐트를 편집합니다.
2. [플랜] 보기에서 마스터 페이지 축소판을 두 번 클릭하여 [디자인] 보기로 엽니다. 편집할 요소를 선택하고 [편집] > [잘라내기]를 선택하거나, 바로 가기 키 Command+X(Mac) 또는 Ctrl+X(Windows)를 사용합니다. (이 경우 편집할 요소를 사이트의 페이지에 배치하여 해당 요소가 다른 요소보다 위에 놓여야 합니다.)
3. [플랜] 보기로 돌아와서 (지금까지 마스터 페이지에 있던) 컨텐트를 포함할 페이지를 두 번 클릭합니다. [편집] > [제자리에 붙여넣기]를 선택합니다. 이렇게 하면 마스터 페이지에서 잘라낸 하나 이상의 요소가 일반 페이지의 동일한 위치에 배치됩니다. 원한다면 여러 페이지를 열고 [편집] > [제자리에 붙여넣기]를 선택하여 마스터 페이지에 있던 컨텐트를 사이트의 서로 다른 여러 페이지에 배포할 수 있습니다.
필요하면 기존의 마스터 페이지를 복제할 수도 있습니다. 대부분의 페이지에는 특정 마스터 하나를 사용하고 일부 페이지에는 마스터를 복제하여 만든 유사 버전을 사용하도록 사이트를 구성할 수 있습니다. (이렇게 복제된 마스터 페이지에서 특정 요소를 복사하여 사이트의 특정 페이지에 사용할 수 있습니다.) 마스터 페이지를 복제하는 방법은 다음 소단원을 참조하십시오.
마스터 페이지가 아니라 개별 페이지에 개체를 배치하고 나면 필요에 따라 페이지별로 개체를 편집하여 해당 개체가 최상위에 표시되게 할 수 있습니다.
현재 이 샘플 프로젝트에서는 Kevin's Koffee Kart 로고(플래카드를 뒤에 매달고 있는 빨간색 자전거)를 머리글의 사이트 탐색 모음 바로 위에 표시하도록 사이트가 구성되어 있습니다. 머리글과 바닥글 컨텐트를 포함하고 있는 "A-마스터" 페이지에 "Home" 페이지(및 사용자가 만드는 기타 모든 페이지)가 기본적으로 연결되므로 머리글과 바닥글 컨텐트가 각 페이지에 자동으로 표시됩니다. 대부분의 상황에서는 모든 페이지에 동일한 마스터 페이지를 사용하도록 웹 사이트를 작성하여 사이트 전체에 일관성을 부여할 수 있습니다.
그러나 이 샘플 사이트의 경우에는 Home 페이지에만 표시되는 애니메이션 로고가 따로 있습니다. Kevin's Koffee Kart 사이트의 라이브 예제를 확인해 보면 Home 페이지를 처음 로드했을 때 마치 자전거가 페이지 왼쪽에서 출발하여 지나가는 것처럼 빨간색 자전거 로고가 움직이는 것을 알 수 있습니다. 탐색 모음을 클릭하여 다른 페이지를 방문해 보면 이 애니메이션이 Home 페이지에서만 재생되며, 사이트 페이지의 다른 모든 로고는 움직이지 않는다는 사실을 알 수 있습니다.
다음 소단원에서는 마스터 페이지 복제본을 만드는 방법과 [플랜] 보기에서 특정 마스터 페이지를 사용하도록 다른 일반 페이지를 할당하는 방법을 설명합니다.
기존 마스터 페이지를 복제하여 Muse 사이트의 페이지에 적용
1. [플랜] 링크를 클릭하여 [플랜] 보기를 엽니다. [플랜] 보기 인터페이스 하단에 있는 "A-마스터" 축소판을 찾습니다.
2. "A-마스터" 축소판 위에 마우스 커서를 올려 놓으면 사이트맵에 새 페이지를 추가할 때 표시되는 것과 동일한 플러스 아이콘(+)이 나타납니다. "A-마스터" 축소판의 오른쪽에 있는 플러스 기호(+)를 클릭합니다. 마스터 페이지를 처음부터 새로 만들고 싶으면 항상 이 방법을 사용하면 됩니다. 축소판이 비어 있는 것을 알 수 있습니다. 이는 "A-마스터" 페이지에 추가한 컨텐트가 이 마스터 페이지에는 포함되어 있지 않음을 의미합니다. 새 마스터 페이지의 이름은 기본적으로 "B-Master"라고 지정됩니다. 원한다면 축소판 아래 있는 필드를 클릭하고 이름을 변경할 수 있습니다.
그런데 우리가 지금 수행하려는 것은 비어 있는 마스터 페이지를 처음부터 새로 만드는 작업이 아니라 기존의 "A-마스터"를 복제하는 작업입니다.
3. "B-Master" 페이지의 오른쪽 위 가장자리에 있는 [X] 아이콘을 클릭하여 이 페이지를 삭제합니다. (이 방법을 사용하여 기존의 마스터 페이지를 실수로 삭제했을 때는 [편집] > [마스터 페이지 삭제 실행 취소]를 선택하여 이를 복원할 수 있습니다.)
4. "A-마스터" 페이지 축소판을 마우스 오른쪽 단추로 클릭하고 컨텍스트 메뉴가 나타나면 [페이지 복제]를 선택합니다. 복제하여 얻은 마스터 페이지를 가리키는 "A-마스터 사본"이라는 새 축소판이 표시됩니다(그림 59 참조).
그림 59. [플랜] 보기에서 "A-마스터" 페이지를 복제합니다.
5. "A-마스터 사본" 축소판 아래 있는 필드를 클릭하고 복제된 마스터 페이지의 이름을 "MasterFlash"라고 변경합니다. Home 페이지에서만 애니메이션으로 재생되는 리치 미디어 컨텐트를 추가하는 데 이 페이지를 사용할 것입니다. 다른 모든 페이지는 "A-마스터" 페이지와 연결을 계속 유지하여 머리글에 정적인 버전의 로고를 표시합니다.
6. Home 페이지 축소판을 마우스 오른쪽 단추로 클릭합니다. 메뉴가 나타나면 [마스터] > [MasterFlash]를 선택합니다. 이렇게 하면 "MasterFlash" 마스터 페이지가 "Home" 페이지에 연결됩니다.
또는 "MasterFlash" 축소판을 "Home" 페이지 축소판 위로 드래그하여 이를 적용할 수도 있습니다.
"MasterFlash" 마스터 페이지를 적용하고 나면 이 마스터 페이지의 이름이 [플랜] 보기의 Home 페이지 축소판 아래 있는 필드에 표시됩니다.
현재 상태에서는 [미리 보기]를 클릭해도 Home 페이지에서 어떠한 차이점도 발견할 수 없습니다. "MasterFlash"는 "A-마스터" 파일을 복제한 것에 불과하므로 Home 페이지는 지금까지 표시되던 것과 마찬가지로 여전히 정적인 로고를 사용하고 있습니다. 그러나 다음 소단원에서 "MasterFlash" 컨텐트를 편집하여 Home 페이지에서만 재생되는 애니메이션을 추가하고 나면 변화가 생길 것입니다.
복제된 (거의 비슷하지만 약간의 차이가 있는) 마스터 페이지를 사용하면 웹 사이트의 특정 섹션을 쉽게 차별화할 수 있을 뿐만 아니라 이 프로젝트에서 설명하는 바와 같이 매우 독특한 홈 페이지를 만들 수 있습니다.
리치 미디어 컨텐트를 포함하여 사이트에 애니메이션 추가
1. [플랜] 보기에서 "MasterFlash" 축소판을 두 번 클릭하여 [디자인] 보기에서 편집할 수 있도록 엽니다. 이 페이지는 앞서 "A-마스터" 페이지를 복제하여 얻은 것이므로 정적인 로고 이미지가 여전히 남아 있습니다. 이 정적인 이미지를 사용하면 애니메이션 사각형을 정확한 위치에 배치할 수 있어 편리하지만, 리치 미디어 요소를 포함한 후 정적으로 배치된 로고 이미지를 삭제하는 것을 잊지 않도록 주의해야 합니다.
2. [파일] > [배치]를 선택합니다. [가져오기] 대화 상자에서 Kevins_Koffee_Kart 폴더를 찾은 다음 logo.swf라는 파일을 선택합니다.
3. 이 SWF 파일을 왼쪽 위 가장자리에 기존의 로고 이미지 파일과 같은 위치에 놓습니다.
4. 방금 배치한 새 SWF 창을 기존의 정적 로고에 맞춰 정렬했으면 정적 로고를 선택하고 Delete 키를 눌러 이를 삭제합니다.
5. Home 페이지를 새로 변경한 후 전체 사이트의 모양이 어떻게 달라졌는지 확인하려면 [파일] > [브라우저에서 사이트 미리 보기]를 선택한 후 각 페이지의 로고 표시 방식을 테스트합니다. 사이트를 게시하지 않은 상태에서도 컴퓨터를 사용하여 로컬로 작업한 다음 브라우저를 통해 사이트를 미리 보면서 사이트 탐색 모음의 각 페이지를 클릭해 볼 수 있습니다. 애니메이션(SWF 파일)이 Home 페이지에서 한 번만 재생되고 멈추는 것을 알 수 있습니다. 다른 페이지를 클릭하면 정적인 로고만 표시됩니다.
참고:
[파일] > [브라우저에서 페이지 미리 보기]를 선택하면 Home 페이지를 표시하는 새 브라우저 창을 조금 더 빨리 로드할 수 있지만, 이렇게 하면 현재 활성화된 페이지(Home)를 제외한 다른 페이지는 미리 볼 수가 없습니다. 따라서 이 옵션은 전체 웹 사이트가 아니라 사이트의 특정 페이지 하나만 검사하려는 경우에 사용해야 합니다.
게시사이트 프로젝트 작업을 마쳤으면 [파일] > [저장]을 선택하여 변경 내용을 모두 저장합니다. 전체 사이트가 .muse 파일 형식으로 문서 하나에 저장됩니다. 사이트를 온라인으로 볼 준비가 끝났음을 사이트 미리 보기를 통해 확인했으면 이제 사이트를 게시해야 합니다. 사이트 작업을 다른 웹 디자이너와 함께 협력하여 진행하고 싶으면 다른 사람들이 파일을 열고 필요한 부분을 변경할 수 있도록 .muse 파일의 복사본을 공유하면 됩니다.
그러나 이 경우 다른 사람이 사이트를 업데이트하는 동안 자신이 가지고 있는 사본을 변경해서는 안 된다는 점을 명심해야 합니다. 직접 수정하고 싶은 내용이 있으면 다른 사람이 맡은 부분을 완성하여 .muse 파일을 다시 보내올 때까지 기다려야 합니다. 그런 다음 해당 파일을 열고 수정된 버전의 사이트에 또 다른 컨텐트를 더 추가하기 시작할 수 있습니다. 이와 같은 방법을 사용하면 사이트 버전을 모두 통일하여 작업할 수 있습니다.
참고:
이 단원에서는 파일을 Adobe 호스팅 서버에 업로드하는 방법을 설명합니다. 사이트를 타사 호스팅 공급자의 서버에 호스팅하고 싶으면 이 문서의 뒷부분에 나오는 "HTML 내보내기" 단원으로 건너뛰십시오. 궁극적으로는 사이트를 다른 서버에 호스팅할 계획이라 하더라도 Adobe 호스팅 서버에 무료 평가용 사이트를 임시로 게시하면 사이트를 좀 더 쉽게 공유할 수 있고 고객 승인 절차를 간소화할 수 있습니다.
게시 및 내보내기 대상에서 페이지 제외
웹 사이트를 게시할 때는 사이트의 페이지 중 아직 게시(또는 내보내기) 준비가 덜 끝난 것은 없는지 먼저 확인해야 합니다.
사이트를 게시하거나 내보낼 때 특정 사이트를 제외하고 싶으면 다음과 같이 합니다.
1. 제외할 페이지를 마우스 오른쪽 단추로 클릭합니다. [플랜] 보기에서 페이지의 축소판을 마우스 오른쪽 단추로 클릭해도 되고, [디자인] 보기에서 페이지 자체를 마우스 오른쪽 단추로 클릭해도 됩니다. 컨텍스트 메뉴를 보면 [페이지 내보내기] 옵션 옆에 기본적으로 확인 표시가 있는 것을 알 수 있습니다.
2. 이 옵션을 선택하여 확인 표시를 해제하면 선택한 페이지는 게시 대상에서 제외됩니다(그림 60 참조). 이 옵션은 토글 방식입니다. 페이지를 게시할 준비가 되었을 때는 해당 페이지를 마우스 오른쪽 단추로 클릭하고 [페이지 내보내기] 옵션을 선택하여 확인 표시를 다시 적용하면 됩니다. Home 페이지는 사이트의 첫 페이지이므로 내보내기 대상에서 제외할 수 없습니다. 따라서 마우스 오른쪽 단추로 Home 페이지를 클릭했을 때는 [페이지 내보내기] 옵션이 비활성화되어 토글 전환할 수 없습니다.
그림 60. 게시하거나 내보내지 않으려는 페이지가 있으면 해당 페이지에 대해 [페이지 내보내기] 옵션을 선택하여 확인 표시를 해제합니다.
[페이지 내보내기] 옵션을 선택 취소한 페이지는 사이트를 게시할 때 함께 게시되지 않습니다. 사이트를 내보낼 때도 해당 페이지는 제외됩니다.
참고:
사이트를 이미 게시한 후에 이 [페이지 내보내기] 옵션을 선택 취소하면 다음 번에 사이트를 게시할 때 해당 페이지가 평가용 사이트에서 제외됩니다.
Adobe 호스팅 서버에 임시 사이트 게시
사이트를 게시한다는 것은 인터넷을 통해 액세스한 방문자가 온라인으로 사이트를 볼 수 있도록 사이트 파일을 원격 서버에 업로드하는 것을 의미합니다. 평가용 사이트를 게시했을 때는 정확한 URL을 알고 있는 사람이면 누구든지 해당 사이트에 액세스하여 이를 볼 수 있습니다. 평가용 사이트를 방문하는 데 필요한 링크를 고객에게 이미 보낸 상태에서 추가로 변경해야 할 점이 발견되었을 때는 새 버전에 대한 작업을 진행하면서 평가용 사이트를 새로 게시할 수 있습니다. 그러지 않으면 고객이 로그인했을 때 작업 중인 미완성 사이트가 표시될 수 있습니다.
Muse에는 통합 게시 시스템이 사용되므로 사이트를 쉽고 빠르게 게시할 수 있습니다. [게시] 인터페이스를 사용하여 업로드한 파일은 Business Catalyst 호스트 서버에 저장됩니다.
Muse 사이트를 게시하는 단계별 작업 과정은 다음과 같습니다.
1. 작업 영역 상단에 있는 [게시] 단추를 클릭하거나 [파일] > [게시]를 선택합니다. Muse를 통해 사용자의 계정에 대한 연결이 설정됩니다. 이 계정은 ("Muse에 처음으로 로그인" 단원의 설명에 따라) Muse를 처음 실행할 때 입력하거나 만든 사용자 이름과 암호입니다.
2. [게시] 대화 상자가 나타납니다. 사이트의 이름을 [사이트 이름] 필드에 입력합니다(그림 61 참조).
그림 61. 고객의 회사 이름을 입력하거나 사이트에 부여할 기타 이름을 입력합니다.
참고:
지금 입력하는 사이트 이름은 평가용 사이트의 임시 도메인 이름을 만드는 데 사용됩니다. 그러나 라이브 사이트를 업그레이드할 때 다른 도메인 이름을 선택하여 사이트의 주소로 사용할 수도 있습니다.
평가용 사이트의 URL이 Muse에서 자동으로 생성됩니다. 이 URL은 다음과 같은 형식입니다.
site_name.businesscatalyst.com
생성된 이름이 [사이트 이름] 필드 아래 회색으로 표시됩니다. 시스템 내의 각 사이트 이름은 중복되지 않아야 합니다. 이미 사용 중인 이름을 입력하면 Muse를 통해 조금 수정된 고유한 이름이 자동으로 제시됩니다.
Muse를 통해 자동으로 생성된 이름이 마음에 들지 않으면 이를 변경해도 됩니다.
3. [옵션] 섹션 옆에 있는 화살표 아이콘을 클릭하여 옵션을 확장합니다. 고유한 새 이름을 [URL] 필드에 입력합니다. 사용자가 입력한 새 URL의 중복 여부를 시스템에서 자동으로 검사합니다. 해당 이름이 시스템에 이미 있으면 필드가 빨간색으로 바뀌고 중복되지 않은 다른 URL이 제시됩니다(그림 62 참조).
그림 62. 임시 사이트 URL에 사용할 이름을 입력합니다. 이는 고객이 사이트를 보는 데 사용할 웹 주소입니다.
[URL] 필드에 입력한 URL이 중복되지 않았으면 필드 테두리가 더 이상 빨간색으로 표시되지 않습니다(그림 63 참조).
그림 63. [URL] 필드가 파란색으로 표시되면 해당 URL이 중복되지 않아서 사용해도 좋다는 의미입니다.
기본적으로는 [게시 위치: 새 사이트] 옵션이 선택되어 있지만, 과거에 이미 평가용 사이트를 만든 적이 있다면 [기존 사이트] 옵션을 선택하고 [게시 위치] 메뉴에서 기존의 평가용 사이트 이름을 선택할 수 있습니다.
기존 사이트의 새 버전을 만드는 경우에는 기존 사이트를 새 버전의 파일로 덮어쓰지 않고 계속 유지하기 위해 언제든지 새 버전의 디자인을 새 사이트에 게시할 수 있습니다. 이렇게 하면 고객이 각기 다른 브라우저 창에서 두 가지 버전의 사이트를 동시에 비교해 볼 수 있도록 고객에게 링크 두 개를 보낼 수 있습니다.
기본 설정되어 있는 또 다른 옵션으로는 [자동]으로 설정된 [데이터 센터] 옵션이 있습니다. 데이터 센터는 현재 사용자가 있는 실제 위치를 기준으로 하는 원격 Business Catalyst 서버의 지리적 위치를 가리킵니다. Muse에서는 사용자의 위치를 감지하여 올바른 데이터 센터 위치를 자동으로 선택하므로 대부분의 경우에는 이 옵션을 [자동] 설정 그대로 두면 됩니다. 그러나 고객이 다른 국가에 있다면 기본 설정을 무시하고 다음 옵션 중 하나를 선택할 수 있습니다.
- 미국
- 유럽
- 호주
예를 들어, 사용자가 미국에서 작업하고 있는데 사용자의 고객은 호주에 거주한다면 호주 데이터 센터를 선택할 수 있습니다. 이렇게 하면 해당 고객이 호주 지역에 최적화된 환경을 통해 온라인으로 사이트를 볼 수 있습니다.
4. [사이트 이름], [URL] 및 기타 옵션의 설정을 마쳤으면 [확인]을 클릭합니다. 호스트 서버에 업로드된 파일의 백분율을 표시하는 진행률 표시줄이 잠시 나타납니다. 평가용 라이브 사이트가 새 브라우저 창에 로드됩니다. 링크를 클릭해 보고 브라우저의 크기를 조절해 보면서 디자인이 어떻게 표현되는지 테스트할 수 있습니다.
5. Muse로 돌아갑니다. 평가용 사이트가 호스팅되고 있음을 알리는 확인 메시지가 나타납니다. 이 확인 창에서 [관리] 단추를 클릭하여 사이트를 관리할 수 있습니다. 또는 [확인]을 클릭하여 창을 닫고 작업을 계속 진행할 수도 있습니다(그림 64 참조).
그림 64. 게시 확인 메시지를 닫으려면 [확인]을 클릭하고, 사이트를 관리하려면 [관리]를 클릭합니다.
위에 나와 있는 대화 상자를 사용하지 않더라도 언제든지 작업 영역 상단에 있는 [관리] 단추를 클릭하여 관리 인터페이스에 액세스할 수 있습니다. [관리] 링크는 활성 Muse 프로젝트에 대한 평가용 사이트를 게시하고 나면 활성화됩니다.
Adobe Muse에서 무료 평가용 사이트를 그 수에 제한 없이 원하는 만큼 만들어 Adobe 호스팅 서버에 게시할 수 있습니다. Adobe Business Catalyst 플랫폼에 게시한 평가용 사이트는 30일 동안 온라인 상태가 유지됩니다. 이 기간이 경과한 후에는 Muse 내에서 사이트를 다시 게시하여 2주 단위로 평가 기간을 연장할 수 있습니다.
계속하여 Adobe Muse 시작하기, 제 7부에서는 대시보드를 사용하여 사이트를 관리하는 방법을 설명합니다.
Adobe Muse(어도비 뮤즈) 시작하기 제6부
임베디드 HTML을 사용하여 웹 페이지에 Google 지도 삽입
이 내용은 ADOBE 홈페이지 어도비 뮤즈<adobe muse> 도움말을 가지고 왔습니다.
'컴퓨터 > 그래픽' 카테고리의 다른 글
adobe muse(어도브 뮤즈) 웹사이트 만들기1 (0) | 2014.02.05 |
---|---|
Adobe Muse(어도비 뮤즈) 시작하기 제7부 (0) | 2014.02.03 |
Adobe Muse(어도비 뮤즈) 시작하기 제5부 (0) | 2014.02.01 |
Adobe Muse(어도비 뮤즈) 시작하기 제4부 (0) | 2014.01.31 |
Adobe Muse(어도비 뮤즈) 시작하기 제3부 (0) | 2014.01.30 |