React 웹 폰트 최적화하기(2) 웹 폰트 최적화하기(1)에 이어서 그렇다면 웬 폰트를 어떻게 최적화해야 할까? 이번 포스팅에서는 웹 폰트를 최적화하는 다양한 방법에 대해 알아보고 이해하기 위해 포스팅을 작성한다. 웹 폰트 적용하는 방법1. CDN을 활용한 웹 폰트 적용 방법CDN을 활용해 프로젝트 내에서 웹 폰트를 적용하는 방법이다. 태그를 통해 간단하게 적용할 수 있다는 장점이 있지만 서버의 상태에 따라 적용되는 시간이 달라질 수 있다는 단점이 있다. Google font를 적용한 간단한 예시이다. CSS내에서 import를 사용해서 CDN을 적용할 수 도 있다. @import url('https://fonts.googleapis.com/css2?family=Jersey+15&family=Noto+Sans+KR:wght@100.... React 웹 폰트 최적화하기(1) 다양한 브라우저, 다양한 환경, 많은 사용자가 동일하고 일관된 폰트를 볼 수 있도록 웹 폰트를 적용할 수 있다. 이러한 웹 폰트를 사용하면 다양한 환경에서 사용자들이 동일한 사용자 경험을 가질 수 있다는 좋은 장점이 있지만 잘못 사용하게 되면 사용자 경험을 해칠 수 있기 때문에 최적화하는 과정이 필요하고 그러한 방법을 알아보려 한다. 웹 폰트의 종류 브라우저에서 사용되는 웹 폰트의 종류는 다양하게 있다. 또한 브라우저 별로 지원되는 폰트의 종류도 여러가지가 있으므로 사용자 경험을 고려하여 사용하여야 한다. TTF/OTFTrueTypeFont는 Mac OS, Windows 운영체제에서 가장 일반적으로 사용되는 폰트 형식이지만 레거시 한 기술로 점차 다른 폰트 형식으로 교체되어 가고 있다. OpenTypeF.. 이전 1 다음
