Studio 에디터: 페이지에서 반응형 디자인 문제 확인하기

5 분 분량
페이지 메뉴
  • 페이지 반응형 문제 스캔하기
  • 무시된 문제 복원하기
  • 자주 묻는 질문
다양한 기기가 사용되는 세계에서 클라이언트를 위한 반응형 디자인을 제작하는 것은 필수적입니다. Wix Studio의 반응형 진단 도구는 이 과정을 단순화해 모든 화면 중단점에서 문제를 빠르게 식별하고 관리할 수 있도록 합니다. 
문제를 해결하거나, 확인하거나, 무시할 수 있어 비전에 맞게 디자인을 유연하게 구체화할 수 있습니다.
미해결 문제 및 해결된 문제를 보여주는 Studio 에디터의 반응형 진단 도구 스크린샷

페이지 반응형 문제 스캔하기

페이지 디자인이 모든 화면 크기에서 최적의 형태로 표시되도록 페이지에 존재하는 반응형 문제를 찾아 해결하세요. 페이지는 모든 화면 중단점에서 검토됩니다. 그런 다음 식별된 문제가 디자인과 관련이 있는지 또는 무시해야 하는지 여부를 결정합니다.

페이지를 스캔하려면:

  1. 에디터로 이동해 관련 사이트 페이지를 엽니다.
  2. 에디터 왼쪽에서 사이트 진단 도구를 클릭합니다.
  3. 반응형 문제 해결을 선택합니다.
  4. 페이지 스캔을 클릭합니다.
  5. 이 페이지에서 발견된 문제를 검토합니다.
  6. 문제에 대해 취할 작업을 선택합니다.
    • 문제 해결: 문제 옆 해결하기를 클릭합니다. 이렇게 하면 권장 사항이 관련 요소에 자동으로 적용되고 패널에서 문제가 제거됩니다.
    • 페이지에서 문제 확인하기: 수정 사항 적용 여부를 결정하기 전 캔버스에서 보기를 클릭해 문제가 어떻게 표시되는지 확인합니다. 
    • 문제 무시하기: 문제의 무시 아이콘을 클릭해 무시할 수 있습니다. 해당 문제는 이 페이지를 다시 스캔해도 다시 발생하지 않습니다.   
  7. (선택사항) 다른 페이지를 스캔합니다.
    1. 상단에서 페이지 드롭다운을 클릭합니다.
    2. 해당 페이지 옆 스캔을 클릭합니다.
Studio 에디터의 반응형 진단 도구에서 캔버스의 위치 문제를 확인하기 위해 클릭하는 스크린샷
도움말:
일부 문제는 특정 화면 중단점에만 표시됩니다. 이 경우, 발행의 왼쪽 하단에서 영향을 받는 화면 중단점을 나타내는 아이콘을 확인할 수 있습니다. 

무시된 문제 복원하기

문제를 무시하면 페이지를 다시 스캔해도 반응형 진단 도구는 이를 완전히 무시합니다. 하지만, 무시된 문제에 수정 사항을 적용할지 여부를 언제든지 검토하고 결정할 수 있습니다. 

무시된 문제를 복원하려면:

  1. 에디터로 이동해 관련 사이트 페이지를 엽니다.
  2. 에디터 왼쪽에서 사이트 진단 도구를 클릭합니다.
  3. 반응형 문제 해결을 선택합니다.
  4. 상단의 필터 아이콘을 클릭합니다.
  5. 무시된 문제를 선택합니다.
반응형 진단 도구 패널 상단에서 필터 아이콘을 클릭한 후 무시된 문제를 선택하는 스크린샷
  1. (선택사항) 해당 문제 옆 캔버스에서 보기를 클릭해 페이지에서 확인합니다.
  2. 복원을 클릭합니다.
  3. (선택사항) 복원된 문제를 해결합니다.
    1. 상단의 필터 아이콘을 클릭합니다.
    2. 미해결 문제를 선택합니다.
    3. 복원된 문제를 찾아 해결하기를 클릭합니다.
반응형 진단 도구에서 무시된 문제의 복원을 클릭하는 스크린샷

자주 묻는 질문

아래 질문을 클릭해 자세한 내용을 확인하세요.
반응형 디자인에 대한 자세한 도움말을 확인하세요.
Wix Studio 아카데미는 반응형 사이트를 빠르게 디자인하는 데 도움이 되는 다양한 리소스를 제공합니다. 에디터의 반응성에 대한 자세한 도움말을 확인하세요.