티스토리를 모바일(스마트폰)에서 볼 때, 두가지 루트가 있습니다
정말 많이 받는 질문 중 하나입니다. 질문 내용을 살펴보면 모바일, 그러니까 스마트폰을 말하는 거겠죠? 스마트폰에서 보는거랑 PC에서 보는거랑 다르다는 이야기가 참 많아요. 친효애드온은 모바일과 PC에서 다 잘 나오게 설계가 되어있습니다. 친효스킨도 당연히 그렇게 설계가 되었구요. 이런걸 반응형 스킨이라고 합니다. PC 해상도와 스마트폰의 해상도에서 사이즈만 달라질 뿐 기본 테마는 그대로 보여지는게 반응형 스킨입니다.
꼭 기억하세요!
티스토리를 스마트폰에서 보는 방법은 두 가지가 있습니다. 그 두가지는 다음과 같습니다.
1. 티스토리 전용 어플리케이션
2. 인터넷 브라우저 어플리케이션 (크롬, 파이어폭스, 기본 인터넷 앱 등)
흔히 모바일에서 안 나온다는 둥, 이상하게 나온다는 둥 이런 질문들을 하시는 분들은 십중팔구 대부분 1번의 경우입니다. 티스토리 전용 어플리케이션에서 접속해서보면 그 어떤 스킨을 사용하던지 다 동일한 스타일로 보여집니다. 즉 친효스킨을 사용하는 티스토리든, 기본 스킨을 사용하는 티스토리든 모두 똑같은 스타일이라는 겁니다. 따라서 커스터마이징을 적용한 스킨을 티스토리 전용앱에서 살펴보면 커스텀 스타일이 빠진, 기본 상태로만 보여진다는 것입니다. 티스토리 어플리케이션 스타일에 맞춰져서 보여지는 것이죠.
친효스킨에는 친효애드온이라는게 있습니다. 친효애드온이 꽤 종류가 많은데 대부분 큰 맥락은 같고 스타일이 다른 종류들이 많습니다. 근데 티스토리앱에서 살펴보면 각각 다른 친효애드온을 썼어도 보여지는 모습이 다 똑같다는 뜻입니다. 가령 본문 중간에 삽입하는 링크 관련된 친효애드온이 현재 8개가 있는데 이 8개의 친효애드온 스타일을 다 적용시킨 페이지가 있다고 해봅시다. 이것을 PC에서 보면 당연히 각 8개의 다른 스타일의 링크글로 보여집니다. 하지만 티스토리앱에서 보면 다 똑같습니다. 티스토리앱은 이렇다라는걸 꼭 알고 계시기 바랍니다.
2번의 경우가 현재 사용중인 스킨의 스타일대로 제대로 보여지게 됩니다. 하지만 스마트폰마다 제조사가 다르고, 기본 인터넷 브라우저앱이 약간씩 다를 수 있습니다. 또한 사용자마다 사용하는 모바일 웹 브라우저 어플리케이션이 다릅니다. 따라서 어떤 디바이스인지, 어떤 브라우저 앱인지에 따라서 스킨이 보여지는 부분에 대해 약간의 차이는 발생 할 수 있습니다. 종류가 워낙에 많고 다양하기에 개인 개발자의 입장에서는 이 모든 환경에서 골고루 테스트를 할 수 없습니다. 그래서 가장 많이 사용되는 대중적인 디바이스와 어플리케이션을 기준으로 삼아서 개발되는데 이렇게 완성된 스킨의 경우는 거의 대부분 잘 호환이 되는 편 입니다. 참으로 다행이지요.
PC에서 모바일(스마트폰)로 접속 시 어떻게 나오는지 간단하게 확인하는 방법
현재 내 스킨이 모바일에서 어떻게 보이게 될지 궁금하시다면 이 방법으로 간단히 확인 할 수 있습니다. 모든 브라우저에서 다 사용 가능한 방법입니다. 친효스킨 뿐만 아니라 대부분의 반응형 스킨은 이 방법을 통해서 확인하실 수 있습니다.
보시는 것처럼 브라우저의 가로 사이즈를 줄여서 F5(새로고침)를 눌러주시면 됩니다. 그러면 대략적으로 스마트폰에서 어떻게 보여질지를 PC에서도 쉽게 확인 가능합니다. 애드센스도 해당 브라우저의 사이즈에 맞춰져 반응형으로 변합니다. 참고로 크롬의 경우는 37버전 이후로 가로 사이즈가 최소 666px 이하로 줄여지지가 않습니다. 이럴때는 크롬의 개발자툴(DevTools)을 활용하면 됩니다.
크롬 브라우저 내에서 마우스 오른쪽 버튼을 누릅니다. 맨 아래의 검사로 들어갑니다.
그러면 크롬의 개발자 툴 창이 뜹니다. 왼쪽 상단에 보시면 모바일과 태블릿 모양이 겹쳐진 아이콘이 있습니다. 해당 아이콘을 누르면 크롬 브라우저에 위의 이미지처럼 뭔가 스마트폰 기기명칭과 더불어 사이즈와 퍼센트가 표시된 바가 생성됩니다. 그리고 현재 화면의 미리보기도 변경됩니다. 여기에서 편리하게 모바일에서 어떻게 보여지는지를 확인 할 수 있습니다.
아이폰 시리즈부터 갤럭시, 구글 픽셀폰까지 프리셋이 이미 저장되어 있습니다. 태블릿 모델도 몇 개가 보이는군요. 만약 자신의 스마트폰 기기가 없다면 맨 아래의 Edit 메뉴로 들어가서 정확한 해상도를 커스텀하여 확인 할 수도 있습니다. 근데 스마트폰에서 보여지는건 대체로 여기 목록 중 적당한 모델을 선택만 하셔도 아마 될 거에요. 굳이 자신의 디바이스의 정확한 해상도를 꼭 입력하여 확인할 필요는 없습니다.
부록 : 티스토리 앱은 신경쓰지 마세요!
티스토리 앱에서 광고가 안 보인다느니, 이상하게 나온다느니... 이런 질문을 받으면 우선 진정하라고 말씀드리고 싶습니다. 그 이유는 매우 간단합니다. 어차피 티스토리 사용자 외에는 스마트폰에 티스토리 어플리케이션을 설치할 일이 없기 때문입니다. 일반인들이 티스토리앱을 설치할 이유가 있을까요? 아니 그 전에 티스토리 앱이라는 존재를 알기나 할까요? 일반인은 모릅니다. 티스토리 앱의 존재를 몰라요. 따라서 일반인이 스마트폰으로 인터넷을 접속하는 경우는 위의 두 가지 중 어떤 루트일까요? 1번은 무조건 아니겠지요? 티스토리 앱 존재를 모르니까요. 따라서 2번의 루트로 100% 검색하게 됩니다. 결국 티스토리 앱을 사용하는 사람은 티스토리 에디터 외에는 아무도 없습니다. 티스토리에서 이상하게 보여지는거? 그거 본인 빼고는 아무도 모릅니다. 티스토리앱에서 체크하지 마시고 2번 루트인 브라우저 어플리케이션에서 점검하셔야 합니다. 그게 일반인들도 보게되는 모습이니까요. 끝.
