서비스명: 지식백과 / 제보자 : 정사라
현상
| 재현환경 |
|---|
| ios 버전 6.1.3, 7.1.1, 7.0.4 safari 브라우저 |
ios에서 기본 entity는 정상노출됩니다.
하지만, ㈜의 경우 entity코드가 없어 unicode로 넣어 대체하였으나, Helvetica font에서 해당 unicode 인식하지 못해 x표시(일명 엑박)로 노출되는 문제가 있어 공유드립니다.
| 오류화면 | 정상 화면 |
|---|---|
 |
 |
정상화면URL: http://m.terms.naver.com/entry.nhn?docId=1395962&cid=685&categoryId=1426
원인
- Helvetica만 선언했을경우 영문은 Helvetica로 보여주고 한글은 AppleSDGothicNeo 로 보여줌
- unicode는 한글이 아니므로 Helvetica로 렌더링 시도
- Helvetica는 ㈜에 해당하는 unicode를 지원하지 않아 X로 노출
해결방법
기본폰트인 Helvetica뒤에 sans-serif도 추가로 넣어 해결됨.
- sans-serif는 영문,숫자를 포함한 모든 문자를 html의 lang값에 맞는 기본 폰트로 노출해줌.
(ko일 경우 ios에서는 AppleGothic / AppleSDGothicNeo)
- Helvetica 뒤에 sans-serif를 선언하면 영문은 Helvetica로 표현하고 Heveltica로 표현하지 못하는 문자를 AppleSDGothicNeo로 표현하기대문에 ㈜가 노출됨
정상화면 코드
body,input,textarea,select,button,table{font-size:14px;line-height:18px;font-family:Helvetica,sans-serif}
참고사항
- unicode url : http://titus.uni-frankfurt.de/unicode/unitestx.htm#U3200
- 산돌SD네오고딕 Unicode 목록: http://unichar.info/font/applesdgothicneomedium
etc. html 한글선언과 인코딩 FontTest URL
※ 캡쳐된 이미지를 보시면, helvetica를 선언한것과 sans-serif 등을 넣어두었습니다.
자세한 이미지를 보기 원하시면 테스트 url을 참고하세요~
※ 또한, 사내에 쥬니버와 같이 PC서비스를 태블릿으로 보여지게 하는 서비스도 있을것같고.
CP사 Page나 Iframe으로 들어가져 있는 Page도 있을것으로 보이기에 아래와 같이 Test를 해보았습니다.
※ html lang= “no”는 <html>로 씌여진걸 쉽게 이해하도록 lang=”no”라고 적었습니다.
※ pageEncoding은 파일 문서모드를 의미합니다.
0개의 댓글