슬기로운 개발노트

프로젝트를 하면서 웹폰트 설정 관련해서 이전엔 안 써본 font 속성에 대하여 정리! - 웹 폰트 최적화 방법 : 텍스트가 항상 보이게 하기 * 웹폰트 적용시 텍스트 번쩍임 현상 발생 1) FOIT (Invisible) (Firefox, Chrome) 웹폰트가 적용되지 않은 “텍스트”가 보이지 않는 상태에서 폰트가 바뀌면 텍스트 번쩍임 현상 발생. 2) FOUT (Unstyled) (Internet Explorer) 웹폰트가 적용되지 않은 “폴백 폰트 상태”에서 폰트가 바뀌면서 텍스트 번쩍임 현상이 일어나는 현상 발생. * CSS의 font-display 속성을 사용하면 외부 라이브러리를 사용하지 않고도 웹폰트의 로딩 상태에 따른 동작 설정이 가능함. (현, IE 미지원.) font-display : a..