아라의 글로벌 마인드 칼럼..think globally [댓글 불허 블로그]


[ 사회 참여 활동은 작은 참여로부터 시작된다. ]


부제: 표준을 지키면 이래서 좋다! (티스토리 모바일 리뷰 포함)

인터넷 익스플로러(IE), 불여우(파이어폭스), 사파리, 크롬 중 불여우를 제외하고 모든 부분에 걸쳐 테스트하지는 않았지만 대부분 작동하는 것을 확인했다. 불여우만 사용하기 때문에 불여우에서는 완벽하게(??) 작동한다. 물론, 불여우만 사용하지만 인터넷 뱅킹이나 쇼핑몰 중 ActiveX를 요구하는 곳에는 어쩔 수 없이 IE를 사용한다.


제목 변경 2009.4.20 17:31 '아라의 블로그 스킨 변경/다양한 웹브라우저(아이폰 포함) 지원'에서 '블로그는 이미 모든 웹브라우저와 호환된다. (표준의 장점)'
일단 국내에서는 티스토리 블로그, 텍스트큐브 블로그 등의 스킨에서 웹표준을 지키는 스킨을 지원한다. 다른 블로그에서도 큰 문제없이 지원되는 걸로 알고 있다. 블로그의 글을 위주로 보는 데, 불여우로 문제가 있었던 적이 없었다.



표준은 이래서 좋다!

이렇게 다양한 웹브라우저에서도 블로그가 문제없이 표시되는 것은 티스토리가 기본적으로 표준 웹을 따름으로써 모든 웹브라우저에도 똑같이 웹페이지가 표시되기 때문이다.
티스토리 블로그에서는 모양과 형태를 바꾸는 것은 스킨이라는 것을 이용한다. 물론 스킨은 다른 세계적인 블로그에서도 사용되고 있고, 프로그램에서도 사용되는 곳이 많다. 대부분의 티스토리와 텍스트 큐브의(국내만 얘기한 것이다. 해외에서는 이미 기본으로 모두 지원되는 곳이 많기 때문에 굳이 설명할 필요가 없다.) 스킨이 표준 웹을 따름으로써 모든 웹브라우저에서 당연하게 지원되는 것이다.

아라의 글로벌 마인드 칼럼..think globally티스토리에서 만든 Green Tea 스킨을 사용했고, 아라의 영어 제대로 배우기에서는 leezche님의 등대이야기 스킨을 사용했다. 즉, 이들이 만든 스킨때문에 사용자인 나는 아주 쉽게 모든 웹브라우저를 지원하는 블로그를 만들 수 있었던 것이다. 아니, 정확하게 표현하자면 그들이 웹 표준을 지키면서 만들어놓은 스킨을 사용했을 뿐이다.

티스토리에서 Green Tea 스킨 선택 화면

Green Tea 스킨 선택 화면 - 아라의 글로벌 마인드 칼럼..think globally 블로그에 사용 중


티스토리에서 등대이야기 스킨 선택 화면

등대이야기 스킨 선택 화면 - 아라의 영어 제대로 배우기 블로그에 사용 중



그들에게 감사의 마음을 전한다.



IE, 불여우, 사파리, 크롬으로 블로그 화면 캡처

* 1024x768에서 화면 캡처

아라의 글로벌 마인드 칼럼..think globally 블로그

아라의 글로벌 마인드 칼럼..think globally 블로그를 IE로 본 화면

아라의 글로벌 마인드 칼럼..think globally 블로그를 IE로 본 화면


아라의 글로벌 마인드 칼럼..think globally 블로그를 불여우로 본 화면

아라의 글로벌 마인드 칼럼..think globally 블로그를 불여우로 본 화면


아라의 글로벌 마인드 칼럼..think globally 블로그를  사파리로 본 화면

아라의 글로벌 마인드 칼럼..think globally 블로그를 사파리로 본 화면


아라의 글로벌 마인드 칼럼..think globally 블로그를 크롬으로 본 화면

아라의 글로벌 마인드 칼럼..think globally 블로그를 크롬으로 본 화면




아라의 영어 제대로 배우기 블로그
아라의 영어 제대로 배우기 블로그를 IE로 본 화면

아라의 영어 제대로 배우기 블로그를 IE로 본 화면


아라의 영어 제대로 배우기 블로그를 불여우로 본 화면

아라의 영어 제대로 배우기 블로그를 불여우로 본 화면


아라의 영어 제대로 배우기 블로그를 사파리로 본 화면

아라의 영어 제대로 배우기 블로그를 사파리로 본 화면


아라의 영어 제대로 배우기 블로그를 크롬으로 본 화면

아라의 영어 제대로 배우기 블로그를 크롬으로 본 화면


* 보시다시피 다른 웹브라우저(IE, 불여우, 사파리, 크롬)이지만 거의 똑같이 표시된다. 표준을 지켰을때의 장점이다.



티스토리 블로그는 이미 모바일 기기를 지원한다.

물론 티스토리 자체가 모바일 기기용 글 읽기를 지원한다. 그래서 이 블로그의 주소 http://asrai21c.tistory.com/에서 m을 붙여서 http://asrai21c.tistory.com/m 라고 하면 다양한 모바일 기기-휴대폰, 스마트폰, 아이팟터치 등-에서 글을 쉽게 읽을 수 있다.
물론 티스토리의 홈도 뒤에 m을 붙여 http://www.tistory.com/m 라고 해주면 된다.




티스토리의 모바일 지원 기능을 이용 블로그 글 읽기 화면

윈도우즈 모바일(PDA로 불리는 제품)의 포켓IE로 접속
* 윈도우즈 모바일의 운영체제는 2003 세컨드 에디션 (Windows Mobile Second Edition)

블로그 모바일을 포켓IE(포켓 인터넷 익스플로러)로 접속


아라의 영어 제대로 배우기 블로그 모바일을 포켓IE로 접속



윈도우즈 모바일의 오페라로 접속한 화면

* 오페라의 최신 버전의 30일 시험 버전 이용해 스샷, 풀스크린 기능 이용

블로그 모바일을 오페라로 접속


아라의 영어 제대로 배우기 블로그 모바일을 오페라로 접속



아이팟 터치의 사파리로 접속

블로그 모바일을 사파리로 접속

아라의 글로벌 마인드 칼럼..think globally 블로그 화면 #1

아라의 글로벌 마인드 칼럼..think globally 블로그 화면 #2

아라의 글로벌 마인드 칼럼..think globally 블로그 화면 #3
블로그의 글 일부만 화면 캡처한 것


아라의 영어 제대로 배우기 블로그 모바일을 사파리로 접속

아라의 영어 제대로 배우기의 모바일 화면
아라의 영어 제대로 배우기의 글 일부만 화면을 캡처한 것


아래의 화면은 다른 메뉴(트랙백 보기, 최근에 달린 답글과 트랙백 등)의 화면인데, 아이팟 터치 화면에 최적화되어 있지는 않다.
아라의 영어 제대로 배우기의 모바일 다른 메뉴 화면 #1

아라의 영어 제대로 배우기의 모바일 다른 메뉴 화면 #2


추신 2009.5.8 11:20: 모바일 티스토리 새단장을 만나보세요! (2) @ 2009/05/08 10:22 라는 글에 보이듯이 트랙백, 댓글 등도 모두 모바일 기기에 최적화 시켰다는 소식을 티스토리에서 전해왔다. 거의 모든 기능을 모바일 기기에서 편안히 사용할 수 있게 되었다.
티스토리의 꾸준한 지원에 감사의 마음을 전한다.



티스토리의 모바일 기능 쓸만하다.

위의 화면으로 보시다시피 상당히 쓸만하다. 윈도우즈 모바일, 스마트폰, 아이폰이나 아이팟터치에서도 무리없이 볼 수 있다.
윈도우즈 모바일에서 오페라로 캡처한 화면이 작은데, 조정이 가능하다. 단지 화면 캡처를 위해서 저렇게 세팅을 한 것뿐이다.
위 스샷을 봐도 알겠지만 아이팟터치로 글을 읽기가 상당히 편하다. 괜히 아이폰이 히트작이 된것이 아니다.




아이폰과 아이팟터치에서도 가능

아이폰과 아이팟터치는 거의 완벽한 풀브라우저를 지원하기 때문에 플래시로 도배된 (특히나 위젯을 사용한 블로그인데 일반적으로 위젯은 플래시로 만들어진 경우가 많기 때문이다.) 블로그는 불가능하지만 내 블로그에서는 플래시를 거의 사용하지 않았기 때문에 큰 문제가 없다.

* 한국인들의 해외 시장에 대한 오해 #1
국내 웹사이트는 플래시로 도배되어 있어서 아이팟터치를 완벽한 풀브라우저가 아니라고 우기겠지만 전 세계를 기준으로 하면 완벽한 풀브라우저이다. 왜냐하면, 해외에서는 플래시를 거의 사용하지 않는다. 유투브가 플래시를 사용한다면서 해외도 플래시는 기본이라고 우기리라 생각된다. 제외하든 말든 상관은 없는 것이 아이폰도 유투브를 지원하기 때문이다.


블로그에서 플래시가 사용된 곳 - 화면 우측 사이드바에 애드찜의 무료 문자 보내기 위젯, 각각의 글 마지막 부분에 다음 블로거뉴스의 추천 버튼과 믹시의 추천 버튼
아라의 영어 제대로 배우기 블로그에서는 블로거뉴스와 믹시의 추천 버튼만 플래시 사용



아이폰과 아이팟터치를 지원하는 이유

모바일 페이지가 있는데, 왜 일반 웹으로 접속이 필요할까 생각할 텐데 블로그 화면 우측에 다양한 기능을 제공하기 때문이다. 그곳에는 트위터, 목록, 즐겨찾는 링크, 공지, 블로그 필자 소개, 최근에 올린 글, 오픈웹 지지 배너, 방문자 통계, 페이팔을 이용한 도네이션 등의 기능들을 제공한다.
그리고 더 중요한 것은 아이폰의 편리함으로 글을 쉽게 읽을 수 있기 때문이다.

아래에 화면 캡처한 것을 보면 일반 웹도 큰 불편이 없는 것을 볼 수 있다.

스킨 변경 전의 블로그를 사파리로 접속한 화면
스킨 변경 전의 블로그를 사파리로 접속한 블로그 메인 화면

스킨 변경 전의 블로그를 사파리로 접속한 블로그 메인 화면


스킨 변경 전의 블로그를 사파리로 접속한 블로그의 글을 보는 화면

스킨 변경 전의 블로그를 사파리로 접속한 블로그의 글을 보는 화면


* 블로그 사진 옆에 이상한 문자가 보이며, 글 읽기가 불편한 것은 아니지만 화면 낭비가 있었다.


변경한 블로그를 사파리로 접속
사파리로 블로그에 접속한 화면

사파리로 블로그에 접속한 화면


사파리로 블로그에 접속해 글 부분만 확대한 화면

사파리로 블로그에 접속해 글 부분만 확대한 화면


사파리로 블로그에 접속해 글 분류 목록 부분만 확대한 화면

사파리로 블로그에 접속해 글 분류 목록 부분만 확대한 화면


블로그에 메인화면이 나오면 특정 영역(글의 영역 또는 글 목록 영역 등)을 손가락으로 더블 클릭해주면(표준 웹을 지켜서 만들었을때만 된다.) 위처럼 특정 영역이 확대가 되어서 웹 검색이 무척 편하다.


아라의 영어 제대로 배우기 블로그를 사파리로 접속

사파리로 블로그에 접속한 화면

사파리로 블로그에 접속한 화면


사파리로 블로그에 접속해 글 부분만 확대한 화면

사파리로 블로그에 접속해 글 부분만 확대한 화면


사파리로 블로그에 접속해 공지사항만 확대한 화면

사파리로 블로그에 접속해 공지사항만 확대한 화면


사파리로 블로그에 접속해 링크와 글 분류 목록 부분만 확대한 화면

사파리로 블로그에 접속해 링크와 글 분류 목록 부분만 확대한 화면




* 위 화면 캡처를 봐도 알겠지만, 일반 휴대폰보다 좀 더 큰 화면인 아이팟 터치(아이폰)로 얼마든지 웹 검색이 가능하다는 것을 알 수 있다.
또한, 아이팟터치로 웹사이트를 이용해본 사람은 검색이 쉽다는 것을 잘 알고 있다. 단, 국내 웹사이트는 웹 표준을 전혀 지키지 않기 때문에 아이팟터치로도 웹사이트 접속이 불가능한 곳이 대부분이다.
즉, 웹 표준을 지키지 않은 웹사이트가 많아서 스마트폰이나 아이폰(아이팟터치)이 있어도 웹사이트 접속을 못 하면서 그림의 떡이 되는 희한한 형국이 된다.



글을 읽기 편하도록 스킨의 일부 수정

컴퓨터 모니터 해상도 1024x768 모드를 기준으로 블로그의 크기를 조정했고, 글을 쉽게 읽을 수 있도록 색을 조정하는 등 스킨의 세세한 부분을 조정했다.
색에 대한 감각이 별로 없다 보니 기본 웹페이지 색상을 (검정에 푸른색 하이퍼링크) 사용했는데, 글을 읽기에는 큰 부담이 없으리라 생각된다.
좌우 측에 덕지덕지 붙어 있는 것이 썩 마음에 들지는 않지만 나름대로 꼭 필요한 기능들만 간결하게 골라서 붙였다.


추신: 윈도우즈 모바일의 포켓IE나 오페라로 접속한 화면이 있으나 현재 사진이 너무 많기도 하고, 큰 의미가 없는 것 같아서 생략했다.


아이폰 또는 아이팟 터치로 글 읽기