웹사이트의 글씨를 더 예쁘고 실용적으로 불러오는 방법
실무도구 / by 코기토 / 작성일 : 2015.01.27 / 수정일 : 2020.06.16
웹사이트를 운영하는 사람이라면 누구나 좀 더 예쁜 글씨로 화면을 꾸미고 싶은 욕구를 가지고 있습니다. 하지만 자칫 너무 복잡하고 화려해지거나, 웹표준에 맞지않은 소스를 사용하는 바람에 기기에 따라 제대로 글씨가 보이지 않는 경우도 있지요. 이런 문제를 줄이고 사용자도 운영자도 만족할 수 있는 실용적인 사이트를 만들기 위해 한번쯤 찬찬히 읽어보고 연습해볼만한 자료를 소개합니다.

 
CSS와 HTML, 그리고 워드프레스의 기본과 활용법을 안내하는 Beautiful Css에서는 "웹폰트 파헤치기"라는 글을 통해 폰트의 기본 개념과 속성, 활용방법을 안내하고 있습니다. 

웹 폰트는, 방문자의 로컬 컴퓨터에 서비스 제공자가 원하는 서체가 없을 경우, 온라인의 특정 서버에 위치한 서체 파일을 내려받아 화면에 표현할 수 있도록 해주는 웹 전용 서체입니다. 이 새로운 CSS3 규약을 사용하면 원하는 서체를 스타일시트의 @font-face에 등록하고, font-family 속성을 통해 문서 안에서 자유롭게 사용할 수 있습니다.

하지만 실제 웹페이지들은 웹 초기에 만들어진 낡은 규약과, 브라우저 별로 다르게 정의되는 속성들 때문에 원하는 대로 잘 표현되지 않는 경우가 많습니다. 또한 어떤 서체와 소스를 사용하느냐에 따라서 페이지의 로딩 속도가 현저하게 차이가 나기도 합니다.

최근에는 모바일 접속량이 급증하면서 모바일 기기에서도 자연스럽게 출력되도록 세팅하는 것이 중요해졌습니다. 그리고 한글 폰트는 폰트 이름을 표기하는 방식에 따라서도 인식에 문제가 생기기도 합니다.

사용자의 요구가 많아지고, 개발상의 문제가 계속 드러나면서 브라우저 및 모바일 기기 제조사들이 웹 표준을 준수하려는 모습을 점점 더 보이고 있지만, 무엇보다도 사이트 제작 시에 이런 요소를 잘 이해하고 가장 효과적이고 합리적인 코드를 사용할 필요가 있습니다.


작성자 : 코기토 / 작성일 : 2015.01.27 / 수정일 : 2020.06.16 / 조회수 : 23471

코멘트를 달아주세요!



 목록으로