[블로그] 티스토리 반응형 스킨 적용후 변화 및 애드센스 수익

※ 요약

필자는 얼마 전까지 티스토리에서 지원해주는 Life In Mono 스킨을 사용하다가 16년 05월 14일 날 toDiava님이 제작한 toPiece라는 스킨으로 교체했다. 스킨 교체는 거의 3~4년 만에 한거 같은데, 오랜만에 스킨을 바꾸다 보니 준비할 것도 많았고 예상치 못한 것도 있어서 정리하여 글로 남기고자 포스팅한다. 그래야 다음번에 고생을 덜 하므로.

※ 스킨 교체 이유

필자는 2010년 6월부터 블로그를 시작하였다. 이때만 해도 모바일 기기가 별로 없었는데, 시간이 지날수록 모바일 유입이 많아지다 보니 요즘 대세인 반응형 스킨을 고려하게 되었고, 마음에 드는 스킨이 있어서 적용하게 되었다. 물론 스킨을 바꾸면 방문자가 줄어든다든지, 수익이 줄어든다든지 하는 말이 있었지만 언젠가는 바꿔야 하기에 교체하기로 마음을 먹었다.

※ 스킨 교체 절차 개요

1. 반응형 스킨 선택

2. 임시 블로그에 선택한 스킨 테스트

3. 메인 블로그 백업

4. 메인 블로그에 스킨 적용

5. 애드센스 적용

6. 소스 코드 하이라이터 적용

※ 절차1 - 반응형 스킨 선택

반응형 스킨을 선택하는데 한 달 정도 걸린 거 같다. 마음에 드는 것도 별로 없었고, 절실하게 찾지도 않았고, 여유 있는 마음으로 찾다 보니 한 달이나 걸렸다. 스킨을 적용한 지금도 새로운 스킨을 찾고 있다.

※ 절차2 - 임시 블로그에 선택한 스킨 테스트

필자가 선택한 반응형 스킨 후보는 3개 정도였다. 소스코드를 수정해가며 3개를 번갈아가며 테스트했고 애드센스 및 기타 소소한 부분까지 테스트하려고 노력했다. 테스트한 기간은 4일 정도다. 

※ 절차3 - 메인 블로그 백업

스킨도 선택했고 테스트도 끝났겠다 이젠 적용만 하면 되는데, 혹시 몰라 메인 블로그 스킨 관련된 것들을 백업했다. 백업한 것들은 아래와 같다.

- skin.css

- skin.html

- 사이드바 설정

- 플러그인 설정

- 화면 설정

백업한 것들은 실제로 새로운 스킨 적용 후 몇 번 참고 하였으므로 필히 백업할 것을 권장한다.

※ 절차4 - 메인 블로그에 스킨 적용

소스 코드가 수정되었고 테스트도 끝난 스킨을 메인 블로그에 적용했다. 별 문제 없이 잘 적용되었다.

※ 절차5 - 애드센스 적용

3~4년 전에는 html 코드에 직접 애드센스 코드를 사용자가 넣어줬었는데, 요즘은 플러그인으로 되어 있어서 바로 적용했다. 단, 플러그인으로는 본문에만 애드센스가 적용되므로 글 목록 상하나 사이드바, 기타 필요한 곳에는 html 코드에 직접 넣어주었다. 물론 테스트할 때 코드에 직접 넣어주었으므로 스킨 적용 후에는 수정하지는 않았다.

※ 절차6 - 소스코드 하이라이터 적용

필자는 개발자라 코드 하이라이터를 적용했다. 물론 새로운 것들이 많았지만 기존에 올린 글들의 호환성을 생각하여 기존 것을 버전업만 하여 적용했다.

※ 스킨 적용후 변화

스킨 변경으로 인한 방문자 변화는 없는 거 같다. 스킨 변경 전부터 방문자는 조금씩 늘고 있었고, 변경 후에도 조금씩 늘고 있는 중이다. 이렇듯 방문자는 변화가 거의 없는 반면 애드센스 수익은 50% 정도 감소했다. 물론 필자는 애드센스 수익이 별로 없는 편이므로 50% 하락했다 하여도 그렇게 마음이 아프지는 않다...... 아무튼 광고 위치가 잘못된 거 같아 조금씩 수정하고 있는 중인데 아직 채 2주가 안됐으므로 좀 더 지켜볼 생각이다.

※ 스킨 변경전 마지막 블로그 모습

스킨 적용 전 블로그 메인 모습이다. 몇 년간 써온 모습이라 저장할 겸 올려둔다.