블로그 본문! 글자 크기를 얼마로 쓸까?

사는이야기 2018. 12. 5. 10:17
반응형

블로그 스킨을 바꾸면 고치고 싶은 부분이 눈에 띈다. 그 가운데 본문에 쓰는 글꼴과 크기가 있다. 블로그 본문에 가장 좋은 글꼴과 크기는 뭘까? 사람마다 느낌은 다르니까 정답은 없다. 블로그 본문은 쉽게 읽을 수 있어야 한다고 생각한다. 개인적으로 나이가 들어 노안이라서 작은 글씨는 눈에 잘 들어 오지 않는다. 가독성을 높이기 위해 현재 쓰고 있는 스킨(Poster)도 본문 글씨를 바꿨다.

.entry-content {
padding:0px;
font-size : 1.0em ;
font-family: Source Serif Pro, Nanum Myeongjo, NanumGothic, malgun gothic ;
color : #333;
line-height : 2.0;
margin-bottom : 20px;
width : 100%;
}

글자 크기는 font-size: 1.0em;, 줄 간격은 line-height: 2.0;으로 했다. 글자 크기만 키우고 줄 간격을 그대로 두면 너무 빽빽해서 오히려 쉽게 읽을 수 없게 된다. 글꼴은 바탕체로 많이 쓰는 나눔명조로 바꿔 놓았다. 대체로 고딕을 많이 쓰는데 난 명조가 더 좋다. 으로 쓴 수식이 명조체로 나오기때문에 본문도 명조체가 잘 어울려 보인다.

글자 크기를 나타내는 CSS 단위는 여러 가지다.

1. pt (points) 1pt=0.72인치로 절대 크기

2. px(pixels) - 화면 해상도에 대한 상대 크기

3. em, % - 물려 받은 속성 크기에 대한 상대 크기

요즘은 반응형 스킨이 대세이므로 em으로 쓰는 것이 좋다고 한다. 피씨에서 잘 보이다가 모바일로 보면 글자가 너무 작거나 커서 모양이 헝클어지는 것은 pt를 써서 그런 것이다. 각 단위 사이의 관계는 아래 고리를 참고하면 된다.

참고 : http://jsunnylab.tistory.com/24

https://reeddesign.co.uk/test/points-pixels.html

반응형