모바일 썸네일형 리스트형 [Mobile] userAgent 에이전트를 이용한 모바일 페이지로 자동 이동 일전에 에이전트를 알아볼 수 있는 스크립트를 포스팅한적이 있는데요. "navigator.userAgent" 말이죠. 그렇다면 오늘은 이것을 이용하여 모바일 기기가 접속을 했을 때, 모바일 사이트로 바로 이동하게 하는 것을 해보도록 하겠습니다. 모든 일들이 마찬가지겠지만 이 일을 잘 해결하기 위해서는 일단 필요한 것들과 일의 과정을 정리해보면 되겠는데요. 우선 작업의 과정을 살펴보면, 1. 사이트에 접속한다. 2. 브라우저를 체크한다. 3. 에이전트에 따라서 페이지를 연결한다. 대략 이렇게 세가지 단계에 의해서 일을 처리하면 될텐데요. 그렇다면 2번째의 브라우저를 체크 하는 방법은 에이전트를 검사하는 방법을 사용하면 됩니다. navigator.userAgent 그 다음에 확인된 브라우저에 따라서 페이지를 .. 더보기 구글의 모바일 전략, 모바일 구글맵 애플이 아이폰으로 모바일 시장을 점점 점령해가는 가운데, 구글은 안드로이드라는 OS로 모바일 시장에 뛰어들었습니다. 물론 구글이므로 무료로 개방하는 정책을 사용하였습니다. 그래서 여러가지 모바일 폰 개발 업체에서 안드로이드 OS를 탑재한 스마트폰을 출시하게 되었습니다. 안드로이드를 탑재한 스마트폰이 점점 시장점유율을 키워나가는 가운데, 구글 웹페이지의 모바일 서비스 또한 더욱 모바일 접속자에게 최적화 되어 점점 변하고 있는 것 같습니다. 우리나라 포털의 모바일 사이트들도 스마트폰 접속자들에게 더 나은 서비스를 제공하도록 조금씩 개편하고 있는데요. 우리나라의 사이트들도 멋지게 변했지만, 구글 모바일 사이트의 변화는 진정 구글의 기술력을 엿볼 수 있었습니다. 우선 오늘은 구글의 역작 구글맵의 모바일 버전에 .. 더보기 맥 OSX 의 발로 만든 플래시 플러그인, 아이맥 플래시 플러그인 요즘 어도비와 애플은 사이가 좋지 않습니다. 스티브 잡스가 자사의 모바일 디바이스인 아이폰과 아이패드에 플래시를 지원하지 않을 것이라고 못박아 놓았고 어도비도 애플을 상대로 광고를 통해 대항하였습니다. 뭐 광고에서 우리는 모두를 사랑한다고 했는데 (특히, 애플도 사랑한다고) 그것이 정말 사랑이란 얘기는 아니겠지요. 아무튼 현재 애플과 어도비의 관계는 그다지 좋지 않습니다. 스티브 잡스는 어도비의 플래시가 모바일에서는 잘 돌아가지 않고 CPU와 배터리를 너무 많이 소모한다고 이야기 하였습니다. 이번에 iMac을 구매하면서 맥OSX로 갈아타게된 저로서는, 그리고 아이폰을 사용하고 있는 저로서는 또 웹에 관련된 일을 하는 저로서는 이 이야기를 그냥 넘어갈 수 는 없었습니다. 일전에 소문으로 어도비가 플래시의 .. 더보기 [Mobile] 모바일 웹, 아이폰 사파리에서 화면회전시 폰트 확대방지 요즘 아이폰의 보급으로 많은 사람들이 iPhone을 사용하고 있습니다. 그래서 iPhone의 Safari에 최적화된 웹페이지를 많이 제작하고 있는데요. 아이폰 사파리는 모바일 브라우저로 여러가지를 고려하여 개발해야 하는데요. 앞에서 포스팅한 전화번호 링크와 화면 확대되는 부분이외에 화면 확대는 막았어도 텍스트가 자동으로 확대가 되는 것을 볼 수 있습니다. 세로로 딱 맞게 작업했을 경우 가로로 보게 되면 폰트가 확대되어 있는 것을 볼 수 있는데요. 이렇게 되면 어느 환경에서나 잘 보이게 개발하기 힘들겠죠? 그래서 폰트가 확대되는 것을 막아야 합니다. 그림에서 볼 수 있듯이 세로로 잘 맞게 작업한 경우 가로로 봤을 때 두번째의 그림같이 확대가 되게 됩니다. 그래서 원래 생각했던 디자인과 다르게 나오게 될 수.. 더보기 [Mobile] 모바일 웹 개발, 화면 확대 방지 viewport 2009년 말 우리나라에도 아이폰이 출시하면서 우리나라의 인터넷 환경도 많이 바뀌게 되었는데요. 비단 아이폰 뿐만아니라 아이본과 더불어 삼성의 옴니아2, 그리고 구글의 새로운 모바일 OS 안드로이드를 탑재한 폰들이 다수 나오게 되면서 2010년 상반기는 인터넷 업계에도 많은 변화가 일어난 것 같습니다. 포털에는 모바일 웹페이지와 모바일폰용 어플리케이션 개발이 당연하게 되었구요. 앞으로는 더 다양한 분야에서, 그리고 다양한 사람들이 모바일 웹페이지를 만들고 사용하게 될것입니다. 그러기 위해선 "접근성"이라는 문제가 대두되게 되는데요. 이전에 이야기하던 장애인에 국한된 접근성이 아니라, 어떤 장애가 있든지 + 어떤 환경에 있든지 정보에 접근할 수 있고 그것을 이용할 수 있어야 할 것입니다. 모바일 웹을 개발.. 더보기 [Internet] 다음 모바일 사이트 요즘 다음의 노력이 많이 눈에 보입니다. 아이폰 어플에서 부터 시작해서 CI도 바꾸고 여러가지고 혁신에 힘쓰는 것 같은데요. 네이번 검색만 쓰다가 오랜만에 들어가본 다음검색에서 다음 모바일 사이트의 변화를 볼 수 있었습니다. 이번에는 특히 검색 부분의 좋은 점을 볼 수 있었는데요. 특정 장소를 입력하여 검색했을 경우에는 이런 결과가 나타납니다. 일단, 바로가기와 장소에 대한 설명이 나오고 여러가지 맞춤내용이 나옵니다. 무엇보다 눈에 띄는 것은 장소카테고리에 전화걸기와 지도보기 버튼이 있다는 것입니다. 전화걸기 버튼은 href 에 tel: 을 이용하여 바로 전화를 걸수 있게 버튼을 만들어 놓았습니다. 아주 휼륭합니다. 그리고 지도보기 버튼을 누르게 되면 선택한 곳의 주변 지도를 볼 수 있습니다. 모바일폰으.. 더보기 [Apple] 아이패드 스크린샷 http://blog.naver.com/favedesign/20105531021 아이패드의 스크린샷. 단순히 화면이 큰 모바일기기가 아닌 정말 새로운 세상을 열어가는 것 같다. 더보기 [Mobile] 아이폰 사파리에서의 전화번호 링크 요즘 아이폰을 시발점으로 맥라이프를 꿈꾸고 있다. 아이폰 사파리에서 웹 서핑을 하다보면 자기도 나름 폰이라고 전화번호와 비슷하게 생긴것에는 자동으로 링크가 걸려 그것을 누르면 전화가 걸린다. 어찌보면 똑똑하고 좋으나 웹사이트 개발하는 입장에서 보면 좀 반갑지 않은 기능인지도 모르겠다. 이런 상황을 극복하기 위한 방법!! 위와 같은 매타값을 주게 된면, 아이폰의 사파리가 자기 마음대로 링크를 만들지 않는다. 헌데, 혹시나 전화 바로거는 링크를 만들일이 있지 않을까? 물론 그럴 때를 대비해서 요런 방법이 존재한다. 전화를 거는 링크 위와 같이 태그를 걸어주면 아이폰 사파리에서 바로 전화를 거는 링크를 만들 수 있다. ^^ 쓰면 쓸수록 아이폰, 이건 참 물건인 것 같다. 허허허 더보기 이전 1 다음
