본문 바로가기

이것저것

LGT 오즈 웹뷰어 가로 해상도 간단하게 조정하기

* HTML에 대한 기본적인 이해와 호스팅을 필요로 하는 내용입니다

요즘 계속 햅틱온에 대한 이야기만 포스팅하는 것 같네요^^;;
그만큼 오즈에 대한 만족도가 높은 것 같습니다
지금까지 경험해 본 휴대폰 부가 서비스 중에 가장 마음에 드는 서비스네요^^

http://footoo.com/257 : 지난번 간단한 사용기 보기

오즈로 인터넷 접속을 할 때는 두 가지 방식으로 접속할 수 있습니다
하나는 풀브라우저, 다른 하나는 웹뷰어입니다

풀브라우저는 우리가 PC에서 사용하는 브라우저와 유사한 방법으로
먼저 HTML, 자바스크립트 등의 코드와 이미지 파일을 휴대폰으로 전송 받은 뒤
휴대폰 브라우저 내의 인터프리터를 통해 화면에 뿌려줍니다
기존 브라우저와 거의 같은 방법으로 돌아가는 대신에
이것저것 자잘한 이미지나 여러 스크립트 등이 늘어나면 꽤 느려집니다

반면 웹뷰어는 원격접속으로 서버상의 PC에 접속하고
그 전체 페이지를 하나의 이미지를 뿌려주는것과 유사한 방법으로 더 빠른 편입니다
링크 정보는 HTML 이미지 맵과 비슷한 방식으로 가져오는 것 같네요.

* 오늘도 사진은 날림-_-



모바일 브라우징에서는 속도가 꽤 중요한 문제인만큼
웹뷰어가 가지고 있는 장점이 꽤 큽니다.
그런데 여기에는 한가지 문제가 있으니...
풀브라우저에서는 휴대폰의 해상도(로모폰 : 800X480)을 정확히 인식하지만
웹뷰어에서는 서버상의 PC가 1024로 인식되어 있는지 불필요한 스크롤이 생기게 됩니다

사진과 함께 보면...



풀브라우저로 다음 모바일 페이지에 접속해보면
가로로 돌릴 때나 세로로 돌릴 때나 PC내 브라우저 내에서
변경된 가로 해상도 정보를 가지고 있기 때문에
다음 모바일 페이지처럼
TABLE WIDTH = 100% 와 유사한 태그를 사용한
모바일 페이지 내에서는 정확한 화면을 보여줍니다


다만 뽐뿌 모바일 페이지처럼
가로 폭을 특정 해상도로 고정시켜 놓은 페이지는 어쩔수 없이 글씨가 작게 보입니다
위 페이지는 QVGA나 아이팟 터치 등의 가로폭에 맞춰놓은 걸껍니다



진짜 다음 메인 페이지는 가로가 조금 잘리지만 이건 휴대폰 해상도가 딸리는거기 때문에 어쩔 수 없죠.



자주 가는 클리앙 모바일 페이지도 정상적으로 보입니다

문제는 웹뷰어 방식으로..
앞서 설명한 바와 같이 서버내의 브라우저 해상도가 1024로 인식되어 있어서
쓸데 없는 스크롤이 생기게 됩니다

일반적인 사이트는 대부분 가로 해상도가 800이상이라 큰 문제가 되지 않습니다

이런 사이트는 별 문제 없습니다만


문제는 모바일, PDA 페이지입니다
휴대폰 브라우저 해상도가 아닌 서버상의 해상도에 테이블 가로폭이 맞춰져서
불필요한 가로 스크롤이 생기게 됩니다


이런게 은근히 짜증나더군요-_-;
옵션에서 서버 가로해상도(800,1024)를 수정할 수 있으면 좋은데 그런게 없으니..

좀 빨리 써보겠다고 웹뷰어 모드를 사용하는건데 오히려 스크롤 때문에 더 느려지는 상황이 발생..

일단 지금까지 풀브라우저 모드 VS 웹뷰어 모드를 비교해 보면

* 풀브라우저
- 장점 : 대부분의 사이트를 그대로 보여줌, 정확한 해상도 인식
- 단점 : 느림

* 웹뷰어
- 장점 : 빠름
- 단점 : 해상도 인식 문제, 서버 이미지를 가져오기 때문에 AJAX처럼 일부 리로딩 되는 페이지는 화면 전환 느림

그래서 어떻게 하면 브라우저 해상도를 800으로 인식시킬 수 있나 고민했습니다
일단 자바스크립트를 통해 브라우저 해상도를 바꾸는건 (당연히?) 안 먹히더군요

좀 생각해보니..HTML FRAME을 사용하면 될 것 같더군요^^;;;

전 오즈, 터치 공용으로 따로 시작 페이지를 만들어 사용합니다

아...이 방법을 위해서는

HTML 파일을 올릴 수 있는 서버 호스팅 페이지가 필요합니다

아래와 같이 되어 있는 m1.html 이라는 파일이 있습니다


새로 추가한 파일은 m.html 입니다

m.html 소스



m.html 에서 800짜리 진짜 페이지와 비어있는 224 해상도짜리 페이지를 만들어줍니다
물론 진짜 내용은 800쪽에서 보이게 되는거고 오른쪽 페이지는 버립니다-_-;
이렇게 하면 웹 페이지가 800으로 인식된다고 볼 수 있죠

m480.html



이건 세로 모드로 접속할 때 해상도에 맞춰진 m480.html 입니다

위 3개 파일을 서버 상에 올려주고..그걸 시작페이지로 만들어주면 아래처럼 나옵니다





물론 오른쪽에 쓸데없는 페이지가 남아있긴 하지만 거기에는 내용이 표시되지 않고
모바일 페이지도 왼쪽 프레임 해상도인 800에 맞춰져서 보기 편리합니다

일단 웹뷰어 방식으로 사용할 때는 이 방법이 꽤 유용한 것 같습니다
다만 단점이 있으니..

가로 해상도 800을 넘는 페이지는 오른쪽으로 더 넘어가기 좀 귀찮습니다
근데 보통 이 쪽에는 그다지 볼만한 내용이 없어서-_-;;

또 하나는 페이지 주소가 계속 m.html로 인식되어서
자동 로그인이 제대로 안되네요 ㅡ.ㅜ

아무튼 LGT에서 웹뷰어 모드 가로 해상도 수정 옵션을 추가해주었으면 합니다~

P.S. 뉴스, 네이버, 다음 블로그 카페, 싸이월드 등은 그냥 오즈 라이트로 보는게 편하고 빠릅니다^^