티스토리 반응형 스킨 설치 및 적용 후기 / Spider's Web

전세계적으로 모바일기기의 웹사이트 트래픽은 급격히 늘고 있고, 올해부터는 우리나라도 일반 PC 트래픽보다는 다양한 스크린 사이즈와 해상도의 휴대기기에서 발생할 것이라는 내용인데, 어린 학생부터 나이가 지긋하신 어르신들까지 스마트폰으로 인터넷을 사용하는 것이 전혀 낯설지 않은 현실입니다.

 

*본문의 내용이 많이 변경되었습니다. 블로그 검색을 통하여 반응현스킨 관련 다른 글을 찾아보시기 바랍니다.*

 

오늘은 그동안 생각만하고 미뤄왔던 블로그 스킨을 반응형 스킨으로 교체하였습니다.

아직 티스토리에서 반응형 스킨을 기본으로 제공하고 있지 않아서 다른 분들도 많이 사용하는  Markquery 님의 skeleton - Spider's Web 스킨을 사용하였습니다.

 

혹시 반응형 스킨으로 변경하실 생각이 있으시다면 현재 스킨을 꼭 저장하고 시작하세요.

*스킨을 변경하기 전에는 항상 현재 상태의 스킨을 꼭, 저장해야 한다는 사실, 변경 중에도 틈틈히 저장!*

 

저도 스킨을 받아서 설치하고 대충 맞춰서 사용할 줄은 알지만 남에게 이것 저것 알려 줄 처지는 아니니 그 부분은 위쪽에서 소개한 마크쿼리 커뮤니티를 참고하시고요, 본문에서는 반응형 스킨으로 바꾼 후 해상도에 따라서 변하는 블로그 모습과 Spider's Web 기본 내용 중에서 저에게 맞게 수정한 부분만 간단하게 언급하도록 하겠습니다.

 

일단 반응형 스킨으로 바꾼 후 블로그 화면입니다.

전체화면에서는 크게 달라진 모습이 보이지 않습니다. 구글 애드센스도 상단에 큰 직사각형 2개가 배치되어 있고요.

 

상단에 블로그 메뉴가 있고 우측에 사이드바가 배치된 모습입니다.

 

현재 화면에는 그 부분이 공백으로 보이는데 이 부분까지 없애면 모바일기기의 작은 화며에서 보면 메뉴가 본문 제목을 덮어버리는 현상이 발생하기 때문에

어쩔 수 없이 살려두었습니다.

 

그리고 기본 스킨에는 본문 제목줄에 포시팅 날짜와 글쓴이 정보가 표시되고 우측에 글꼴을 선택할 수 있는 드롭다운 단추가 있었는데, 드롭다운 단추는 제거하였고 날짜와 글쓴이 정보는 본문 하단으로 이동하였습니다.

한 개만 남기고 전부 합쳐지게 됩니다.

 

마지막으로 기본에서 변경한 부분은 위쪽에서 설명한 블로그이름 및 설명 부분은 제거하고, 글쓴이 표시와 시간은 본문 하단으로, 글꼴 선택부분은 제거하였습니다.