블로그에 글을 작성할 때 가장 중요한 요소는 가독성이라고 생각합니다. 가독성에는 여러가지 요소가 있겠지만, 어떤 폰트를 쓰느냐에 따라 방문자의 체류 시간을 늘릴수 있습니다. 읽기 편하고 가독성 높은 글꼴을 선택하는 것은 정말 중요한 일입니다. 티스토리 기본 폰트는 크기가 작은 것 같고, 가독성이 약간 떨어지는 듯 하여 폰트를 변경해보고자 합니다.
현재 폰트 문제점은 무엇인가?
자신의 블로그에 사용되고 있는 폰트를 먼저 점검해야합니다. 제가 운영하는 폰트는 기본적으로 너무 작아서 잘 보이지 않네요. 글꼴도 가독성이 살짝 떨어지는 것 같구요. 폰트뿐만 아니라, 글자색도 변경하는 것이 좋겠습니다. 글자색은 검정색보다는 진한 회색으로 변경하는 것이 좋을 듯 하구요.
폰트 선택
많은 폰트중에 어떤 폰트를 선택해야 할까요? 정말 어려운 문제입니다. 한글 문서를 작성할 때에도 폰트는 정말 중요합니다. 저는 네이버 폰트가 마음에 들더라구요. 네이버폰트는 무료로 사용할 수 있으므로, 원하시는 네이버 폰트를 선택하시면 될 것 같습니다. 네이버 폰트중에서도 나눔스퀘어 시리즈를 살펴볼까합니다.
나눔스퀘어 폰트 시리즈가 예쁘고, 가독성도 높아서 사용하는 파워블로거도 많습니다. 여러분들도 아래 그림을 보시고 원하시는 폰트를 선택하십시요.
폰트 설치 방법
1. 웹링크 설정
티스토리에 사용할 폰트를 외부 링크로 걸어서, 그 파일의 링크를 불러들이는 방식으로 사용합니다. 폰트가 저장되어 있는 서버에서 폰트 파일을 불러들이는 방식입니다. 스킨편집에서 단순히 코딩만 추가하면 되기 때문에 간편합니다. 하지만 단점도 존재합니다. 먼저 폰트파일을 서버에서 불러들이는 데 시간이 오래 걸릴지도 모릅니다. 또한 그 서버가 언제 종료될지 모르기 때문에 불안한 상태로 운영해야 합니다.
2. 티스토리 폰트 설치
티스토리에 폰트를 설치하는 방법입니다. 티스토리에 저장된 폰트 파일을 사용하기 때문에 안정되게 폰트를 사용할 수가 있습니다. 이 방법은 웹링크 설정 방법보다 조금 더 복잡하지만, 안정적으로 계속적으로 폰트를 사용할 수 있으므로 오래 운영하실 계획이라면 티스토리에 폰트를 설치하는 방법이 좋습니다.
저는 티스토리에 폰트를 설치하는 방법으로 진행하도록 하겠습니다. 한 번만 해보면 금방 따라하실 수 있을 거에요.
나눔스퀘어 네오 폰트 적용
1) 나눔스퀘어 폰트 다운로드
먼저 원하시는 나눔스퀘어 폰트를 다운로드 합니다. 나눔스퀘어 폰트는 크게 위의 3가지가 있구요. 세부적으로는 위 그림처럼 여러가지가 있습니다. 티스토리에 너무 많은 폰트를 업로드하면 블로그가 느려지기 때문에, 사용하실 폰트만 업로드하는 것이 좋습니다. 저는 이번에 새로 발표된 나눔스퀘어 네오 Regular 폰트를 설치해보겠습니다.
총 5개의 파일을 따로 업로드해야 합니다. 5개가 아닌 폰트도 있으니, 존재하는 파일 종류대로 올리시면 됩닏. 컴퓨터 운영체제, 브라우저 등에 따라 다른 파일이 필요하기 때문에 5개 모두 업로드해주세요. 예를 들어 ttf 확장자는 모두 Mac과 Windows 플랫폼에서 사용 애플에서 만든 글꼴 파일 형식입니다.
2) 나눔스퀘어 네오 폰트 업로드
티스토리 관리자 → 꾸미기 → 스킨변경 → 스킨편집 → html 편집 → 업로드로 이동합니다. 아래 추가 버튼을 눌러 다운받은 5개의 파일을 업로드합니다.
업로드하고 반드시 적용을 눌러주세요.
3) CSS 수정하기
파일을 업로드하여쓰면, CSS 메뉴로 이동하여 아래 코드를 맨처음 @charset "utf-8"; 아래에 추가하여 주시면 됩니다.
|
@font-face {
font-family: 'NanumSquareNeoR';
src: url(images/NanumSquareNeoTTF-bRg.eot);
src: url(images/NanumSquarNeoR?#iefix) format('embedded-opentype'),
url(images/NanumSquareNeoTTF-bRg.woff2) format('woff2'),
url(images/NanumSquareNeoTTF-bRg.woff) format('woff'),
url(images/NanumSquareNeo-bRg.ttf) format('truetype');
}
|
또한, CSS 내에서 font-family 를 찾아서, 기존 글자체를 'NanumSquareNeoR'로 변경합니다. CSS에는 이런 font-family가 몇 군데 있으니 모두 수정해주시면 됩니다. 저는 북클럽 스킨을 사용중인데 3군데 정도 됩니다.
마무리
성공적으로 네이버폰트의 나눔스퀘어 네오 Regular 폰트를 적용하였습니다. 약간 고딕체에 필기체를 섞은 느낌입니다. 일단 하나의 블로그만 적용해보고, 반응이 좋으면 나머지 블로그도 적용해보도록 하겠습니다.
'수익형 블로그 만들기 > 티스토리' 카테고리의 다른 글
| 티스토리 블로그 포스팅 글 본문 작성 날짜 삭제하는 방법 (0) | 2022.12.15 |
|---|---|
| 수익형 블로그 티스토리 다음(Daum) 저품질 방지 및 최적화 방법 (0) | 2022.12.06 |
| [티스토리 블로그 만들기] 비실명 지메일-카카오계정으로 회원 가입 방법 (0) | 2022.12.05 |
| 티스토리 포스팅 글 작성 날짜 시간 업데이트 방법 (0) | 2022.11.27 |
| 검색 최적화(SEO)를 위한 티스토리 그림 사진 이미지 alt 속성 태그 입력 방법 (1) | 2022.11.26 |
| 티스토리 에디터 제목1~제목3(H태그)와 본문1~본문3 문단 모양 작성 방법(구글 SEO) (0) | 2022.11.24 |
| 티스토리 블로그 북클럽 스킨 목차 자동으로 넣기 (0) | 2022.11.23 |
| 티스토리 북클럽 스킨(뉴북) 썸네일 정사각형으로 변경하기 (1) | 2022.11.22 |
댓글