프로그레시브 웹 앱 (PWA, Progressive Web Apps) 개발

프로그레시브 웹 앱 (PWA, Progressive Web Apps )

‘프로그레시브 웹 앱스(Progressive Web Apps. PWA)’는 구글 크롬 엔지니어 알렉스 러셀이 2015년에 고안한 개념으로 Google I/O 2016에서 소개된 미래의 웹기술이며, PWA라고 줄여서 부르기도 합니다. PWA는 앱 수준으로 점진적으로 발전해 나가는 웹을 지향한다. 궁극적으로는 앱 수준과 같은 사용자 경험을 웹에서 제공하는 것이 목적입니다.

 

왜 PWA인가?(PWA 의 강점)

워드프레스로 만든 사이트를 app으로 전환하거나 PWA로 워드프레스 사이트를 구축하시면( 발췌 : 프로그레시브 웹앱(Progressive Web Apps)이란?  )

  • 네이티브 앱은 플랫폼(안드로이드, iOS)처럼 종속되어 개발하는데에 많은 시간과 노력이 필요한데 PWA는 web이 연장하여 발전시킨 것으로 web 구축에 들어가는 시간과 노력이 들고 추가 구측비용이 매우 저렴합니다.  
  • 앱(app)은 자연검색에 노출되지 않지만 PWA는 웹(URL, 사이트)이므로 검색엔진(네이버, 구글, 다음, 줌 등)에 노출되어 자연스럽게 유입을 얻을 수 있고( SEM( 검색엔진마케팅, Search Engine Marketing ) 이 가능합니다. ( 참고로, 이 사이트, seenbuy.kr 는 18.9.22 기준 대략 월 2,250 건을 모바일기기를 통해 자연검색 유입(네이버, 구글, 다음, 줌 등을 통한 유입)을 얻고 있습니다.  클릭당 비용을 1,000원이라고 가정하고 이것을 클릭당 광고비용으로 환산하면 월 225만원의 광고효과를 무료로 얻을 수 있음을 의미합니다 ) 
  • 홈 스크린(Home Screen)에 바로가기 아이콘을 추가하여 쉽게 찾아올수 있게 할 수 있으며(유입 및 재방문을 크게 늘릴 수 있으며)
  • 관련된 푸시 알람(Notification)을 보내어 재유입 또는 전환을 이끌 수 있습니다. (이것은 기존에 가장 저렴하면서도 유효한 마케팅 기법이면서도 국내에서만은 외면당했던 e-mail marketing 이 가능함을 의미합니다. 또한 무료 SMS marketing 대체제로서의 가능서을 보여줍니다.)
  • 이외에도 오프라인 상태에서도 작동하여 웹서버가 중지되어도 사용자는 해당 사이트를 이용할 수 있으며
  • 일반 web에 비해 4배나 빠른 loading 속도로 검색엔진최적화에 높은 점수를 받아 상위에 랭크될 수 있는 강점(사업성)이 있습니다. 

 

예시

프로그레시브 웹 앱 (PWA, Progressive Web Apps )으로 구축된 쇼핑몰 예시

스마트폰에서 확인하시려면 click하세요. http://bit.ly/pwacommerce

PWACOMMERCE – PRO EDITION_1 PWACOMMERCE – PRO EDITION_2 PWACOMMERCE – PRO EDITION_3

 

프로그레시브 웹 앱 (PWA, Progressive Web Apps )으로 구축된 홈페이지/블로그 예시

아래의 화면은 프로그레시브 웹앱으로 구축된 사이트를 보여주는 화면입니다. 폰에 바로가기가 있다는 점, 앱과 같은 완벽한 사용자 경험을 제공하다는 점, 그리고 엄청나게 빠르다는 것을 쉽게 확인할 수 있습니다.

 

( 출처 : 구글의 ‘프로그레시브 웹 앱스’를 아십니까? )

 

 

 

프로그레시브 웹 앱 (PWA, Progressive Web Apps ) 개발 비용

  • 쇼핑몰 : 800,000 /사이트(VAT 별도)
  • 홈페지이/블로그 :  800,000 /사이트(VAT 별도)
  • https 구축 비용 : 200,000 원 /사이트당(VAT 별도)
  • 개발 전제 조건

       1. 귀사의 사이트가 워드프레스로 구축되어 있어야 가능합니다.

       2. 귀사의 사이트가 “https://”이어야 합니다. (귀사의 서버에 보안인증서가 설치되어 있어 통신프로토콜로 SSL을 사용하시고 있어야합니다. )

 

Tip

직접 개발하시고자 하시는 회사나 개인은 아래의 저희의 다른 게시글을 참조하세요

프로그레시브 웹 앱 (PWA, Progressive Web Apps )

프로그레시브 웹 앱 (PWA, Progressive Web Apps )

워드프레스 프로그레시브 웹 앱 플러그인 Progressive Web App plugin : WordPress Mobile Pack plugin

워드프레스 프로그레시브 웹 앱 플러그인 Progressive Web App plugin : WordPress Mobile Pack plugin

앱프로그래밍 지식없이 워드프레스 사이트를 앱으로 만들기(앱개발)

앱프로그래밍 지식없이 워드프레스 사이트를 앱으로 만들기(앱개발)