새해 첫날의 첫 글이다. 첫 글도 블로그 스킨 수정 진행 사항에 관한 글이다.
스킨 수정의 과정을 글로 남겨 놓는 이유는 거창하지만 내 블로그의 역사?이기도 하고 수정시 확인할 일이 생기기도 해서 나 자신에게도 여러모로 쓸모가 있다. 현재 사용하는 스킨은 CCZ-CROSS 이다. 이제 이 스킨을 사용한지도 만 1년이 되었다. 처음 이 스킨을 적용하고 거의 모든 곳을 수정했다. 원래 스킨의 흔적은 몇군데 남지 않았을 정도이다. 그래도 기본 베이스가 잘 되어 있어 수정해서 사용하기에 아직까지 이만큼 내게 잘 맞는 스킨이 없는거 같다.
요즘은 블로그의 사이드바 부분을 집중적? 으로 수정중에 있다. 티스토리에서는 사이드바를 통해 프로필, 달력, 카운터, 글보관함, 링크, 태그 등 수많은 모듈을 제공하고 있지만 현재 이 블로그의 사이드바에는 카테고리와 최근글 & 최근 댓글 만 사용하고 있다. 고정된 사이드바가 모니터 화면을 벗어나지 않게 하려다 보니 필수적인 모듈만 추가했다.
사용중인 카테고리와 최신글 & 최근댓글은 마우스 오버 효과나 아이콘 폰트 추가 등 그동안 꽤 많은 수정 과정을 거쳤고 크게 부족함이 없이 사용중이다. (사진1, 사진2) 불편하지는 않지만 그래도 뭔가 계속 더 나은 디자인과 효과를 적용해보고 싶은 마음이 생긴다.
 사진1. 카테고리 - 변경전 |  사진2. 최근글 - 변경전 |
1 카테고리 게시글 수 및 최근글 댓글 수 - 괄호 삭제
티스토리에서 카테고리의 게시글 수와 최근글의 댓글 수 치환자는 괄호안에 그 숫자를 표시한다. 괄호가 보기에 나쁘지는 않지만 그래도 뭔가 좀 더 남들과는 다르게..그리고 더 화려(?) 하게 보이게 하고 싶어졌다. 누군가의 시선에는 나의 취향을 별로라고 생각할 수도 있다. 하지만 남의 시선과 취향 따위는 내게 중요하지 않다. 우선 내가 마음에 들어야 한다.
우선 각 위치의 치환자별로 스크립트를 이용해 괄호를 우선 삭제했다. 괄호 삭제 방법에 관한 글은 인터넷에 검색하면 쉽게 찾을 수 있다.
2 카테고리의 게시글 수 - 배경색 추가
카테고리의 게시글 수 부분 꾸미기에는 삭제한 괄호 대신 테두리를 적용해 보기도 하고 바탕색을 입혀보기도 했다. 사진3. 직사각형 테두리 적용 |  사진4. 반곡선형 직사각형 테두리 |
 사진5. 곡선형 테두리 |  사진6. 곡선형 바탕화면 |
색상과 테두리의 모양도 변경해보고 배경색도 추가해보고 여러가지를 실제 적용해서 비교해보니 배경색을 입힌 경우가 가장 마음에 든다. (사진6)
최근글 모듈에서 사용중인 글 순서의 핑크색과 함께 일체감과 균형감이 느껴져 자연스러워 보인다.
3 최근글의 댓글수 - Emoji 아이콘 추가
최근글의 댓글수 부분에는 삭제한 괄호 대신 앞에 이모지 (Emoji) 아이콘을 삽입했다. 카테고리와 같은 방법을 사용하기에는 너무 단조롭다.
아이콘의 새로운 발견 이모지 Emoji 의 가능성과 한계
4 기타 변경 사항
사이드바 외에도 여기저기 아주 소소하게 수정된 부분들이 있다.
1) 회전 로고 변경
블로그의 상단 메뉴바 부분에 원 모양의 아이콘 폰트를 회전시키던 로고를 아이콘 폰트를 사용하지 않고도 비슷한 효과를 낼 수 있는 CSS를 적용했다.
2) 방명록 원형 바탕 변경 & 설정 아이콘 회전 효과 변경
3) 댓글 수 바탕 모양 변경
이제 CSS 로 원 만드는 방법에 대해 조금은 익숙하게 되었다. 전에는 padding 값을 이용해서 원을 만들어 사용했는데 폰트 크기가 변경되거나 10자리 숫자인 경우 원 모양이 제대로 표현이 되지 않아서 사용하기 불편했다. 현재는 width 와 height 값 그리고 line-height 를 이용해 원을 만들어 사용중이다. 폰트 크기가 바뀌어거나 2자리, 3자리 이상의 숫자가 되어도 원의 형태가 그대로 유지되어 앞으로 자주 활용하려고 한다.
