티스토리 스킨 제작 개요
적절한 스킨을 만나면 평균 세션 시간을 높여주고, 효율적인 광고로 수익을 높일 수 있고, 블로거가 마주하는 일부 문제를 해결
해 줄 것이라 예상합니다. 저는 비전공자로 하나씩 알아가면서 스킨을 만드는 과정을 진행해서 오류가 많을 수 있으니 참고로 봐주세요.좋은 블로그가 되기 위해 필요한 사항
이 블로그는 내가 작성할 수 있는 기술 관련 자료나, 내가 잘 사용하는 생산성 향상 도구 및 자료를 되도록 시리즈 물로 제작할 목적으로 개설하였습니다. 공통적인 사항이 대부분이지만, 이런 테마에 맞는 블로그가 수익이 좋은 블로그가 되기 위해 필요한 사항은 정리하면 아래와 같습니다.
- 양질의 콘텐츠
- 양질의 콘텐츠를 쉽게 이해 할 수 있도록 작성
- 높은 방문자 수
- 양질의 콘텐츠를 잘 검색 될 수 있도록 제목, H태그, 본문 키워드 잘 쓰기
- SEO 충실하기 - 전문 기술이 요구됨??, 티스토리는 한계가 있음??
- SNS를 이용한 유입 만들기
- 높은 평균 세션 시간
- 타이틀 키워드와 맞는 본문을 작성
- 로딩 속도 높이기
- 관련된 링크를 잘 표시 해줄 것
- 기술 자료의 경우 사전 지식과 관련된 글, 이후 연결된 글로 잘 유도
- 비슷한 주제, 관심 가질만한 글을 잘 유도
- 효율적인 광고 배치
- 최적의 광고 배치로 CTR 높이기
- 최적의 광고 배치를 찾기 위해 실험 할 수 있는 편리한 환경 필요
위에서 언급한 4가지 중에서 나에게 맞는 스킨이 있으면 이용자 평균 세션을 높여 주고, 내가 원하는 대로 광고를 배치하는 데 많은 도움이 될 것이라 예상됩니다.
블로그 운영에 마주하는 문제
저를 포함하여 블로그를 운영하는 사람의 대부분은 웹 프로그램 지식이 없기 때문에 공통으로 아래의 문제점을 마주할 것으로 생각됩니다.
- 적합한 스킨을 찾기 어려움
- 주 접속기기가 PC인지 모바일인지에 따라 적절한 레이아웃을 가지는 스킨
- 포스팅하는 주에게 맞는 커버의 형태, 리스트의 형태
- 소소하게 변경하고 싶은 디자인
- 원하는 대로 광고 배치 어려움
- 티스토리 플러그인이 있지만, 자유자재로 사용하기에는 한계가 있음
이 블로그의 특징과 나에게 필요한 스킨
PC화면에 적합한 스킨
이 블로그는 PC 접속자와 모바일 접속자의 비율이 9:1 정도로, PC접속자가 월등히 높습니다. 일반적으로 PC 접속자가 모바일 접속자보다 CPC가 아주 낮습니다. 즉, 이런 유사한 형태의 키워드 글은 PC 유입이 높기 때문에 수익으로 연결되기 어렵다고 판단하였습니다. 그래서 더욱 PC화면에 적합한 스킨이 필요하다고 생각했습니다.
티스토리에는 에드센스, 애드핏 외 다양한 광고를 직접 넣을 수 있습니다. 회사마다 광고 운영 규정이 차이가 납니다. 화면 고정 광고(Fixed, Sticky)가 허용되는 곳도 있고, 안되는 곳도 있습니다. 3단 스킨 2개의 사이드바 중 1개의 사이드바 일부를 Sticky 영역으로 지정하고 고정 광고도 함께 노출하거나, 이후 개인 수익을 창출 할 수 있는 배너를 추가 할 수 있는 환경이 필요합니다.
적절한 링크 노출
이 블로그의 포스트는 대부분 연관된 주제를 작성할 예정으로, 크게 두 가지 정도의 기능이 필요합니다. 하나는 각 전체 시리즈에서 이 글이 어느 정도에 있는지 표시해 주는 기능이고, 다른 하나는 본문의 시작 또는 끝나는 시점에 관련된 글(사전 지식, 다음 글, 관련된 관심사 주제의 포스트)를 불편하지 않은 범위에서 노출하는 기능입니다.
빠른 로딩 속도
빠른 로딩 속도를 가지는 블로그를 만들기 위해 프로그램 기술이 요구되지만, 아직 아무것도 모르는 지금의 실력으로는 어림없습니다. 하지만, 스킨을 제작하면서 스킨을 꾸미기 위해 그림을 사용하지 않고, 폰트도 1개만 쓰고, 아이콘도 아무것도 쓰지 않는 등 할 수 있는 것을 하게 되면 그래도 타 스킨과 유사한 속도 정도 만드는 것은 문제가 없을 것이라 예상됩니다.
원하는 대로 광고 배치
티스토리 스킨을 직접 만들면, 일단 소스 구조가 내 머릿속에 있으니까 원하는 대로 광고 배치가 가능할 것 같습니다. 스킨을 만들면서, 티스토리 스킨 가이드를 잘 이해하면 코드가 아닌 스킨 편집 옵션에서도 편리하도록 구현이 가능할 것으로 예상됩니다.
나의 한계점과 해결 방안
스킨을 제작하기로 마음을 먹고 아주 주요한 2가지 문제는 아래와 같습니다.
- 웹 프로그래밍을 할 줄 모름, 경험도 없음
- 디자인과 동떨어져 살아온 나의 인생
티스토리를 시작하면서 기본적으로 스킨 수정하는 법을 알아야겠다고 생각해서 '생활코딩!HTML+CSS+자바스크립트'책을 한번 읽어 본 것이 웹 프로그래밍 관련의 전부입니다. 이 한 권으로는 어림없지만, 유튜브와 구글이 있어서 차근차근히 해나가면 되리라 생각했습니다.
디자인에 대한 문제는 '모방은 창조의 어머니'라고 생각하기 때문에 여러 프로그램과 웹사이트를 벤치마킹하면 어느 정도 봐줄 만한 디자인이 가능할 것이로 생각했습니다.
스킨 제작 방향
웹프로그래밍 관련 능력이 없기 때문에, 내가 원하는 모든 기능을 가진 스킨을 만들기 어렵다고 판단되어 두 가지 단계로 나누어서 진행하였습니다.
- Step1: HTML+CSS+(아기 수준의)Javascript
- 3단 레이아웃 구성
- 기초 디자인 확정 및 구현
- 티스토리 기본 사이드바 기능 구현
- Step2 : HTML+CSS+(어느정도의)Javascripts 필요
- 홈 커버 제작 - Step2 정도를 진행 할 때에는 어느 정도 다양한 주제의 많은 글이 있을 것으로 예상
- 적당한 타이밍과 적당한 위치에 관련 링크 노출
- 현재 글이 전체 연관 포스트에서 어느 위치인지 가이드 해주기
- 영역별 광고 처리 옵션 편하게 만들기
- 로딩속도 최적화
마무리
나에게 적합한 스킨을 직접 만들게 된다는 가정하게 기대되는 효과는 아래와 같습니다.
- 평균 세션 시간 높이기, 이탈율 낮추기 - 적절한 링크
- 원하는 곳에 원하는 광고를 쉽게 노출하는 기술적 문제 해결
- 여러 광고 배치 실험으로 CPC를 높일 수 있는 광고 배치를 찾을 수 있음
- SEO 개선을 위한 변경 사항을 쉽게 적용 가능
하지만, 원하는 대로 좋은 스킨을 만들 수 있을지와 만든다고 하더라도 그 효과가 있을지는 미지수입니다. 스킨 수정을 이것저것 하다 보니 흥미가 생겨서 하게 되었습니다.
끝까지 읽어 주셔서 감사합니다.😄
'Tistory' 카테고리의 다른 글
| #3 티스토리 스킨 제작 레이아웃 구상 Part.2 사이드바, 본문 활용 방안 (4) | 2020.11.23 |
|---|---|
| #2 이탈율 감소, 체류 시간을 높이는 레이아웃 구상 Part.1 구현 방향과 헤더 영역 (0) | 2020.11.23 |
| 구글 무료 저작권 이미지 검색 팁 - 크레이티브 커먼즈 라이선스(CCL) 필터링 (3) | 2020.09.05 |
| 티스토리 2달 운영 후기 - 방문자, 문제점, 수익, 개선 방향 (11) | 2020.08.30 |
| 티스토리 구글 애드센스 광고가 지정된 영역을 이탈하는 문제점 임시 조치 (2) | 2020.08.24 |