일본 모바일 웹사이트 개발 시 주의점
일본 모바일 웹사이트의 개발 할때 주의사항에 대해서 정리를 해 봅니다.
참고로 일반적으로 우리가 접하는 웹사이트는 PC용 웹사이트라고 부르겠습니다.
일본 모바일 사이트 개발시 일반적인 차이와 주의사항
한국의 모바일 웹사이트는 WAP 표준을 사용하고 있는 것으로 안다. 파일 코드만 보면 모바일 용인지 일반 웹사이트 용인지 쉽게 구별이 가능하다. →WAP전용 태그가 있기 때문으로 압니다.
일본은 도코모의 i-mode때 부터 HTML의 서브셑을 채택해서 지금까지 사용 해 오고 있다. 그 덕분인지 일본의 모바일 사이트를 개발하다 보면 일반 PC용 웹사이트에서 HTML만 바꿔 간단히 서비스 할 수 있는 경우도 종종 있다. 다만 이동통신사 별로 조금씩 차이가 있기 때문에 그 부분만 신경 써주면 된다.(때론 심각하게 고민 하는 경우도 생기긴 한다. ^.^) 그럼 간단히 정리 해 보자.
→au(KDDI)의 경우는 WAP2.0브라우저를 이용하고서 HTML서브셑을 사용하고 있습니다.
1. 핸드폰 기종과 이동통신사에 따라 채용하는 HTML이 차이가 있다.
■핸드폰 제조사가 어떤 브라우저를 사용하고 있느냐에 따라 지원하는 HTML이 결정 된다. 현재는 대부분 3G로 전환 하면서 브라우저도 XHTML을 주로 채용하고 있기 때문에 최근 모바일 사이트 개발은 XHTML에 맞춰서 이루어 지고 있다.
2. HTML 서브셑
■초기 도코모의 i-mode때부터 WAP이 아닌 HTML의 축소버젼을 채택해 오고 있다. au(KDDI)의 초기 단말기는 HDML을 사용하기도 했지만, 대부분은 HTML의 서브셑을 사용해 오고 있다.
■다만 CSS가 지원이 안되는 단점으로 인해 표현에 제한이 있다.
3. XHTML지원
■최근의 핸드폰에서 채택되고 있다. 물론 최신 기종이라고 해서 모두 XHTML을 지원하는 것은 아니다. 회사에서 내가 테스트 하고 있는 핸드폰도 제대로 표현이 안된다.
■CSS가 지원된다. 따라서 디자인 표현이 다채로와 지고 있다.
■여기서 또다른 미묘한 대응이 필요하다. HTML과 XHTML을 모두 지원해야하므로 HTML파일을 작성시 지원하는 것이 HTML인지 XHTML인지를 명시 해 줘야 한다. Content-Type헤더와 DOCTYPE선언이 필요하게 된다.
4. 주요 차이점
■링크나 폼의 버튼에 핸드폰 키를 지정하여 한번 클릭으로 이동 할 수 있다. 예를 들어 1되어 있다면 키패드의 "1"을 눌러서 링크로 바로 이동 할 수 있도록 지원한다.
■table태그를 지원하지 않는 기종이 꽤 있다.
■강조문자(b)태그등은 기종에 따라 지원하지 않는 기종이 꽤 있다.
■input의 택스트 입력 태그에 입력모드(입력 문자 종류)를 지정할 수 있다. 일본은 영문, 반각/전각 히라가나, 반각/전각 가타가나등 몇가지 입력모드가 있다. 입력 모드를 직접 지정해 줌으로서 이용자가 편리하게 사용할 수 있도록 해 준다.
■핸드폰의 고유 식별 코드나 GPS위치 정보등을 제공하기 위해 이동통신사 별로 독자적인 태그나 속성을 정의해서 사용하고 있다.
5. PC웹사이트와 공통적으로 사용되는 HTML 태그들
■텍스트용 : br, div, span, p, font, center
■링크와 이미지 : a, img
■폼 : form, input, select, option, textarea
6. 화면 크기
■보통 폭이 240픽셀 정도를 가정하고 화면 설계를 하는 경우가 많다. 1행에 20~30자 정도 들어가기 때문에 웹디자이너들이 상당히 짜증나게 하기도 한다.
7. 문자 인코딩 문제
■한국은 웹사이트의 경우 "EUC-KR"또는 "UTF-8"에 대응하면 되지만, 일본은 PC 웹사이트의 경우는 "Shift_JIS", "EUC-JP", "UTF-8" 그리고 "ISO-2022-JP"를 지원하고 있다. 모바일의 경우는 최근 들어 "UTF-8"도 지원하는 핸드폰이 나오고 있지만, 안전하게 서비스 하기 위해서는 "Shift_JIS"에 맞추는 것이 좋다.
8. 지원하는 이미지 형식
■핸드폰의 기종에 따라 지원하는 이미지 형식이 다르다. 따라서 서버에서 기종을 체크하여 바꿔 줄 필요가 있다. 최근에 JPEG과 GIF를 모두 지원하는 경우가 늘어가고 있기는 하다.
9. 페이지 용량
■한국의 모바일 사이트도 마찬가지 있겠지만, 한정된 네트워크에서 한 페이지의 크기는 서비스에 상당한 영향을 준다. 일본 모바일 사이트의 경우도 용량에 제한이 엄격하다. 유명한 사이트조차 용량 초과로 인해 핸드폰에서 화면 표시가 중단되는 경우가 자주 있다. 용량의 제한은 이동통신사 별로 차이가 있어 5KB~100KB(이미지포함)정도에 맞추고 있다.
10. 그림문자
■일본 모바일 사이트의 특징 중에 그림문자(絵文字)라는 것이 있다. 특수기호 같은 것인데, 일본 사람들은 그림 문자를 상당히 좋아하고 활용하고 있기 때문에 웹사이트에서 지원이 안된다고 한다면 이용자들로부터 외면 당하기 쉽다.
■사이트 개발에 있어 상당히 골치 아픈 것 중의 하나가 그림문자 지원이다. 이동통신사 별로 지원하는 코드가 다르기 때문인데, 서버에서 어느 이통사이냐를 체크해서 매번 바꿔줘야만 한다. 혹여 PC 웹사이트와 데이터가 공유된다면 PC용으로 변환하는 것도 꼭 필요하다.
11. Javascript사용 불가
■풀브라우징이 아닌 이상 지원하는 핸드폰은 없다. 구글 analytics도 모바일 용으로 따로 최근에 코드를 제공하기 시작했다.
12. 쿠키 사용 불가
■대부분 쿠키 저장을 허용하고 있지 않다. 기종에 따라 쿠키를 사용할 수 있기는 하지만, 없다고 가정하고 개발하는 것이 마음 편하다.
13. 플래시 지원
■플래시를 지원하는 기종이 늘고 있다. 일반적으로 폭 넓게 지원하는 플래시의 버젼은 FlashLite1.1이다. 업그레이드 된 버젼도 있지만, 1.1버젼에 맞추는게 일단은 안정적이라는 얘기가 있다.
간단히 이정도로 정리를 했다. 아주 세부적으로 정리를 한 것은 아니지만, 앞으로 정리하는데 도움이 될 것 같다.
별거 없게 보일 수도 있지만, 실제 개발 시 상당히 짜증(?) 나는 경우가 종종 있다.
다음부턴 좀 더 상세히 정리를 해 보자. ^.^
(그런데 아이폰 모노터치 정리는 어떻게 하고...이걸 하고 있나...참...)
출처 : http://neojjang.egloos.com/2201789
