header-logo
Wix를 사용해해 사이트와 비즈니스를 구축하는 방법을 알아보세요.
직관적인 Wix 기능을 사용해 사이트를 디자인하고 관리하세요.
구독, 플랜 및 인보이스를 관리하세요.
비즈니스를 운영하고 회원과 소통하세요.
도메인을 구매하고 사이트에 연결, 이전하는 방법을 알아보세요.
비즈니스 및 웹 존재감을 키울 수 있는 도구를 확인하세요.
SEO 및 마케팅 도구로 가시성을 높이세요.
보다 효율적으로 작업할 수 있는 고급 기능을 활용하세요.
해결책을 찾고, 알려진 문제에 대해 알아보거나 문의하세요.
placeholder-preview-image
강좌 및 튜토리얼을 통해 실력을 향상시키세요.
웹 디자인, 마케팅 등에 대한 팁을 확인하세요.
검색 엔진에서 유기적 사이트 트래픽을 증가시키는 방법을 알아보세요.
풀스택 플랫폼을 활용해 맞춤형 사이트를 구축하세요.
목표 달성에 도움을 줄 전문가를 만나보세요.
placeholder-preview-image

Wix 에디터: 사이트가 로딩될 때 글꼴이 변경되는 현상

1 분
사이트 글꼴이 변경되는 것은 스타일이 적용되지 않는 페이지가 나타나는 현상(Flash of Unstyled Content; FOUC)으로 흔한 웹 디자인 문제 중 하나입니다. 

스타일이 적용되지 않은 페이지가 나타나는 현상(Flash of Unstyled Content; FOUC)

FOUC는 Wix 플랫폼에서만 나타나는 현상이 아닙니다. 오히려 특정 브라우저가 콘텐츠를 로딩하는 방식과 브라우저에서의 글꼴 기본 특성(예: 브라우저가 글꼴을 인식하기 전 사용되는 기본 글꼴)에 연관이 있습니다.
글꼴은 사이트의 다른 요소와 함께 캐스캐이딩 스타일 시트(Cascading Style Sheet; CSS)에 존재합니다. 브라우저가 사이트를 최초로 로딩할 때, 시간 단축을 위해 브라우저는 브라우저 기본 글꼴로 텍스트를 로딩합니다. CSS가 로딩된 후에만 사용자가 선택한 글꼴로 변경됩니다. 
이 문제는 아래의 요인에 따라 달라집니다. 
  • 선택한 글꼴
  • 인터넷 속도 

FOUC를 피하는 방법

이 문제는 화려한 글꼴 사용을 지양하고, 주요 브라우저에서 기본적으로 사용하는 글꼴을 사용함으로써 최소화할 수 있습니다. 
혹은 텍스트를 이미지로 삽입할 수 있으나, 이는 SEO에서 텍스트가 인식될 수 없게 됩니다.
참고:
Wix와 대부분의 웹디자이너는 이 문제를 인지하고 이와 같은 인터넷 전반 및 브라우저에 대한 해결책을 언제나 모색하고 있습니다. Wix는 계속해서 기술적으로 연구하고 개발해 이러한 문제가 향후 해결될 수 있도록 하겠습니다.