모바일 사이트는 안녕하신가요?? Time for Mobile SEO!!

안녕하고, 안녕하세요~! 아티언스 YunHeeC 인사 드립니다.
제가 우리 아티언스 블로그를 쭈우욱 보니.. 마지막 포스팅이 지난 11월이더라고요..
굳이 핑계를 조큼 하자면.. 너무너무 바빴습니다.
연말 + 연초 = 프로젝트 종료 시즌 + 프로젝트 제안 시즌 으로 해석되자나요~~ 우리 이해해 줄 수 있자나요~~(ㅜ_ㅜ)

2015년 첫 블로그는 “모바일 사이트”에 대해 이야기 해 보려고 합니다.
2000년 초기 웹 사이트 하나 안가지고 있는 기업이 없었던 것 처럼, 이제 모바일 사이트 하나 안가지고 있는 기업은 없는 듯 합니다.
초기에는 m.example.com 혹은 example.com/m/과 같은 개별 도메인의 모바일 사이트를 많이 선호 하였습니다.
그러나 최근에는 관리적 차원까지 고려하여 반응형 모바일 사이트를 많이 구축 하는 추세인듯 합니다.

‘반응형’ 모바일 사이트는 뭘까요?
데스크탑에서 접속하나 모바일 디바이스에서 접속하나 User-Agent를 인지하여, 디바이스에 적합한 사이즈로 컨텐츠를
랜더링하는 방식으로 데스크탑 버전과 모바일 버전에서의 URL 변동은 없습니다.

그러다 보니!!!! 웹마스터님들이 가장 많이 하시는 오해가……… 바로바로
소스가 똑같은데 데스크탑 SEO 하면 모바일 사이트도 자동으로 되는거 아닙니까???
그런분들에게 외칩니다.. “아닙니다아닙니다아닙니다…!!!”

모바일을 통하여 웹 검색을 하는 사용자가 매년 빠르게 늘어감에 따라, 트랜드를 읽은 구글 역시 2014년부터
모바일 검색 사용자에게 양질의 검색 결과를 노출하기 위하여 모바일 알고리즘을 본격적으로 손보기 시작합니다.

그 중, 구글이 특히 많이 고려하는 부분이 바로 모바일 사이트의 “User Experience” 입니다.
그 이유는, 모바일 디바이스에 있습니다. 모바일 디바이스는 작습니다.
작은 기계에서 사용자가 정보 탐색을 가능하게 하기 위해서 신경 써야 하는 가장 중요한 것이 바로 “편의성” 입니다.
아무리 좋은 정보라도, 사용자가 편하게 읽을 수 없다면 사용자는 바로 사이트에서 이탈해 버리고 말테니까요.

2014년 11월 구글은 검색 결과에 노출되는 모바일 사이트가 “User Experience”를 고려한 “Mobile Friendly” 사이트 인지 여부를,
검색 결과에 마크로 표기하여 보여주는 알고리즘을 공식 런칭 하였습니다.

<Google “Mobile Friendly(모바일 지원) Label” Algo.>

google-mobile-friendly-label-1-300x131

“Mobile Friendly” 라벨 표시는 검색 결과에 직접 노출되기 때문에, 사용자의 클릭 유도에 많은 영향을 주게 됩니다.

또 한가지! Mobile User Experience와 관련하여 Google은 2014년 10월 웹마스터들이 모바일 친화적 사이트로 관리 할 수 있게
모바일 사이트의 User Experience를 확인 할 수 있는 툴을 소개하고, 이후 지속적인 업데이트를 진행하고 있습니다.

<구글 Mobile User Experience 테스트 툴>

이미지-9

※ 모바일 사이트 User Experience Test 항목
1. Plugin, Widget 사용 여부 확인
2. Configure the Viewpoint: 모바일 사이트와 데스크탑 사이트를 구분하는 정의. 미 설정 시, 모바일 유입 사용자에게 데스크탑 버전의 사이트를 렌더링 함. (출력 되는 화명 사이즈의 정의)
3. Size Content to the Viewpoint: 모바일 사용자는 모바일 사이트 유입 후, 컨텐츠를 보기 위하여 “가로”로 스크롤링 하는 것을 기대 하지 않음. Configure the Viewpoint 설정 값에 맞춰 “가로:” 컨텐츠의 길이를 조정할 수 있도록 설정 함.
4. Size Tap Target Appropriately: 사용자가 클릭하게 되는 링크, 탭 혹은 버튼의 사이즈 최적화
5. User Legible Font Size: 모바일 사이트에 적합한 폰트 사이즈 구현. (기본 폰트 16 픽셀)

위와 같이 모바일 사이트 User Experience Test 항목은, 모바일 사이트로 유입 된 사용자가 사이트 안에서 최대한
원할하고 편하게 컨텐츠를 탐색할 수 있는 환경을 구축할 수 있는 항목으로 구성 되어 있습니다.

물론 위 항목에서는 아주 간단하게 5가지를 정의하고 있지만, 하나씩 뜯어보면 실수가 가장 많이 나오는 항목들 입니다.
예를 들어 2번 Configure the viewpoint가 잘 설정 되어 있지 않다면 모바일로 유입된 사용자에게 데스크탑 버전 사이트를 보여주게 됩니다.
특히, 요즘 모바일 디바이스에 사이즈가 다양화됨에 따라 모바일 User Experience 최적화를 할 때도 보다 세심함이 필요합니다.

많은 기업들이 모바일 사이트를 구축하고 이미 많이 보유하고 있습니다.
그러나 데스크탑 버전 웹 사이트와 다른 방치되어 있는 모바일 사이트가 많은 것 역시 사실 입니다.
이제는!! 데스크탑 버전 뿐만 아니라 모바일 사이트 역시 사랑해 줘야 할 때입니다!!!!

HAPPY OPTIMIZATION 하세요~!

모바일 친화적인 사이트는??

안녕하세요 아티언스의 필진 조이브 입니다.

오늘은 모바일 친화적인 사이트란 어떤 것인가에 대해 알아 보겠습니다.

eMarketer 에따르면 한국은 2013년에는 모바일 가입자의 90% 약 3천 6백만명이 스마트폰을 사용한다고 합니다. 이렇게 스마트폰이 빠른속도로 보급되면서 스마트폰으로 웹서핑을하는 인구 또한 폭발적으로 증가 하고 있습니다.
여러분들도 스마트폰으로 웹서핑 하다보면 한번쯤은 모바일 친화적이지 않은 사이트를 접속하여서 불편을 느끼신적이 있었을섭니다.

 

모바일 친화적이지 못한 사이트를 사용자는 어떻게 느낄까?

구글의 통계를 보면,

– 스마트 폰을 사용하는 사람들의 72%는 모바일 최적화된 사이트를 중요하다고 여깁니다. 하지만, 스마트폰 사용자중 96%는 모바일 친화적이지 않은 사이트를 방문한 경험이 있다고 말했습니다.

– 스마트폰을 사용하는 사용자중 74%는 모바일 친화적인 사이트를 재방문할 생각이 있다고 했습니다.

– 쇼핑몰의 경우 모바일 최적화된 사이트에서는 67% 사용자가 재방문하거나 구매의 의사가 있다고 했으며, 모바일 최적화가 되지않은 경우 61% 사용자는 그냥 나간다고 말했습니다.

– 모바일 최적화가 되지 않은 사이트를 방문한 경우 사용자의 55% 는 그 사이트 브랜드의 실망했다고 했습니다.

위와 같은 통계 자료를 봐도 모바일 친화적인 사이트가 브랜드 인지도나 사용자 경험적인 측면에서 매우 중요하다는것을 알수 있습니다.

 

사용자들이 모바일 사이트에 대해서 원하는것은 무었일까요?

Screen-Shot-2012-09-25-at-5.58.58-AM-600x345

위의 그림을 보시면 사용자들이 원하는게 무었인지 쉽게 알수 있습니다.

사용자의 76%는 위치나 영업시간을 61%는 전화 하기를 54% 는 이메일 전송을 53%는 앱 다운로드를 48%는 회사의 소셜 네트워크 페이지로 이동하기를  41% 는 비디오를 재생하기를 원합니다.

모바일 사이트를 제작 할때 위의 요소를 충분히 고려해야 할것 같습니다.

 

모바일 친화적인 방법으로 사이트를 제작 하려면 어떻게 해야 할까요??

여러 가지 방법이 있지만 오늘은 구글에서 제공하는 GOMO  의 대해서 소개 해볼까 합니다.

GOMO 는 구글에서 제공하는 모바일 사이트 제작의 대해 많은 정보가 있는 사이트입니다.

모바일 사이트를 구축할수도 있으면, 현재 있는 모바일사이트가 모바일 친화적인 사이트인지 셀프 테스트도 가능하며, 모바일 웹 제작 방법의 대해서 팁도 주고 모바일 사이트 제작해주는 에이젼시 또한 소개 해주고 있습니다.

 

모바일 사이트 테스트하기~!

구글에서 제공하는 GOMO 라는 사이트에서 모바일 친화적인 사이트인지 아닌지 테스트를 할수 있는 기능 있습니다.

test_site2

* GOMO 에서는 총 6 가지 정도 를 테스트 합니다.

– Loading Speed : 페이지 로딩속도를 말하며 구글에서는 5초 이하에 속도를 추천

– Image : 모바일 사이트의  이미지가 깨지는지 아닌지의 대해 확인.

– Text : 줌 하지 않아도 텍스트를 읽을수 있는것을 추천.

– Navigation : 사이트 내 링크와 버튼을 엄지 손가락으로 터치할수 있는것을 추천.

– Hierarchy : 탐색이 기능이 있는것을 추천.

– Accessibility : 검색기능에 쉽게 접근할수 있는것을 추천.

위와 같이 총 6가지 정도를 테스트 합니다. 네이버 모바일 사이트를 테스트 했더니 6점 만점에 6점이 나왔네요~! 특히 페이지 로딩 스피트에선 1.76% 로 매우 빠르게 나왔습니다.

상단 이미지처럼 간략하게 정보를 제공 해주기도 하지만 상세 리포트는 PDF 파일로 다운로드도 가능합니다. 상세 리포트에선 각 항목에 대해서 좀더 자세히 알려주고 어떻게 제작하면 모바일 친화적인 사이트인지의 대해 팁도 알려 줍니다.

 

모바일 사이트 제작하기~!

GOMO 사이트에서는 모바일 사이트 제작하는 기능 또한 제공해줍니다.

현재 웹 페이지로만 존재하는 사이트를 모바일 친화적인 사이트로 쉽게 변환 할수 있습니다.

총 4가지 과정을 통해 웹 페이지가 모바일 친화적인 사이트로 변신을 합니다.

1. Select Layout : 모바일 친화적인 사이트로의 페이지 레이아웃 셋팅 및 배경색등을 설정할수 있음.

2. Edit Site :  로고, 네비게이션,전화, 지도등 세부적인 설정을 할수 있음.

3. Save Site : 완성 된 사이트의 임시 URL 이 제공해줍니다.

4. Go Live :  모바일에서 웹사이트로 접속시 모바일 친화적 페이지로 Redirect 해주는 방법에 대해서 알려 주고 있습니다.

위의 방법 으로 제가 간단하게 아티언스 사이트를 모바일 친화적인 사이트로 바꾸어 봤습니다.

2012-11-27_14-39-34

왼쪽이미지는 현재 아티언스 웹사이트를 스마트폰에서 접속할때 보여지는 화면 입니다. 그리고 오른쪽은 GOMO 를 통해 간단하게 제작해본 것입니다.

 

마무리하며…

스마트폰은 이제 완전히 대중화 되었고 PC 보다 타블렛이나 모바일을 통해 웹서핑을 많이 하는 시대가 왔습니다. 하지만 아직은 모바일 친화적이지 못한 사이트가 너무나도 많습니다.

여러분의 사이트는 지금 모바일 친화적 사이트가 존재 한가요??

아직 미쳐 모바일 친화적인 사이트가 없다면 이번기회를 통해 GOMO 를 사용하여 제작해보는것은 어떨까요??