구글 크롬, 글자가 깨지는 문제가...

 구글 크롬을 사용하시는 분들은 근래에 들어 특정 웹사이트에 접속시 글씨 깨짐 현상을 경험해 보셨을 겁니다. 특히, 개발자 버전이나 카나리아 빌드를 사용하는 분들이 이런 글씨 깨짐 현상을 더욱 많이 겪고 계실텐데요.
 사실 이런 문제는 글꼴만 살짝 변경해 주면 간단하게 해결할 수 있습니다. 하지만 의외로 구글 크롬에서는 웹사이트에서 표시되는 글꼴을 변경하지 못한다고 알고 계시는 분들이 많으시더군요. 물론, 네이버 등과 같이 웹사이트 자체적으로 어떠한 글꼴이 지정되어 있는 경우에는 웹브라우저에서 변경하더라도 설정한 글꼴이 적용되어 표시되지 않기는 합니다.


 특히나 국내에서 많은 분들이 접속하고 이용하시는 네이버, 페이스북 등의 경우에도 앞서 언급한 것과 같은 크롬에서의 글씨 깨짐 현상을 경험할 수가 있는데요. 네이버와 같이 웹브라우저에서의 글꼴 변경이 적용되어 표시되지 않는 사이트의 경우에도 개인적으로 원하는 글꼴을 일괄되게 설정할 수 있습니다.

 포털이나 커뮤니티 등을 보면 확장프로그램을 이용한 방법을 자주 소개해 주시던데... 확장프로그램을 이용해도 되지만 저처럼 굳이 메모리 사용량을 늘려가며 이것저것 많이 설치하는 것을 싫어하는 분들도 계실테고 하여 불필요한 설치없이 설정할 수 있는 방법으로 소개하도록 하겠습니다.

크롬(Chrome), 글꼴 강제 지정하기!

▼ 구글 크롬에서 네이버 접속시 글씨/글꼴 깨짐 현상을 캡쳐해 보았습니다.


 업데이트를 통해 이런 문제가 수정되기도 하지만 무작정 기다리기만 할 수는 없는 노릇이죠? ^^;;


 지금부터 이 문제를 가뿐하게 해결해 보겠습니다~ 우선, 폴더 옵션에서 숨김 폴더/파일이 보이게 설정하신 후 아래 경로로 이동해 주세요.


[구글 크롬 사용자의 경우]
C:\사용자\사용자계정명\AppData\Local\Google\Chrome\User Data\Default\User StyleSheets\Custom.css

[크롬 플러스 사용자의 경우]
C:\사용자\사용자계정명\AppData\Roaming\ChromePlus\ChromePlusUserData\Default\User StyleSheets\Custom.css

 혹시나 잘 이해가 안되는 분들을 위해 제 PC 에서의 경로로 예를 들어 보자면 'C:\Users\LiveREX\AppData\Local\Google\Chrome\User Data\Default\User StyleSheets' 와 같은 방식으로 이동해 주시면 됩니다.


▼ 위 경로오 이동해 보면 Custom.css 파일이 있을텐데요. 이 파일을 편집해줘야 하니 우클릭해서 편집 메뉴를 선택합니다.



▼ 그리고는 아래 예시와 같은 명령어를 입력해 주세요!



 [Custom.css 명령어 예시]

* {font-family : serif !important;
letter-spacing : 0.5px;
word-spacing : -1px;
}


 설정을 하시면서 혹시나 위 명령어 중 개별적으로 변경을 하실 부분이 있다면, 아마 letter-spacing 와 word-spacing 일 겁니다. letter-spacing 는 글자간격(자간)을 의미하고 word-spacing 는 단어간격을 의미하는데요.

 굳이 이 명령어를 사용하지 않으셔도 되지만 혹시나 설정하면서 이 부분까지 수정해 주고 싶은 글꼴이 있을 수 있기에 함께 알려드립니다. 


▼ 위 명령어 입력까지 완료했다면 이제 구글 크롬에서 적용하고 싶은 글꼴을 선택해 주면 되는데요. [옵션] - [고급설정] - [글꼴 맞춤설정] 으로 이동해 주세요.



▼ 그럼 글꼴 및 인코딩 설정 화면이 나타날텐데, [Serif 체] 를 원하는 글꼴로 변경해 주시면 됩니다. 저는 요즘 많은 분들께 인기를 모으고 있는 나눔고딕체를 설정해 보았습니다.



▼ 위와 같이 설정을 하셨다면 모든 과정이 완료되었습니다. 아래는 글자가 깨지던 페이지와 동일한 화면을 글꼴 변경 후 다시 접속해 본 모습입니다 .


 
 간단하죠?? 위에서 알려드린 것처럼 자간이나 단어 간격만 설정해도 어느 정도는 만족스러운 설정이 가능하리라 생각되는데요. CSS 명령어를 능숙하게 활용하실 수 있는 분이라면 Custom.css 에서 더 다채롭게 꾸며줄 수도 있을 겁니다.

 혹시 구글 크롬을 사용하시면 글씨 깨짐 현상을 겪고 있는 분이라면 이제 본문과 같은 방법을 통해 간단하게 문제를 해결해 보세요 ^^
LiveREX 유튜브 채널 추천 영상 (구독하고 선물도 받아가세요!)
☞ 이 글은 LiveREX 의 동의없이 재발행/재배포 할 수 없습니다. [License] 를 참고하세요!
Facebook Comment