ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • 시사 상식 : 구글 AMP 봐봐요
    카테고리 없음 2020. 2. 22. 09:27


    >


    안녕하세요. 동아인 여러분!CIA 9기 마지에 분입니다.


    보람찬 여름휴가를 보내셨나요?긴 여름방학이 끝나고, 드디어 개학이 다가오네요.


    다들 이번 학기 동안 다짐했던 감정을 한 학기 동안 이루기를 바라면서! 제가 오핸시널을 준비한 주제는 구글 AMP입니다. 구글 AMP는 Accelerated Mobile Pages의 약자로 모바일에서 웹 컨텐츠를 빠르게 하기 위해서예요.휴대기기(모바일)에서의 빠른 로드에 최적화된 HTML 페이지입니다.이것이 왜 필요한가...?!한 조사 결과에 따르면 웹 페이지 로딩 때 때 로이 10초가 될 경우 이가 면률은 약 58%에 이른다고 하네요.저도 SNS를 해서 기사를 볼 때 로딩이 늦어지면 살짝 이따가 가도록...


    >


    AMP의 핵심은 모바하나 웹로드 시간의 단축이라고 합니다. 모바하나웹은 PC웹과는 달리 OS, 기기성능, 통신망 구축 정도에 따라 웹페이지가 생성되는 시간이 크게 달라질 수 있습니다.그래서 역시 많은 사람들이 모바하나에서 다양한 콘텐츠를 소비하는 현실이 AMP 프로젝트의 배경에 있습니다.실제로 지금 시대에 스마트폰 보급률이 매우 높았던 것은 사실이니까요.구글AMP를 적용하면 클릭과 거의 동시에 콘텐츠를 볼 수 있을 정도로 빠르다고 하네요! Wow!실제 AMP프로젝트를 시범 운영한 SNS핀터 레스트는 기존의 모 바하나 페이지보다 4배 빠른 로딩과 8분의 한가지 수준의 데이터 사용량의 효과를 봤다는!정 이야기 너무 같네요!!


    리처드 긴 글라스, 구글 뉴스 총괄은 "모든 사용자의 무바 1웹 환경을 개선하는 데 한 골소움 온 것"이라며"AMP를 활용하면 모든 오픈 무바 1웹과 앱에서 쉽게 콘텐츠를 신속하게 로드할 수 있다"와 AMP의 의미를 설명했습니다.


    >


    사양 AMP의 작동원리가 궁금하시죠? (찡긋) 그럴 줄 알고 준비해 왔습니다.AMP의 작동 원리는 크게 3단계로 나눕니다.첫 번째, 페이지 구성의 단순화입니다. 이것은 자바스크립트 코드를 최소화하고 필요한 기능은 태그 컴포넌트로 해둔다. 구글은 'AMP 자바스크립트'라는 라이브러리를 재공합니다.2번째는 대역 폭의 최적화입니다. 최적화된 해상도 이미지를 찾고, 디바이스에 최적화된 콘텐츠를 노출하며, 비동기 로드를 통해 뉴스 소비 경험을 개선합니다.비동기 로드란 뉴스를 읽는 데 중심이 되는 텍스트를 먼저 띄우고 용량이 큰 이미지를 나중에 받는 방식이라고 합니다.마지막 3번째는 페이지 캐싱입니다. 구글은 AMP를 적용한 뉴스 데이터를 저장(캐싱)합니다. 사용자가 뉴스를 읽고 싶다고 요청하면 언론사 서버가 아니라 미리 캐싱한 데이터를 보여줌으로써 로드시간을 획기적으로 줄이는 방법을 쓴 것입니다.그럼 마지막으로 Google AMP의 장점과 단점에 대해 살펴보겠습니다.AMP의 장점은 현재 Word Press 사이트를 운영하고 있다면, 이미 작성한 글을 AMP로 바꾸는 것이 내용이 더 쉽다는 것입니다.많은 경우, AMP 플러그인을 설치하는 것만으로 AMP로 동작한다고 합니다. 또, 원래 사용하던 아이드 센스나 결제 수단도, 소유자로서 AMP 페이지에서 사용할 수 있습니다.AMP의 단점은 기존에 있던 웹 디자인을 유지하면서 AMP로 하는 것이 매우 어렵다고 합니다. AMP 페이지의 가장 큰 사건은 새 태그를 이용하여 웹 컨텐츠를 다루는 방식에 적응해야 합니다. 만약 기존 웹에서 AMP에서 지원하지 않는 HTML태그를 사용한 면 즉석에서 에러를 표시할 것입니다.이 오류를 확인하는 비결은 구글 관리자 툴에서만 가능합니다.개발하기엔 이내용 귀찮지만 사용자인 우리는 사실 단점이 없네요.이것으로 포스팅 마치도록 하겠습니다읽어주셔서 감사합니다




    댓글

Designed by Tistory.