북클럽 스킨, 기본 텍스트 색상 문제
티스토리 블로그에서 북클럽 스킨을 사용하는 경우, 초기 설정 상태에서는 본문 글자색이 다소 연하게 설정되어 있습니다. 대체로 #555나 비슷한 회색 계열을 사용하는데, 이는 밝은 배경과 대비가 약해 글을 장시간 읽을 때 눈의 피로를 유발할 수 있습니다.
가독성과 글자색 대비의 중요성
웹사이트 가독성의 핵심 요소 중 하나는 충분한 명도 대비입니다. 글자색이 배경색과 명확히 구분되지 않으면 사용자는 읽는 데 불편을 느끼고, 이로 인해 페이지 이탈률이 증가할 수 있습니다. SEO 관점에서도 사용자 체류시간과 경험은 중요하기 때문에, 북클럽 스킨의 기본 글자색을 조정하는 것은 매우 전략적인 선택입니다.
티스토리 북클럽 스킨 글자색 변경 방법
1. 스킨 편집 모드로 진입하기
티스토리 관리페이지에서 '꾸미기' → '스킨 편집' → 'HTML 편집' 메뉴를 선택합니다. CSS가 담긴 style.css 파일을 열 준비를 합니다. 수정 전에는 항상 스킨 백업을 권장합니다.
2. 본문 글자색 수정 코드
style.css 파일에서 본문을 담당하는 클래스를 찾아 색상을 다음과 같이 변경합니다.
.post-content {
color: #222;
}
연한 회색(#555) 대신 짙은 회색(#222)을 사용하면 명도 대비가 높아져 가독성이 크게 향상됩니다. 경우에 따라서는 #111이나 #000에 가까운 컬러를 사용할 수도 있습니다.
글자색 변경 시 함께 고려할 사항
| 요소 | 기존 설정 | 권장 수정 |
|---|---|---|
| 본문 텍스트 | #555 | #222 |
| 링크 텍스트 | 기본 파랑 | #0056b3 (밝고 선명한 파랑) |
| 제목 텍스트 | #333 | #111 또는 #000 |
특히 링크 텍스트는 일반 본문과 명확히 구분되어야 하므로, 색상만 변경하는 것이 아니라 호버 효과도 함께 추가하는 것이 좋습니다.
링크 스타일 개선 코드 예시
a {
color: #0056b3;
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
이렇게 설정하면 링크가 명확하게 구분되고, 사용자가 원하는 정보를 쉽게 찾을 수 있습니다.
모바일 화면에서도 테스트할 것
글자색을 수정한 뒤에는 반드시 PC뿐만 아니라 모바일, 태블릿에서도 색상 대비 테스트를 진행해야 합니다. 화면 밝기나 기기별 색감 차이로 인해, 다르게 보일 수 있기 때문입니다.
최종 점검 포인트
- 본문 글자색이 배경색과 충분히 대비되는지 확인합니다.
- 링크 텍스트는 일반 텍스트와 확실히 구분되어야 합니다.
- 모바일 화면에서도 가독성이 유지되는지 테스트합니다.
- 변경 후 직접 블로그에 글을 올려 체감 차이를 비교해봅니다.
티스토리 북클럽 스킨 가독성 높이는 글자색 변경 방법은 간단하지만, 블로그 전반의 인상을 크게 좌우하는 중요한 작업입니다. 직접 수정해보고, 방문자 체류시간이 어떻게 달라지는지 관찰해보세요.
댓글