'웹폰트'란 웹페이지를 보는 사람의 컴퓨터에 글꼴이 설치 되어 있지 않아도, 임시로 글꼴을 받아 웹페이지에서 볼 수 있도록 하는 폰트의 한 종류라고 합니다. 


예전에 "블로그 웹폰트(나눔고딕) 업로드 없이 변경해보자!라는 포스팅을 했던 적이 있는데요^^ 


말그대로 업로드 없이 변경하는 방법이었기때문에..해당 폰트가 컴퓨터상에 깔려있지 않다면 원하는 폰트가 아닌 다른 폰트가 보여지게 되는 단점이 켰죠..



그리고 어떤분은 글 제목만 봤는지..'웹폰트'가 아니라 웹폰트는 어떤거다는 식으로 자꾸 누구를 가르칠려는 듯이 댓글을 막 달길래 정말 기분나빴던 기억도 나네요(해당 리플을 삭제함) 


아무튼 이번에는 블로그 웹폰트(나눔고딕)를 확실히 적용하는 방법에 대해서 알아보도록 하죠~ 해당 폰트를 블로그에 업로드 하는건 당연히 필수에요~


먼저 아래에 있는 첨부화일을 다운받으시고 압축을 풀어주세요~~


나눔웹폰트.zip


총 3가지의 웹폰트가 들어있습니다..나눔고딕,나눔손글씨,나눔펜글씨 이미 웹폰트용 화일로 변환된 거라서 따로 다시 변환할 필요없어요~~확장자가 eot,woff가 있는데 모두다 업로드 하시면 되구요~



티스토리 블로그 설정관리에서 html/css 로 들어가면 오른쪽에 파일업로드라는 부분이 보입니다..거기서...미리 준비된 웹폰트 화일을 추가시켜주면 되는 것이죠^^


그리고 가장 중요한 사항은 아래에 있는 내용을 html/css에 첨부해야 합니다..


@font-face {font-family:NanumGothic;

src: url(./images/NanumGothic.eot);

src: local("나눔 고딕"), url(./images/NanumGothic.woff) format("woff");}


역시 아래에 문서 화일로 첨부하니 그대로 복사해서 붙여넣기 하시면 됩니다^^


블로그 웹폰트(나눔고딕) 업로드 적용하기.txt


블로그 웹폰트(나눔고딕) 업로드 적용하기




티스토리 블로그 관리메뉴에서 html/css 하단에 보면 style.css에 해당 내용을 복사해서 붙여넣기하고 저장만 하면 끝! 그럼 웹폰트가 제대로 적용이 되었는지 한번 확인을 해봐야겠죠? 


예전에 웹폰트를 업로드 하지 않고 나눔고딕체가 보이게 하는 방법을 쓰게 되면..컴퓨터가 같아도 인터넷 웹브라우저가 다를 경우...웹폰트가 다르게 보이는 경우가 있더라구요~



구글 크롬에서 보이는 웹폰트(나눔고딕)



익스플로러에서 보이는 웹폰트(나눔고딕)


어떤가요? 글씨체가 모두 나눔고딕을 보이시죠?..역시 다른 컴퓨터에서도 문제없이 나눔고딕체로 보이는걸로 봐서 제대로 적용이 된듯하네요^^ 


예전에는 업로드 없이 나눔고딕체가 보이게 하는 방법을 알려드렸는데 그 방법보다는 이 방법이 진짜 제대로 된 방법이겠죠..진짜 '웹폰트'를 업로드하는 방식이니까~


그리드형