Adobe Muse에서 반응형 사이트를 만드는 방법을 배워봅니다. 빈 레이아웃 또는 미리 정의된 템플릿을 사용해 반응형 사이트를 만들 수 있습니다.

참고:

Adobe Muse는 더 이상 새로운 기능을 추가하지 않으며 2020년 3월 26일 목요일에 지원이 중단됩니다. 자세한 정보 및 지원은 Adobe Muse 서비스 종료 페이지를 참조하십시오.

Adobe Muse에서는 다음과 같은 방법 중 하나로 반응형 웹 사이트를 만들기 시작할 수 있습니다.

  • 시작 파일 사용: Adobe Muse는 빠르게 시작할 수 있도록 사용자 정의 가능한 반응형 시작 템플릿을 제공합니다. 시작 템플릿을 사용자 정의하고 몇 번의 클릭으로 반응형 사이트를 게시할 수 있습니다. 자세한 내용은 반응형 시작 템플릿 사용을 참조하십시오.
  • 빈 레이아웃 사용: Adobe Muse는 반응형 사이트를 디자인하기 위해 제한적인 템플릿이나 격자가 없는 빈 캔버스를 제공합니다. 단일 Adobe Muse 파일을 사용하여 다양한 브라우저 폭으로 다양한 레이아웃을 만드십시오. 새로운 반응형 Adobe Muse 웹 사이트를 만들려면 새 반응형 사이트 만들기를 참조하십시오.
  • 기존 웹 사이트를 반응형 웹 사이트로 변환: Adobe Muse에서는 기존 Adobe Muse 사이트를 반응형 레이아웃으로 마이그레이션할 수 있습니다. 기존 Adobe Muse 웹 사이트의 레이아웃을 유동 폭으로 변경하고 다양한 브라우저 폭에 맞게 개체 레이아웃을 조정합니다. 자세한 내용은 기존 Adobe Muse 웹 사이트를 반응형 레이아웃으로 마이그레이션을 참조하십시오.

반응형 레이아웃에서 페이지를 열면 Adobe Muse에서 중단점, 개체 크기 조정 및 반응형 레이아웃에 대한 텍스트 서식 지정을 설명하는 간단한 슬라이드 쇼 반응 기능 둘러보기를 표시합니다. 반응 기능 둘러보기를 계속하거나 나중에 도움말 > 반응 기능 둘러보기를 클릭하여 슬라이드 쇼를 볼 수도 있습니다.

Adobe Muse에서 반응형 디자인을 시작하는 방법에 대한 비디오 자습서를 시청하려면 반응형 레이아웃 비디오 자습서를 참조하십시오.

반응형 시작 템플릿 사용하기

Adobe Muse는 다양한 유형의 웹 사이트용 템플릿(예: 개인 사이트용 또는 사진 전시회 출품용 템플릿)을 제공합니다.

시작 템플릿에 액세스하려면 Adobe Muse 페이지의 스타터 디자인 섹션을 참조하십시오. 섹션에서 템플릿을 선택한 후 다운로드를 클릭하여 시작 파일을 다운로드합니다.

시작 파일을 열면 미리 정의된 템플릿이 있는 마스터 페이지와 일련의 개별 페이지가 Adobe Muse 플랜 보기로 열립니다. 상단 패널에서 데스크톱(1160픽셀 폭), 태블릿(768픽셀 폭) 또는 모바일(380픽셀 폭)을 선택할 수 있습니다. 요구 사항에 따라 시작 템플릿을 수정하고 스크러버를 사용하여 페이지를 미리 볼 수 있습니다.

템플릿을 다운로드하지 않으려면 시작 디자인 섹션에서 미리보기를 클릭하면 됩니다. 브라우저에 샘플 사이트가 열립니다.

새 반응형 사이트 만들기

반응형 레이아웃으로 새 사이트를 만들려면 새 사이트 대화 상자에서 유동 폭 옵션을 선택합니다. 페이지의 개체가 자동으로 반응하고 브라우저 크기 맞춰 조절됩니다. 또한 유동 폭을 사용하면 제한적인 템플릿이나 미리 정의된 레이아웃이 없는 빈 레이아웃에서 반응형 사이트를 디자인할 수 있습니다.

  1. 파일 > 새 사이트를 클릭합니다.

    newsitefluid
    반응형 웹 사이트의 유동 폭 선택

  2. 유동 폭을 클릭합니다. 유동 폭 옵션을 선택하면 페이지에 있는 개체가 중단점을 따라 움직입니다. 즉, 개체가 반응형 동작을 기준으로 브라우저 폭에 반응한다는 의미입니다.

  3. 고급 설정을 클릭하고 사이트의 폭, 높이 및 여백을 설정합니다. 사이트를 편리하게 디자인하는 데 도움을 주는 브라우저 폭부터 시작할 수 있습니다. 개체를 배치한 후 중단점을 추가하여 다른 브라우저 폭을 설정할 수 있습니다.

    그런 다음 해상도와 언어 설정을 선택합니다. 확인을 클릭합니다.

    advancedsettingsfluid
    유동 사이트를 만들 때 적용할 수 있는 고급 설정

    새로운 반응형 사이트를 만든 후 브라우저 폭에 맞춰 이미지, 텍스트, 기타 개체를 배치합니다.

이 작업에는 Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License의 라이센스가 부여되었습니다.  Twitter™ 및 Facebook 게시물은 Creative Commons 약관을 적용받지 않습니다.

법적 고지 사항   |   온라인 개인 정보 보호 정책