티스토리 반응형 스킨 베스트 5

티스토리 반응형 스킨

티스토리 블로그를 운영하는 블로거들은 모두 같은 생각을 하고 있을 겁니다. 아마도 말입니다. 자신이 운영하는 블로그에 가장 좋은 반응형 스킨을 사용하고 싶어할 겁니다. 보기 좋아야 하는 것은 기본이고, 다양한 기능을 이용할 수 있는 스킨을 원하죠. 여기에 추가로 로딩 속도도 빠르고, 다음 검색, 구글 검색, 네이버 검색 최적화가 되어 있는 반응형 스킨을 사용하고 싶어할 겁니다. 적어도 몽리넷은 그렇습니다.


속도도 빠르고 네이버 검색 최적화가 되어 있으면 다른 것은 정말 없어도 될 것 같은 생각인데요. 사람 욕심이란 것이 끝이 없죠. 속도 빠르고 네이버 검색 잘되면 십중팔구 스킨에 이것 저것 덕지 덕지 삽입하게 됩니다. 사실 여기까진 큰 문제가 없죠. 불필요한 소스는 언제든 제거할 수 있으니 말입니다. 그런데 애당초 설계가 잘못되어 있는 스킨들은 답이 없습니다. 조금 뜯어 고쳐 쓸 수 있는 상태가 아니니 말입니다. 건물에 비유하자면 초석이 잘못 다져진 집이죠. 모래위에 짓은 집에서 사는 것은 너무 위험합니다.


반응형 웹 디자인


그래서 약간의 수정 작업만으로도 몇 년 잘 쓸 수 있는 티스토리 반응형 스킨들을 뽑아 보았습니다. 베스트 5이지만 순위는 없습니다. 숫자는 붙였지만 단순 넘버링일뿐이네요. 그리고 순전히 주관적인 견해로 뽑은 것이니 참고 정도만 하시기 바랍니다.


1. CCZ-CROSS 스킨

티스토리 반응형 스킨 CCZ-CROSS


CCZ-CROSS 스킨(최신 버전은 1.2.2.fix)입니다. 무료로 배포되는 스킨이고요. 3가지 크기(768, 992, 1281)에 대응하는 적응형 스킨인데, 대응이 반응형 스킨에 가깝습니다. 웹과 모바일 모두에서 대응이 됩니다.


CCZ-CROSS 스킨 구조


CCZ-CROSS 스킨은 헤더, 바디(콘텐츠 + 사이드바), 푸터 기본 구조로 잘 구분되어 있습니다. H 태그가 조금 아쉽지만 수정이 용이하게 짜여져 있기에 쉽게 수정할 수 있습니다. 카테고리 다른 글 보기가 목록 형이지만 썸네일 형 카테고리 다른 글 보기를 쉽게 적용할 수 있죠. 사이드바에 모든 위젯 배치가 가능하고, 탭 방식 위젯 기능도 적용 되어 있습니다.


CCZ-CROSS 스킨 1.2.2.fix 버전은 로딩이 지연되는 문제가 있으나 쉽게 수정이 가능하기에 큰 문제 없습니다. 티스토리가 스킨 구조를 크게 변경하지만 않는다면 기본 상태로도 오랫 기간 사용할 수 있는 스킨입니다.


CCZ-CROSS 스킨 모바일


CCZ-CROSS 스킨은 스킨 옵션 기능, 카테고리 현재 위치 표시 기능, 방명록 및 댓글 자동 링크 기능 등을 지원 합니다.


CCZ-CROSS 스킨 다운로드 페이지 및 옵션 설정


https://webdir.tistory.com/491


CCZ-CROSS 스킨 데모 블로그


http://ccz-cross.tistory.com/


2. #2 스킨

티스토리 반응형 스킨 #2


#2 스킨은 티스토리에서 배포하는 반응형 스킨입니다. 무료 스킨이고요. 3가지 크기에 대응하는 3단 적응형 스킨인입니다.


개인적으로 사이드바가 숨겨진 영역으로 제공되는 점이 불만이지만 이 부분을 제외하곤 큰 문제가 없습니다. 기본 상태로 수정 없이 사용하기 좋은 스킨입니다.


티스토리 스킨의 공통적인 문제인데요. 글쓰기, 관리 등 관리자만이 접근할 수 있는 페이지 링크 버튼은 제발이지 블로그 스킨에서 빼줬으면 좋겠네요. 티스토리 블로그도 일부만 이용하는 버튼을 왜 공개된 스킨 영역에 넣어 놓았는지 모르겠습니다.


#2 스킨은 티스토리 관리 페이지 > 스킨 변경에서 적용할 수 있습니다.


3. 플래티넘(flatinum) 스킨

티스토리 반응형 스킨 플래티넘(flatinum)


플래티넘(flatinum) 스킨은 무료로 배포되는 반응형 스킨입니다. 4단 적응형 스킨으로 4가지 크기에 대응합니다. 플래티넘 스킨은 부트스트랩(Bootstrap) 기반으로 제작된 스킨인데요. 기본 형태이기에 수정이 용이한 장점이 있습니다.


플래티넘 스킨은 사이드바 위젯으로 공지사항, 카테고리, 태그 목록, 글 보관함, 달력, 링크 등만 사용할 수 있습니다. 블로그 소개, 최근 게시물, 최근 댓글, 방문자 카운터 등의 위젯은 스킨 푸터에 위치하고 있습니다.


마지막 버전이 2016년 8월 8일 배포되었기에 거의 3년에 가까운 시간 동안 업데이트가 없었습니다. 2018년 하반기에 티스토리 전체 블로그에 SSL이 적용 되었기에 SSL 패치 작업을 직접 해줘야 하는 문제가 있습니다. SSL 적용 문제만 해결하면 장기간 사용할 수 있을 것으로 판단 됩니다.


플래티넘 스킨 최신 버전 다운로드 페이지


http://socialdev.co.kr/2016/08/03/flatinum-v3/


플래티넘 스킨 데모 블로그 & 적용 방법 & 다운로드


https://flatinum.tistory.com/


티스토리 반응형 스킨 JY-SKIN Ver1.2


비슷한 구조의 스킨으로 JY-SKIN Ver1.2가 있습니다. 2017년 1월 배포되고 있는 1.1 버전이 최신 버전으로 flatinum 스킨과 동일한 문제가 있는데요. 직접 SSL 패치 작업을 해주면 충분히 쓸만하다고 판단 되는 스킨입니다.


JY-SKIN Ver1.2 스킨 다운로드 페이지


https://mrjjang.tistory.com/94


데모 블로그


https://jy-skin.tistory.com


4. 엠원리액트(M1react) 스킨

티스토리 반응형 스킨 엠원리액트(M1react)


엠원리액트(M1react) 스킨도 무료 스킨입니다. 2가지 크기에 대응하는 반응형 스킨입니다. 사이드바 위젯에 탭 방식 최근글, 최근 월별 글, 최근 댓글 위젯을 지원합니다.


엠원리액트(M1react) 스킨 다운로드 페이지


https://m1story.tistory.com/71


5. 마크쿼리 스파이더웹(Markquery Spider's Web) 스킨

티스토리 반응형 스킨 마크쿼리 스파이더웹(Markquery Spider's Web)


지금 사용하고 있는 마크쿼리 스파이더웹(Markquery Spider's Web) 스킨을 뽑지 않을 수 없죠. 살만 하니 선택했고, 여직도 살고 있는 집이니까요. 다만 마크쿼리 스파이더웹 스킨은 2015년 공개된 v4.0.0 (2015.2.07) 버전을 끝으로 더 이상 업데이트가 진행되지 않고 있습니다. 스킨 배포도 중단 되었습니다.


마크쿼리 스파이더웹은 부트스트랩(Bootstrap) 기반의 적응형 스킨인데요. 4단계 크기에 대응하는 스킨으로 일반 스킨과 반응형 스킨의 중간 형태인 적응형 스킨입니다. 마크쿼리 스파이더웹 스킨은 정말 많은 곳을 수정하여 사용하고 있는데요. 로딩 문제, 데드 링크 문제, 이미지 경로 등의 기본적인 문제부터 시작하여 스킨 이곳 저곳을 수정하여 사용하고 있네요. 손 안댄 곳이 없을 정도이네요.


현재 몽리넷 꿈속으로 블로그는 2단계, 3단계 반응형 스킨 보다는 4단계 적응형 스킨이 적합하다고 판단하여 현재까지도 마크쿼리 스파이더웹 스킨을 사용하고 있습니다. 모바일 방문자 비율이 현재보다 40% 증가하면 2단계 크기로 대응하는 완전 반응형 스킨으로 변경할 생각이네요. 다음에 사용할 스킨은 공유되는 스킨의 기본 뼈대만 이용하여 만들거나 아예 직접 만들어 사용할 생각입니다. 프로 귀차니스트이기에 실행 여부는.. 모르겠습니다.


마크쿼리 스파이더웹 스킨의 라이센스 파일을 살펴보면 특정 조건을 충족할 시 배포, 수정 등이 가능한 것으로 되어 있으니 뭐 일단 재배포하는 것으로~ 참고로 마크쿼리 스파이더웹 스킨에 사용된 소스들의 원 저작권자와 라이센스 정보가 누락되어 있어 확인이 불가능합니다. xml 파일에 라이센스 항목이 있고 링크로 연결되어 있으나 해당 도메인이 다른 사람에게 넘어간 상태이네요. 오픈 소스나 MIT 라이센스 등의 소스를 사용했을 것으로 추정될 뿐 명확하게 라이센스 부분을 확인할 방법이 없습니다.


마크쿼리 스파이더웹 spidersweb-4.0.0

마크쿼리 스파이더웹 tistory-spidersweb-3.0.5


0. Yzz Dark 스킨

티스토리 반응형 스킨 Yzz Dark


한참 고민했습니다. 엠원리액트(M1react) 스킨을 넣어야 하나 Yzz Dark 스킨을 넣어야 하나 정말 오랫동안 고민했습니다. 두 스킨 모두 2단계 크기에 대응하는 적응형 스킨인데요. 두 스킨 모두 웹진형 형태로 모바일 보다는 웹에 더 적합한 스킨입니다. 반응형 스킨이라고 모바일 형태에 가까울 필요는 없죠. 몽리넷 꿈속으로 블로그처럼 모바일과 웹 방문자 비율이 비등한 블로그도 있으니 말입니다. 웹 방문자가 비율이 높은 블로그 혹은 웹 방문자를 타케팅하는 블로그에서는 이 스킨을 사용하는 것도 나쁘지 않다고 판단합니다.


골라조 스킨 다운로드 페이지 및 데모 블로그


https://ys0036.tistory.com/12


현재 골라조 스킨 제작자 블로그 및 개발자 사이트 접속이 불가능합니다. 개인적인 이유로 개발 및 업데이트가 더 이상 이루어지지 않는 것 같습니다. 아래의 노는 blog에서 커스텀 버전을 배포하고 있으니 참고하시면 되겠습니다.



https://holycrap.tistory.com/155


과욕은 금물! 심플 또 심플

속도도 빠르고 네이버 검색 최적화가 되어 있으면 다른 것은 정말 없어도 될 것 같은 생각인데요. 사람 욕심이란 것이 끝이 없죠. 속도 빠르고 네이버 검색 잘되더라도 십중팔구 스킨에 이것 저것 덕지 덕지 삽입하게 됩니다. 어떤 스킨을 선택하든 선택한 스킨을 적용한 후에는 스킨에 너무 많은 소스를 추가하지 않는 것이 좋습니다.


멀쩡한 스킨의 경우라면 스킨에 소스(기능)를 추가하는 것 보다는 제거하는 편이 더 좋습니다. 어중간한 소스들을 추가하여 블로그 속도 떨어트리느니 불필요한 소스(기능)를 제거하여 속도를 끌어 올리는 것이 좋습니다. 소스 덕지 덕지 붙여 놓고 최적화 하는 것보다는 과하게 심플할 정도로 소스 줄여 놓고 최적화 하는 것이 훨씬 쉬우니 말입니다. 필요한 요소들만 남겨 놓고 불필요한 소스는 과감하게 제거하는 것도 좋은 선택이 될 수 있습니다. 끝~


© 꿈속으로(mongri.net), 무단전재 및 재배포 금지. 공유와 직접 링크를 선호합니다.
[저작권 규약, 운영 원칙 및 이용자 준수 사항]