'네이버앱'에서만 웹폰트가 적용되지 않았던 문제 해결!

고객의 요청으로 폰트 미리보기 사이트를 만들었는데, 갑자기 모든 폰트가 고딕체로 변했다는 연락이 왔습니다.

확인해보니 다른 브라우저에서는 모두 정상적으로 보이는데 '네이버앱' 에서만 폰트가 고딕체로 되어있더라고요.

 

왜 눈누 페이지는 되는데 내껀 안되지?! 하고 여기저기 뒤져본 결과

 

일단 확인할 내용

1. 네이버앱 설정 > 화면 스타일·폰트 설정에 기본글꼴로 되어있어야함. (눈누에서도 동일하게 보이는지 확인)

네이버앱은 사용자가 폰트를 정할수있기때문에, 웹폰트보다 앱에 적용된 폰트가 최우선으로 먹힘..

이의경우 강제로 설정할수있는 방법은 없는듯 합니다.

!important 를 먹여도 네이버앱 설정이 제일 최고순위인거 같아요.

 

2. css 확인

이의경우 개발자님이 건든뒤로 확인은 안했었는데 다시보니 콤마, 가 들어가있었습니다..

@font-face {
  font-family: '{=.fontNm}'{ ? .fontNm==='NanumGothic'}, sans-serif{ / };  
  font-weight: 700;
  src: url('/data/font/{=.fontPath}')  ,  format('{=.fontFormat}');
}

위의 검정색 표시된 부분 때문에 네이버앱 에서 적용이 안되었던것

,를 풀고나니 정상적용 됩니다.

 

제가 봤을때, 오류난 코드는 다른 브라우저에서 정상화 시켜주는거 같은데 네이버앱만 안되는것 같습니다.

검색해봤을때 사례가 많이 없어서 자체 css오류라고 생각하긴 했지만 이것이 이유였을줄이야 ㅠㅠ