맞춤 스플래시 화면에 맞게 구성되지 않음

맞춤 스플래시 화면을 사용하면 프로그레시브 웹 앱 (PWA)이 기기용으로 제작된 앱처럼 느껴집니다. 기본적으로 사용자가 홈 화면에서 PWA를 실행하면 Android는 PWA가 준비될 때까지 흰색 화면을 표시합니다. 사용자에게 최대 200ms 동안 빈 흰색 화면이 표시될 수 있습니다. 맞춤 스플래시 화면을 설정하면 사용자에게 맞춤 배경 색상과 PWA 아이콘을 표시하여 브랜딩된 매력적인 환경을 제공할 수 있습니다.

Lighthouse 스플래시 화면 감사 실패 방법

Lighthouse는 맞춤 스플래시 화면이 없는 페이지에 플래그를 표시합니다.

사이트가 맞춤 스플래시 화면에 맞게 구성되지 않았음을 보여주는 Lighthouse 감사

맞춤 스플래시 화면을 만드는 방법

Android용 Chrome은 웹 앱 매니페스트에서 다음 요구사항을 충족하면 맞춤 스플래시 화면을 자동으로 표시합니다.

  • name 속성은 PWA의 이름으로 설정됩니다.
  • background_color 속성이 유효한 CSS 색상 값으로 설정됩니다.
  • theme_color 속성이 유효한 CSS 색상 값으로 설정됩니다.
  • icons 배열은 512x512픽셀 이상의 아이콘을 지정합니다.
  • 지정된 아이콘이 존재하며 PNG입니다.

자세한 내용은 Chrome 47에서 설치된 웹 앱의 스플래시 화면 추가를 참고하세요.

자료

맞춤 스플래시 화면에 맞게 구성되지 않음 감사의 소스 코드