모바일시작페이지(m.xiles.net) 업데이트: 텍스트 보기 모드 추가

My Works 2010/03/16 21:22
모바일 시작페이지(http://m.xiles.net)이 업데이트되어 텍스트 보기 모드가 추가되었습니다.

처음에는 사이트수가 좀 적었지만, 차츰 추가하다보니 조금 많아졌기도 하고
무선데이터 용량으로 고민하시는 분들을 위해 텍스트모드로 보는 옵션이 추가되었습니다.

화면 제일 아래로 내리고, '설정'을 터치합니다.


설정으로 들어가면 아래와 같은 화면이 나오고,
사이트 새 창으로 열기 옵션과 보기 모드를 고를 수 있는 옵션이 있습니다.


아래처럼 새로 추가된 사이트와 자주 가는 사이트 8개 외의 것들은 모두 텍스트로만 표시되어
아이콘 이미지로 인한 데이터전송 용량 걱정을 줄여줍니다.


각 카테고리 제목 부분을 한 번 터치하면 열리고 다시 터치하면 닫힙니다.
열거나 닫은 카테고리 상태는 기억이 되어 다음에 접속해도 동일하게 보입니다.


Posted by xiles
TAG iWebStart, xiles, 모바일 사이트, 모바일 사이트 모음, 모바일시작페이지, 사파리, 아이폰, 오페라, 옴니아
트랙백 0개, 댓글 2개가 달렸습니다

댓글을 달아 주세요

  1. 켄지군 2010/03/24 15:31  댓글주소  수정/삭제  댓글쓰기

    와우 '~' 저희도 커뮤니티 내용을 그대로 모바일사이트로 제작했는데, 혹시 등록해주실 수 있으신가요?

  2. 거품이 2010/05/25 20:42  댓글주소  수정/삭제  댓글쓰기

    노키아 n5800인데 카페에서 보고 잘정리 돼있어서 써보려고 하니 아이콘만 눌러지고 사이트로 안들어 가지네요.업뎃해서 그런건가요?

스마트폰에서는 검색도 스마트하게!!!

Mobile 2010/03/08 00:35
모바일 시작페이지  iWebStart (http://m.xiles.net) 검색이 업데이트되었습니다.
아직 너무나도 미미한 시작이지만,
스마트폰에서는 검색도 스마트하게!!!

m.xiles.net 에서 로또, 피자헛, 콜택시, 클리앙, 야후를 검색해보세요.
바로 전화를 걸 수 있는 검색결과나 모바일 사이트를 검색해서 보여줍니다.

스마트 검색에서 원하는 결과가 나오지 않으면 바로 일반 검색 페이지로 넘어갈 수 있습니다.

아직은 몇 가지 적용된 것이 많지 않은 상태이지만,
스마트폰에서 검색했을 때 사용자들이 원하는 것만 간단히 보여주는 그리고 모바일 사이트를 검색해서 나오는 경우 모바일 전용 사이트로 접속해서 사용할 수 있도록 해주고자 합니다.


로또를 검색하는 경우 거의 이번주 로또 결과를 알고자하는 것일테니 딱 그것만 보여줍니다.
혹 다른 것을 원하는 사용자는 '일반 검색 결과 보기'로 일반 검색결과를 볼 수 있습니다.


폰에서 '피자헛'을 검색하는 경우 주변의 피자헛 위치를 찾거나 혹은 주문을 하려고 전화를 걸려는 두 가지 목적인 경우가 많겠죠. 우선은 바로 터치하면 전화걸기를 할 수 있는 결과를 보여줍니다. 추후 주변 피자헛 위치를 보여주는 기능도 추가할 예정입니다.


막차를 검색하는 것이면 막차시간 보려는 것이겠죠. 일반 검색으로 들어가서 또 여기저기 찾아들어갈 필요없이
막차시간을 알려주는 서비스하는 모바일 사이트가 있는 경우 바로 모바일 전용사이트로 갈 수 있도록 해줍니다.


폰에서 콜택시 검색. 콜택시를 부르려는 것이겠죠?
주요 콜택시에 바로 전화를 걸 수 있는 검색 결과를 보여줍니다.



기타 꼭 필요한 정보만 먼저 검색해서 보여주는 스마트 검색은 차차 추가될 예정이니다.
스마트폰에서는 스마트폰에 맞는 스마트 검색!!

여기저기 찾아헤매지마세요~~



Posted by xiles
TAG iWebStart, xiles, 검색, 모바일, 스마트검색, 스마트폰, 아이폰, 옴니아, 포탈
트랙백 0개, 댓글 0개가 달렸습니다

댓글을 달아 주세요

모바일 웹사이트 만들기 - DOCTYPE 및 viewport

Development/Web 2010/02/16 17:37
아이폰/아이팟용 웹사이트 만들기에서 viewport 메타태그에 대해서 언급을 했었다.
그런데 이것만으로는 모든 브라우져에서 딱 맞는 페이지가 만들어지지 않는다.

오페라 미니에서 열어보니 아래처럼 좌우 스크롤이 생기고 viewport 메타태그로 의도했던 좌우 스크롤없이 딱 맞는 페이지로 보이지 않는다.


그럼 오페라 미니에서도 제대로 좌우 스크롤 안생기고 딱 맞는 사이즈로 맞추려면 어떻게 해야 할까?
아래처럼 DOCTYPE을 XHTML Mobile 로 지정해주면 된다.


<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.2//EN" "http://www.wapforum.org/DTD/xhtml-mobile12.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" lang="ko" xml:lang="ko">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<meta name="viewport" content="user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, width=device-width" />


HTML의 헤더 부분에 위처럼 DOCTYPE과 viewport 메타태그를 같이 사용해주면, 아이폰/아이팟에서도 좌우 스크롤 없이 꽉 찬 상태로 그리고 오페라 미니에서도 꽉 찬 상태로 보여지게 된다.

그런데 옴니아2나 기타 폰에서 오페라 브라우져를 이용해서 들어가면 폰을 세로로 세운 것을 기준으로 가로 사이즈가 다르다. 아이폰이 320픽셀이라면 옴니아2에서 오페라로 이용해보니 더 3/4 정도 사이즈로 표현이 되어 아이폰에서는 한 줄당 4개씩 보이는 것이 아래처럼 3개씩 보이는 정도의 사이즈로 보인다.



* 아이폰용으로만 만들면 사이즈와 브라우져가 통일되어 있으니 좋은데, 다른 브라우져를 맞추려면 이것도 만만찮은 일인 것 같다. 우선 오페라 미니는 http://www.opera.com/mini/demo/ 에서 시뮬레이터로 대략 돌려볼 수는 있다. 그리고 윈모바일에 IE Mobile에서도 확인하려면 윈모바일 에뮬레이터 등을 설치해서 확인해봐야 한다.

그리고 PC에서 IE6 맞추듯 아직 IE Mobile이 다른 모바일 브라우져들에 비해 좀 뒤쳐지는 경향이 있어 이것까지 맞추기는 어려울 듯 하고, 얼릉 모두 표준을 잘 지켜줬으면 하는 바램;;

모바일에서는 아무래도 작은 화면 속에 구성을 얼마나 잘하느냐가 관건인듯 하다.



Posted by xiles
TAG DOCTYPE, HTML, IE모바일, viewport, 모바일 사이트, 사파리, 스마트폰, 아이폰, 오페라, 옴니아, 제작
트랙백 0개, 댓글 1개가 달렸습니다

댓글을 달아 주세요

  1. lunazini 2010/05/13 17:00  댓글주소  수정/삭제  댓글쓰기

    좋은정보네요^^ 담아가요

모바일 브라우징. 모바일 사이트

Mobile 2010/01/27 13:56
아이폰, 옴니아, 안드로이드 등 스마트폰 출시 붐과 함께 인터넷 이용에 큰 변화가 오고 있다.
스마트폰들에는 모바일 브라우져가 탑재되어 있고 기존 폰들에서 할 수 없던 인터넷 사용이 가능해졌다.

물론 이전 폰들에서도 여러가지 방법으로 정보를 얻을 수 있고, 일종의 모바일 브라우징이 가능했지만
스마트폰에서는 컴퓨터 앞에서 하던것과 거의 유사한 형태로 쉽고 풍부한 웹을 경험할 수 있다.

아이폰 출시 이후 수많은 기사들을 비롯, 여기저기서 어플리케이션(앱스)에 대한 이야기들이 끊이지를 않고 있다.
그런데 생각보다 아직 모바일 웹에 대한 인식은 그다지 많지 않은것 같다.
(물론 어플리케이션을 개발자/개발사에서 쉽게 유료로 판매할 수 있는 모델이 있기에 이 점을 무시할 수는 없지만)

물론 지금 있는 홈페이지(사이트)들도 대부분 브라우징이 가능하지만 작은 화면 크기에서 정말 '원활한' 브라우징은 좀 힘든게 사실이다. 아마 차츰 모바일 전용 사이트들이 많이 생겨날 것이다. 지금은 네이버, 다음, 파란 등 포털들과 일부 사이트들 외에는 아직 국내에서는 모바일 전용 사이트를 가진 곳은 그렇게 많지 않다.
아직 모바일 브라우징이라는 것이 엄청난 대세인 상태는 아니지만, 무언가 웹사이트를 운영하고 있다면 그리 멀지 않은 시점에서 모바일 사이트를 만들 준비는 하고 있어야 할 것이다.

아무래도 폰에서는 한꺼번에 많은 기능을 하는 그런것 보다는 작은 기능을 하는 다양한 것들이 많이 존재하게 될 것 같다.
그런것들이 어플리케이션으로 사용할 수 있으면 좋겠지만, 어플리케이션은 각 OS별로 따로 제작이 되고 유지되어야 한다.
물론! 다양하게 제공할 수 있으면 더할나위없이 좋지만, 많은 경우 그렇게 여력이 많지 않을 수도 있으니...

반면에 모바일 웹서비스로 구현하는 경우 사용자들은 다운받을 필요도 없고, 만드는 입장에서는 어플리케이션에 비해 조금 더 수월하게 다양한 기기를 지원할 수 있다. 그리고 빠른 업데이트도 가능하다.
많은 브라우져들이 HTML5를 지원하기 시작하면서 좀 더 멋진 웹사이트 제작이 가능해지고 있기에 모바일에서 또한 어플리케이션에 못지 않은 다양한 서비스들이 만들어질 수 있을 것이다.

http://m.xiles.net 에 개인적으로 좀 괜찮게 만들어졌다 싶은 모바일 전용 사이트들을 모으고 있는데, 모바일 어플리케이션이 받는 스포트라이트에 비하면 아직 그 수가 엄청 적은 것 같다. (역시..돈이 연관이 되어야...;;;;)

어쨋든 사용자들은 어플리케이션도 어플리케이션대로 많이 사용하겠지만, 앞으로는 모바일 사이트들도 엄청 많이 사용할 것이라는 것!


Posted by xiles
TAG 모바일, 모바일사이트, 브라우징, 스마트폰, 아이폰, 안드로이드, 앱스, 옴니아, 웹
트랙백 0개, 댓글 2개가 달렸습니다

댓글을 달아 주세요

  1. boombeem 2010/01/31 12:01  댓글주소  수정/삭제  댓글쓰기

    위치기반 소셜 게임 boombeem.com 도 모바일 싸이트로 만들어졌습니다. 아이폰과 안드로이드에서는 돌아가던데 모바일 익스플로러에서는 어떻게 될지 잘 모르겠네요.

  2. 핑크팬더 2010/01/31 21:39  댓글주소  수정/삭제  댓글쓰기

    m.myasset.com 여기도 금융권 최초로 동양종금에서 모바일 사이트로 만들어져 있습니다.
    타치휴대폰에서나 스마트폰에서만 접속이 가능하지만 은행이체, 주식주문, 잔고확인 다 가능합니다.