의견.png

"모바일 퍼스트"의 두 판 사이의 차이

해시넷
이동: 둘러보기, 검색
(모바일 퍼스트 전략)
5번째 줄: 5번째 줄:
 
이러한 제약들이 모두 모바일 사이트를 보다 컨텐츠 중심으로 불필요한 기능/형식/꾸미기/이동 등을 강제로 최소화시키는 집중된 사이트를 만들게 하는 요인이라는 것이다.
 
이러한 제약들이 모두 모바일 사이트를 보다 컨텐츠 중심으로 불필요한 기능/형식/꾸미기/이동 등을 강제로 최소화시키는 집중된 사이트를 만들게 하는 요인이라는 것이다.
 
개발자들이 모바일 퍼스트를 원칙으로 사이트를 만들면서, 사이트가 진짜로 제공해야 할 내용과 기능이 무엇인지 깨닫게 되었다고들 하고, 사용자들 또한, 데스크탑 사이트보다 모바일 사이트가 훨씬 사용하기 편하고, 자신이 원하는 작업을 빠르게 처리한다고 이야기 한다.<ref name="그누보드"></ref>
 
개발자들이 모바일 퍼스트를 원칙으로 사이트를 만들면서, 사이트가 진짜로 제공해야 할 내용과 기능이 무엇인지 깨닫게 되었다고들 하고, 사용자들 또한, 데스크탑 사이트보다 모바일 사이트가 훨씬 사용하기 편하고, 자신이 원하는 작업을 빠르게 처리한다고 이야기 한다.<ref name="그누보드"></ref>
 +
  
 
== 원칙/기법 ==
 
== 원칙/기법 ==
21번째 줄: 22번째 줄:
 
최신기술 보다는 비효율적일지라도 다양한 소비자 층에게 서비스가 가능하다는 점에 의의가 있다. <ref name="고베베"></ref> 고사양 기기나 현대적인 브라우저에 맞춰진 웹 사이트가, 그렇지 못한 기기나 브라우저 에서도 큰 장애가 없이 우아하게 보여질 수 있도록 준비하는 것 또한 중요할 것 이다.<ref name="그누보드"></ref>
 
최신기술 보다는 비효율적일지라도 다양한 소비자 층에게 서비스가 가능하다는 점에 의의가 있다. <ref name="고베베"></ref> 고사양 기기나 현대적인 브라우저에 맞춰진 웹 사이트가, 그렇지 못한 기기나 브라우저 에서도 큰 장애가 없이 우아하게 보여질 수 있도록 준비하는 것 또한 중요할 것 이다.<ref name="그누보드"></ref>
  
== 사례 ==
+
== 모바일 퍼스트 전략 ==
 +
 
 +
=== 근거 ===
 +
 
 +
==== 효율성 ====
 +
#모바일은 앞으로 다가오는 플랫폼이 아닌 이미 대중적으로 상용화 되고 있는 플랫폼이다.
 +
#현재는 데스크탑 유저 보다 모바일 유저가 공유하는 정보가 많다.
 +
#실제로 일부 마케터들은 이미 모바일 유저를 겨냥한 서비스를 지원하고있다.
 +
 
 +
각 회사들은 홈페이지를 개설해왔다. 현재는 아직도 데스크탑 웹 전용, 모바일 전용 홈페이지를 따로 구축해서, 업데이트 내용을 웹, 모바일 홈페이지에
 +
반복해서 처리해야 하기 때문에 보다 효율적으로 PC~아이패드~탭~스마트폰 까지 총망라하는 [[반응형웹]]을 구조하는 기술력이 주목받고있다. 한 번의 웹 사이트 구축으로 모든 모바일을 만족시킬 수 있기 때문이다.
 +
 
 +
==== PC, 각종 미디어와 모바일의 경계 ====
 +
[[파일:M1 맥북프로 2020년형.jpg]]
 +
 
 +
이전에는 PC 프로세서와 모바일 프로세서는 각기 다른 구조로 설계되고 있었다. PC용 프로세서는 성능 향상에 치중하는 반면, 모바일 용 프로세서는 배터리 유지 시간과 성능 향상 양쪽을 모두 신경 써야 하기 때문이다. 목적 자체가 달랐기 때문에 내부 구조도 다를 수 밖에 없었던 것이다. 그러나 현재는 PC에 사용되는 프로세서 모바일 프로세서를 통합하는 기술도 개발되었다. 프로세서가 통합됐다는 것은 단순히 두 종류의 프로세서를 만들던 것을 한 종류만의 프로세서로 통합해 기기의 생산 단가를 절감 시키는 것 이상의 가치를 갖고 있다.<ref> 김봉균 기자, 〈[http://www.jaturi.kr/news/articleView.html?idxno=6912 스마트폰과 태블릿, PC의 경계가 모호해진다]〉, 《자투리경제》, 2021-04-25 </ref>
 +
이러한 기술을 바탕으로 애플은 오랜 기간 활용했던 인텔 프로세서가 아닌 [[M1]]칩을 탑재한 새로운 맥북을 출시했다. M1 칩 탑재로 아이폰 혹은 아이패드에서 활용했던 앱을 PC 환경에서 편리하게 구현할 수 있게 됐다. 이로 인해 기기 간 경계가 허물어지게 되었음을 증명했다.<ref> 김용운 기자, 〈[http://www.sobilife.com/news/articleView.html?idxno=28772 스마트폰과 PC의 경계가 무너진다, IT기업의 새로운 도전]〉, 《소비라이프》, 2020-12-08 </ref>
  
=== 모바일 퍼스트 전략 ===
+
 
 +
 
 +
 
 +
=== 실제 사례 ===
  
  
59번째 줄: 79번째 줄:
 
* 김춘동 기자, 〈[http://news.bizwatch.co.kr/article/consumer/2018/12/20/0007 홈앤쇼핑, '모바일 퍼스트'로 스마트쇼핑 진화 주도]〉, 《비즈니스 와치》, 2018-12-20
 
* 김춘동 기자, 〈[http://news.bizwatch.co.kr/article/consumer/2018/12/20/0007 홈앤쇼핑, '모바일 퍼스트'로 스마트쇼핑 진화 주도]〉, 《비즈니스 와치》, 2018-12-20
 
* 김소희 기자, 〈[https://www.shinailbo.co.kr/news/articleView.html?idxno=1377708 신세계인터내셔날, 모바일 퍼스트 전략 추진]〉, 《신아일보》, 2021-02-16 </ref>
 
* 김소희 기자, 〈[https://www.shinailbo.co.kr/news/articleView.html?idxno=1377708 신세계인터내셔날, 모바일 퍼스트 전략 추진]〉, 《신아일보》, 2021-02-16 </ref>
 +
 
== 같이 보기 ==
 
== 같이 보기 ==
 
* [[모바일]]
 
* [[모바일]]

2021년 8월 4일 (수) 16:57 판

모바일 퍼스트(mobile first)란 웹디자인에 관해서, 모바일에 최적화된 구성을 우선시 해야 한다는,LukeW가 주장한 철학이자 전략이며, 반응형 웹 디자인을 기반으로 한 개념이다. [1]

개요

LukeW는 모바일 퍼스트가 가능한 이유와 필요한 이유에 대해, 모바일의 엄청난 성장은 기회이고, 모바일 기기의 제약이 초점이며, 그리고 모바일 기기의 기능은 혁신이라는 주장을 내세웠다. 모바일의 성장과 모바일 기기가 가지고 있는 기능들에 대해서는 우리가 일상생활에서 지켜보고 또 사용하고 있으니 다시 얘기할 필요가 없겠지만,모바일의 성장과 모바일기기의 기능들은 나날히 발전하며 혁신 그 자체의 모습을 보이고 있다. 하지만 이 모바일 기기의 제약을 기회의 초점으로 둔 것이 모바일 퍼스트의 핵심이다. LukeW가 제시한 모바일의 대표적인 세가지 제약은 스크린의 크기, 네트워크의 속도와 품질, 사용할 수 있는 모드 등이다. 이러한 제약들이 모두 모바일 사이트를 보다 컨텐츠 중심으로 불필요한 기능/형식/꾸미기/이동 등을 강제로 최소화시키는 집중된 사이트를 만들게 하는 요인이라는 것이다. 개발자들이 모바일 퍼스트를 원칙으로 사이트를 만들면서, 사이트가 진짜로 제공해야 할 내용과 기능이 무엇인지 깨닫게 되었다고들 하고, 사용자들 또한, 데스크탑 사이트보다 모바일 사이트가 훨씬 사용하기 편하고, 자신이 원하는 작업을 빠르게 처리한다고 이야기 한다.[1]


원칙/기법

콘텐츠를 네비게이션(navigation) 보다 우선시 해야 한다. 일반적으로 웹사이트 디자인 시 따로 따로 떨어져 있는 페이지들을 어떻게 잘 연결하느냐가 중요한 문제이기에, 페이지 상단과 좌측 또는 하단의 많은 영역을 네비게이션(navigation)으로 할당한다. 하지만 스크린이 작은 모바일의 경우, 특히 상단이나 좌측의 네비게이션을 화면에 먼저 보여주는 구조이기 때문에, 실제로 중요한 콘텐츠는 스크롤을 한참 해야 보이는 문제가 발생하기도 한다. 이런 문제점은 예를 들어, youtube 등의 모바일 버전에서도 알 수 있듯이, 메뉴/네비게이션은 상단의 한 버튼으로 축소시켜놓고, 첫 화면부터 콘텐츠를 보여주는 것으로 해결한다.[1]

접근 방식

점진적 향상법

점진적 향상법은 기초부터 차근차근 기능을 개선하는 방법이다. 한 번에 만드는 것이 아니라 기능을 점차 늘려가는 방식이다.[2] 점진적 향상법은 모바일 퍼스트 전략에 접근 방법 중 하나라고 볼 수 있다. 원래 정의는 저사양의 기기나 오래된 브라우져에 맞춰서 디자인된 웹 사이트가 고사양 기기의 현대적인 브라우져는 보다 많은 기능과 스타일을 제공하는 것이다. 이를 모바일 퍼스트처럼 반응형 웹의 기본적 스타일이나 스크립을 저사양 혹은 오래된 브라우저에 맞추는 것으로 볼 수 있다.


우아한 성능 저하법

, 우아한 성능 저하법 은 먼저 최신 기술로 만들어 놓고, 최신 기술이 적용되지 않는 곳에 유사하게 적용되게 하기 위하여 대체 기술을 사용하여 만드는 방식이다. 최신기술 보다는 비효율적일지라도 다양한 소비자 층에게 서비스가 가능하다는 점에 의의가 있다. [2] 고사양 기기나 현대적인 브라우저에 맞춰진 웹 사이트가, 그렇지 못한 기기나 브라우저 에서도 큰 장애가 없이 우아하게 보여질 수 있도록 준비하는 것 또한 중요할 것 이다.[1]

모바일 퍼스트 전략

근거

효율성

  1. 모바일은 앞으로 다가오는 플랫폼이 아닌 이미 대중적으로 상용화 되고 있는 플랫폼이다.
  2. 현재는 데스크탑 유저 보다 모바일 유저가 공유하는 정보가 많다.
  3. 실제로 일부 마케터들은 이미 모바일 유저를 겨냥한 서비스를 지원하고있다.

각 회사들은 홈페이지를 개설해왔다. 현재는 아직도 데스크탑 웹 전용, 모바일 전용 홈페이지를 따로 구축해서, 업데이트 내용을 웹, 모바일 홈페이지에 반복해서 처리해야 하기 때문에 보다 효율적으로 PC~아이패드~탭~스마트폰 까지 총망라하는 반응형웹을 구조하는 기술력이 주목받고있다. 한 번의 웹 사이트 구축으로 모든 모바일을 만족시킬 수 있기 때문이다.

PC, 각종 미디어와 모바일의 경계

M1 맥북프로 2020년형.jpg

이전에는 PC 프로세서와 모바일 프로세서는 각기 다른 구조로 설계되고 있었다. PC용 프로세서는 성능 향상에 치중하는 반면, 모바일 용 프로세서는 배터리 유지 시간과 성능 향상 양쪽을 모두 신경 써야 하기 때문이다. 목적 자체가 달랐기 때문에 내부 구조도 다를 수 밖에 없었던 것이다. 그러나 현재는 PC에 사용되는 프로세서 모바일 프로세서를 통합하는 기술도 개발되었다. 프로세서가 통합됐다는 것은 단순히 두 종류의 프로세서를 만들던 것을 한 종류만의 프로세서로 통합해 기기의 생산 단가를 절감 시키는 것 이상의 가치를 갖고 있다.[3] 이러한 기술을 바탕으로 애플은 오랜 기간 활용했던 인텔 프로세서가 아닌 M1칩을 탑재한 새로운 맥북을 출시했다. M1 칩 탑재로 아이폰 혹은 아이패드에서 활용했던 앱을 PC 환경에서 편리하게 구현할 수 있게 됐다. 이로 인해 기기 간 경계가 허물어지게 되었음을 증명했다.[4]



실제 사례

CJ 온스타일

CJ온스타일 모바일.jpg

2021년 5월 , CJ 오쇼핑 계열의 모든 쇼핑 채널을 통합한 새로운 브랜드 CJ 온스타일을 출범했다. 모바일 퍼스트 전략을 적극적으로 이용하며 론칭 직후부터 2021년 6월까지 한달 간 큰 관심을 받게 되었다. 론칭 이후 3일간의 실적을 분석했을때, 모바일 앱 주문 고객이 전년 동기와 대비 43% 증가했다. 모바일 앱을 통한 주문 수는 전년 동기와 대비해 61% 증가했다. '모바일 라이브 커머스'를 통해 고객과의 소통을 이어갔다. 최근 TV와 모바일 등 미디어 매체 간 경계가 사라지는 환경에 맞춰 '모바일 퍼스트' 전략으로 패러다임을 바꾸겠다는 입장이었다. [5]


홈앤쇼핑

홈앤쇼핑 모바일.jpg

2013년 처음으로 모바일 서비스를 시작 한 이후에 2018년, 본격적으로 모바일 퍼스트 전략을 강화하겠다는 의사를 밝혔다. 먼저, 홈쇼핑의 고객층은 40대 부터 50대 이상 장년층의 비율이 가장 크다. 이러한 40대와 50대의 고객들이 보다 쉽고 편리하게 모바일 앱을 이용 할 수 있도록 안내를 강화하였고, 모바일로 주문하면 10%를 할인해주고, 10%를 별도로 적립해주는 '텐텐 프로모션'으로 모바일 비중을 높였다. 이 외에도 모바일 전용 방송 서비스 '모바일 2채널'과 빅데이터를 이용하여 고객이 원하는 맞춤 상품을 추천해주는 큐레이션 서비스, 모바일 특가샵, 인기상품 추천, 음성검색 고도화 등 다양한 서비스를 추가하였다. 그 결과 홈앤쇼핑은 2018년을 기준으로 2015년 5월부터 국내 홈쇼핑 앱 부문에서 순 이용자 수 1위를 기록했다. 특히 홈앤쇼핑 단독 이용자 비율은 15.3%를 달성하며 종합쇼핑몰 업계 1위, 전체 커머스 업계 3위에 올랐다.[6]


에스아이빌리지(S.I.VILLAGE)

신세계 인터내샤날 모바일.jpg

2021년 2월, 신세계 인터내샤날이 온라인 경쟁력 강화를 위해 모바일 퍼스트 전략을 추진했다. 자체 온라인 몰 에스아이빌리지(S.I.VILLAGE)의 모바일 화면을 7개 전문관으로 리뉴얼했다. 모바일에 최적화된 메뉴 구성과 서비스로 소비자 이용을 늘려 올해 온라인 몰 거래액을 2500억원까지 끌어올릴 것을 계획했다. 만약 이 계획에 성공하게 된다면 지난해보다 2배가량 증가한 수치로 업계 최고 수준의 성장률을 이룬다는 것이다. 신세계 인터내셔냘이 모바일 퍼스트 전략을 선택하며 모바일 앱을 리뉴얼하게 된 이유는 현재 온라인 쇼핑 시장이 급속도로 커지고 그 성장의 핵심에 모바일이 있기 때문이다. 이번 리뉴얼의 가장 큰 특징은 모바일 화면에서 단번에 원하는 분야로 이동할 수 있도록 소비자가 즐겨 찾는 카테고리를 선정해 7개의 전문관을 만든 점이다.각 전문관의 초기 화면 역시 원하는 제품을 쉽게 찾을 수 있도록 카테고리를 세분화하고 모바일에 최적화되게 배치했다는 점도 주목해야 한다. 모바일 퍼스트 전략의 핵심은 고객의 쇼핑 편의를 획기적으로 높여 독보적인 경쟁력을 확보하는 것이라고 주장했다.[7]

각주

  1. 1.0 1.1 1.2 1.3 전진, <반응형 웹 디자인/모바일 퍼스트의 이해>, 《그누보드》
  2. 2.0 2.1 고베베, 〈점진적 향상법과 우아한 성능 저하법〉, 《티스토리》, 2018-06-11
  3. 김봉균 기자, 〈스마트폰과 태블릿, PC의 경계가 모호해진다〉, 《자투리경제》, 2021-04-25
  4. 김용운 기자, 〈스마트폰과 PC의 경계가 무너진다, IT기업의 새로운 도전〉, 《소비라이프》, 2020-12-08
  5. 최은지 기자, 〈'모바일 홈쇼핑' CJ온스타일, 모바일 퍼스트 전략 "통했다"〉, 《증권경제신문》, 2021-06-09
  6. 김춘동 기자, 〈홈앤쇼핑, '모바일 퍼스트'로 스마트쇼핑 진화 주도〉, 《비즈니스 와치》, 2018-12-20
  7. 김소희 기자, 〈신세계인터내셔날, 모바일 퍼스트 전략 추진〉, 《신아일보》, 2021-02-16

참고자료

같이 보기


  의견.png 이 모바일 퍼스트 문서는 모바일에 관한 토막글입니다. 위키 문서는 누구든지 자유롭게 편집할 수 있습니다. [편집]을 눌러 이 문서의 내용을 채워주세요.