움라우트가없는 Webfont

Question

최근에 글꼴을 구입하여 웹 글꼴을 사용하여 웹 사이트에 포함하려고했습니다.

이제 문제는 다음과 같습니다. 구입 후, 글꼴에 umlauts (예 : ä, ü 및 ö)가 없으므로 (누락 된) 문자 대신 빈 칸이 표시됨을 알았습니다.

이 문제를 방지 할 방법이 있습니까? 누락 된 문자에 대해 다른 글꼴을 사용하도록 CSS에 알려주시겠습니까? 아니면 글꼴 자체를 편집해야합니까? 글꼴 파일을 리모델링 제외하고이 주변에 "쉽게", 또는 깨끗한 방법이 없기 때문에

Screenshot http://i40.tinypic.com/315y5jt.png

Answer 1

이를 방지 할 수있는 방법은 없습니다. 다른 글꼴을 사용하십시오. (구입 한 글꼴에 대해 더 높은 가격의 확장 버전이있을 수 있습니다.) 글꼴은 텍스트에 필요할 수있는 모든 문자 (최소한 모든 문자)가 포함되도록 선택해야합니다.

다양한 기술 (범위 설정이 가장 우아하지만 브라우저 지원이 제한적인 @font-face)을 사용하여 한 단어에 다른 글자에 다른 글꼴을 사용할 수 있습니다. 그러나 인쇄상의 재앙을 의미합니다. 특히 텍스트가 예를 들어. "ü"와 "u"둘 다 일반적으로 현저한 불일치가 있습니다.

글꼴 편집기 자체를 편집하는 것은 기술적으로 글꼴 편집기를 사용하는 것이 가능하지만 일반적으로 글꼴 라이센스 또는 해당 법률의 저작권에 대한 예외가 허용되지 않는 한 불법입니다.

Answer 2

는 여기 <span>로 확장 ASCII 문자를 대체하는 작은 JS 스크립트입니다. (정확하게 필요한 문자에 대해서만이 작업을 수행 할 수 있지만 지원되지 않는 다른 문자를 우연히 발견하면 다시 같은 질문을하게됩니다.)

예제 텍스트의 JS :

"Hêllo wörld. ÄÖÜßäöü".replace(/([\x80-\xff])/gi, '<span class="arial">$&</span>') 

결과 :

H<span class="arial">ê</span>llo w<span class="arial">ö</span>rld. <span class="arial">Ä</span><span class="arial">Ö</span><span class="arial">Ü</span><span class="arial">ß</span><span class="arial">ä</span><span class="arial">ö</span><span class="arial">ü</span> 

jQuery를 :

$('.webfont').each(function(){ 
    this.innerHTML = this.innerHTML.replace(/([\x80-\xff])/gi, '<span class="arial">$&</span>') 
}); 

,

.webfont의 노드는 텍스트 만 포함해야하지만 다른 대부분의 경우에도 작동해야합니다.