
다음과 같은 라이센스를 고려하십시오.
사용자가 설치하지 않고도 웹사이트에서 Ubuntu 글꼴 모음을 어떻게 사용할 수 있나요?
다음과 같은 도구와 함께 사용할 수 있습니다.http://code.google.com/intl/en-US/apis/webfonts/
답변1
웹사이트에 Ubuntu 글꼴을 삽입할 수 있는 두 가지 방법이 있습니다. Google 글꼴 디렉토리(권장)를 사용하거나 CSS @font-face
선언을 사용하고 글꼴을 수동으로 변환하는 것입니다.
Google 웹폰트 사용
이제 Ubuntu 글꼴을 Google 웹 글꼴로 사용할 수 있습니다. 이렇게 하면 프로세스가 훨씬 간단해집니다. 답변의 이 부분의 내용 대부분은 다음에서 비롯됩니다.슬라덴의 대답.
Google Font API를 사용하는 것이 선호되는 방법인 이유는 무엇입니까?
Google Font API를 사용하면 세부 사항에 대해 걱정할 필요 없이 웹 글꼴이 모든 최신 브라우저에서 자동으로 작동할 수 있으므로 훌륭한 제안입니다. 글꼴 API를 사용한다는 것은 방문자가 항상최신자동으로 서체 버전을 변경합니다.
Google 글꼴 API를 어떻게 사용할 수 있나요?
2010년 12월 21일부터 Ubuntu 글꼴 모음이 포함되어 Google Font API에서 배포할 수 있습니다. 다음 사이트를 방문하세요.
당신은 읽을 수있다Google 웹 글꼴 게시뉴스에 대해 다음과 같이 설명합니다.
Google 글꼴 디렉토리를 엽니다: "우분투 - 이 글꼴을 사용하세요" 페이지
다음의 조합을 선택하세요.가중치와 스타일웹 페이지에 필요한 일반, 기울임꼴, 굵게 및 굵은 기울임꼴 중 하나입니다.
기본값이 올바르지 않은 경우 다음을 선택하십시오.언어/스크립트 조합필요한 사항: 영어 예제가 있는 러시아어 웹사이트에서는 "Cyrillic,Latin"을 사용할 수 있습니다.
HTML 페이지 또는 템플릿 사이에 지정된
<link>
태그를 추가 하고 .<head> ... </head>
<style> ... </style>
<head>
예를 들어, 러시아어/영어 하이브리드 웹사이트를 만들고 해당 글꼴을 모든 텍스트의 기본값으로 사용하려는 경우
<head>
태그 사이에 다음 코드를 추가할 수 있습니다.<link href='http://fonts.googleapis.com/css?family=Ubuntu&subset=cyrillic,latin' rel='stylesheet' type='text/css' /> <style type="text/css" > body { font-family : 'Ubuntu', sans-serif; } </style>
노트:
"라틴어"는스크립트영어와 기타 많은 유럽 및 아프리카 언어가 작성되었습니다.
"하위 설정"은 특정 언어에 대한 문자만 전송하여 글꼴 파일을 최적화하며 글꼴은 각각 약 44kB입니다. 현재 표시된 168kB 수치는 단일 웹 글꼴 다운로드로서 1,200개 이상의 글리프 모두에 대한 것이며 대부분은 단일 웹 사이트에 필요하지 않습니다.
Ubuntu 글꼴 파일은 다양한 브라우저에 맞는 형식으로 자동 변환됩니다. 제조사와 버전에 따라 필요한 형식은 WOFF
, EOT
또는 SVG
입니다 TTF
. CSS의 올바른 조합은 각 페이지 요청에 따라 다르며 이 어려운 문제를 마법처럼 해결합니다.
@font-face 사용
Ubuntu 글꼴을 다음과 같이 포함할 수 있습니다.그것들을 변환하는 중에게WOFF 글꼴. 그런 다음 CSS @font-face 선언을 사용하여 이를 포함할 수 있습니다. 글꼴(.ttf 파일)은 에서 찾을 수 있습니다 /usr/share/fonts/truetype/ubuntu-font-family
.
예를 들어 WOFF 파일 Ubuntu-R.woff로 변환된 Ubuntu Regular 글꼴을 사용하려면 다음 CSS 코드를 사용합니다.
@font-face
{
font-family : "Ubuntu-R";
src: url('Ubuntu-R.woff');
}
Ubuntu Bold의 경우에도 유사합니다.
@font-face
{
font-family : "Ubuntu";
src: url('Ubuntu-B.woff');
font-weight : bold;
}
우분투 기울임꼴:
@font-face
{
font-family : "Ubuntu";
src: url('Ubuntu-I.woff');
font-style : italic;
}
우분투 굵은 기울임체:
@font-face
{
font-family : "Ubuntu";
src: url('Ubuntu-BI.woff');
font-weight : bold;
font-style : italic;
}
이는 모두가 지원합니다.최근 브라우저.
고려사항
일부 사용자는 특정 글꼴 세트를 사용하도록 브라우저를 설정하고 사용자 정의 글꼴을 사용하는 경우 짜증을 낼 수 있다는 점을 기억하십시오. 또한 다음 내용을 읽어보세요.우분투 글꼴 라이센스글꼴 배포 방법에 대한 정확한 용어는 다음과 같습니다.
답변2
Google Font API를 사용하면 세부 사항에 대해 걱정할 필요 없이 웹 글꼴이 모든 최신 브라우저에서 자동으로 작동할 수 있으므로 훌륭한 제안입니다. 글꼴 API를 사용한다는 것은 방문자가 항상최신자동으로 서체 버전을 변경합니다.
2010년 12월 21일부터 Ubuntu 글꼴 모음이 포함되어 Google Font API에서 배포할 수 있습니다. 다음 사이트를 방문하세요.
당신은 읽을 수있다Google 웹 글꼴 게시뉴스에 대해 다음과 같이 설명합니다.
- Google 글꼴 디렉토리를 엽니다: "우분투 - 이 글꼴을 사용하세요" 페이지
- 다음의 조합을 선택하세요.가중치와 스타일웹 페이지에 필요한 일반, 기울임꼴, 굵게 및 굵은 기울임꼴 중 하나입니다.
- 기본값이 올바르지 않은 경우 다음을 선택하십시오.언어/스크립트 조합필요한 사항: 영어 예제가 있는 러시아어 웹사이트에서는 "Cyrillic,Latin"을 사용할 수 있습니다.
- 복사해서 붙여넣으세요CSS 두 줄HTML 페이지나 템플릿의
<head> ... </head>
및 섹션 에 추가하세요 .<style>...</style>
노트:
"라틴어"는스크립트영어와 기타 많은 유럽 및 아프리카 언어가 작성되었습니다.
"하위 설정"은 특정 언어에 대한 문자만 전송하여 글꼴 파일을 최적화하며 글꼴은 각각 약 44kB입니다. 현재 표시된 168kB 수치는 단일 웹 글꼴 다운로드로서 1,200개 이상의 글리프 모두에 대한 것이며 대부분은 단일 웹 사이트에 필요하지 않습니다.
Ubuntu 글꼴 파일은 다양한 브라우저에 맞는 형식으로 자동 변환됩니다. 제조사와 버전에 따라 필요한 형식은 WOFF
, EOT
또는 SVG
입니다 TTF
. CSS의 올바른 조합은 각 페이지 요청에 따라 다르며 이 어려운 문제를 마법처럼 해결합니다.
답변3
서버 측 글꼴 렌더링(더 나은 "동적 글꼴 렌더링")은 꽤 오랫동안 흥미로운 문제였습니다.
기술적으로, 컴퓨터가 특정 글꼴을 표시하려면 해당 글꼴이 이미 로컬에 설치되어 있어야 한다는 것이 논리적인 것 같습니다.
반면에 웹 디자인은 기본/잘 알려진 '웹 글꼴'을 고수해야 하므로 많은 것을 잃습니다.
CSS2.1은 다음을 사용하여 몇 가지 개선을 이루었습니다.@글꼴-얼굴규칙선언.
아직 표준이 되지는 않았지만 결국에는 CSS3가 표준이 될 것입니다.
그 외에도 다음과 같은 몇 가지 대체 방법이 있습니다.
제공된 링크를 통해 수행할 수 있는 작업에 대한 더 나은 아이디어를 얻을 수 있기를 바랍니다. ;-)