안녕하세요. 거북이 미디어 전략 연구소장입니다.

구글 ‘더 나은 뉴스’ 세미나의 세션 5 ‘AMP(Accelerated Mobile Pages’ 발표 자료를 정리했습니다.

▲ 잡설

페이스북이 2015년 5월 출시한 인스턴트 아티클에 대응해 구글이 급하게 출시한 것처럼 보이는 제품이 AMP(Accelerated Mobile Pages : 가속화된 모바일 페이지)입니다.

제가 2017년 10월에 작성한 포스트 ‘페이스북 인스턴트 아티클과 구글 AMP 이야기’를 보시면 양 제품에 대한 요약 설명을 불 수 있습니다.

‘페이스북 인스턴트 아티클과 구글 AMP 이야기 #1’

‘페이스북 인스턴트 아티클과 구글 AMP 이야기 #2(한국 미디어 시장 중심)’

페이스북은 2017년 하반기부터 본사가 가짜뉴스 이슈에 휩싸이면서 주커버그가 청문회에 출석하는 등 외부 환경 대응 때문에 인스턴트 아티클 등 사업에 집중하지 못하는 것 같다는 ‘느낌’입니다.

구글은 여전합니다. 정해진 스케줄에 따라 신규 제품을 홍보하고 교육하는 등 지속적으로 활동하는 ‘느낌’입니다.

잡설은 그만 두고 본론으로 돌아가겠습니다~

▲ AMP란 무엇인가?

구글은 AMP를 아래 그림과 같이 설명했습니다.

AMP란 웹 페이지를 강력하고 부드럽고 거의 즉시 로딩 되도록 만들 수 있도록 하는 오픈소스 라이브라리다.

AMP is an open-source library that provides a straightforward way to create web pages that are compelling, smooth, and load near instantaneously for users.

역시 매뉴얼은 읽어도 뭔 소린지 ㅠㅠ

구글 AMP는 기존의 모바일웹보다 빠르게 로딩 되도록 만들어진 페이지입니다. 번개처럼요~

※ 구글 AMP 사이트

▲ AMP 현황 등

구글 amp 현황 및 효과
구글 amp 현황 및 효과

○ 현황

– 40억 AMP 페이지가 있음

– 2천500만개 도메인이 AMP를 생산

– 매주 5천500만 페이지가 생성됨

○ 효과(일반 모바일웹 페이지 대비)

– AMP에서 2배 이상 머뭅니다

– 평균보다 3배 높은 클릭률

– 평균보다 2~3배 높은 수익

○ 3가지 구성요소

– AMP HTML : 믿을만한 성능을 위해 기존 HTML보다 제한사항을 둔 HTML

– AMP JS : AMP HTML을 빠르게 구현하기 위한 자바스크립트

– AMP Cache : AMP HTML을 서빙하기 위한 캐시

▲ AMP 편견 깨기

이건 무슨 이야기인지는 모르겠지만 AMP를 통해 아래와 같은 것들을 모두 구현 가능하다는 이야기로 보입니다.

amp mythbusting 1
amp mythbusting 1

– AMP 캐러셀 제작

– AMP 사이드바

– AMP 유튜브

– 제품을 개선하고 쇼핑카트에 추가

– 동적으로 폼의 유효성 검사

– API을 요구하거나 결제해 구매하기

AMP mythbusting2
AMP mythbusting2

▲ AMP 스토리

AMP가 2016년 2월 발표된 시기에는 주로 텍스트와 이미지 중심이었던 것으로 보입니다.

구글은 2018년 AMP 스토리라는 비주얼적인 스토리텔링 포맷을 추가로 발표했습니다.

제가 개발자가 아님에도 뭔가 구현에 어려움이 있을 것 같습니다 ㅎㅎ

아래를 눌러보시면 와이어드와 CNN이 만든 AMP 스토리를 보실 수 있습니다.

https://www.wired.com/amp-stories/space-photos-of-the-week-111817/

https://edition.cnn.com/ampstories/us/still-missing-cassini-heres-what-else-is-out-there 

▲ Canonical AMP(AMP 페이지를 데스크탑에도 적용)

Canonical AMP는 AMP 페이지를 기본으로 데스크톱도 통일되게 만드는 것을 의미한 것 같습니다(?)
자신은 없습니다만 ㅎㅎ

일반적으로 언론 매체의 경우 AMP 페이지는 기존 사이트에 부가적으로 운영하는 느낌입니다

그래서 기존 사이트보다 적은 콘텐츠가 AMP에 올라가게 되고 이것은 AMP가 더 적은 트래픽을 받게 된다는 것을 의미합니다.

구글은 이를 바꾸기 위해 AMP가 더 많은 사용시간과 더 높은 광고 수익을 가져온다는 것을 강조하고 있습니다.

어차피 AMP 페이지는 각각의 매체가 직접 제작하게 되는 것이니까요.

구글은 AMP 페이지를 모바일웹의 통합 페이지로 변경하고 데스크톱도 이에 맞게 통일하는 것을 권고하게 됩니다. 이게 바로 Canonical AMP입니다.

이렇게 할 경우 매체는 당연히 서버비용을 절감하게 되고 빠른 속도로 인해 독자 경험이 증가하며 인당 사용시간이 증가해 광고수익이 증가되는 선순환 효과를 경험하게 됩니다. 이론적으로는요…

이탈리아의 Mediaset라는 곳이 Canonical AMP를 적용해서 모바일 APM 페이지의 캐로셀을 데스크톱으로 옮겼습니다. 일종의 반응형 웹이라고 보시는 게 맞을 것 같습니다.

amp canonical example site
amp canonical example site

제가 알기로는 현재까지의 반응형웹은 데스크톱에서 기본 구성을 하고 이것을 모바일 등 각 사이즈에서 콘텐츠가 변화되도록 했다면 AMP Canonical은 모바일을 표준으로 한 반응형에 가까운 듯 합니다.

Canonical AMP를 적용한 결과 데스크톱에서 아래의 결과를 가져왔다고 합니다.
.

– AMP를 단일한 버전으로 데스크탑과 모바일에 펼침

– 두 번째 조회할 경우 start render가 3초에서 1.6초로 빨라짐(47%), 로딩타임이 7.6초에서 2.7초로 빨라짐

– 처음 조회할 경우, 전체 로딩 시간이 77.5초에서 7.6초로 90% 빨라짐

▲부록 : SEO 가이드라인

검색최적화(SEO:Search Engine Optimization)는 한국의 수많은 언론사들의 고민사항입니다.

2016년 정도에 S모 방송사의 개발자가 1년간 구글 SEO를 진행해왔는데 효과가 미진한 것으로 보인다는 고민을 털어놨습니다.

SEO 작업은 어찌 생각하면 가성비가 안 맞는 것처럼 보이기도 합니다.

SEO를 잘한 인지도 10등 정도의 매체보다는 SEO가 안된 1등 매체가 검색에 더 많이 등장하게 될 가능성이 높기 때문입니다.

검색 알고리즘은 사용자가 더 많이 찾는 검색어를 상단에 올려주기 때문이죠 ㅎㅎ

구글이 밝힌 (AMP) SEO 가이드라인을 부록으로 올립니다.

○ 2018년 7월부터 사이트 속도가 랭킹 factor 중 하나다

○ 구조화된 메타 데이터를 악용하지 말 것. 메타데이터는 실제 페이지를 보여줘야 함

○ canonical link를 이용할 것
– 한 기사에 여러 URL이 존재할 경우 대표 URL을 지정해 구글봇이 여러 URL이 한 기사임을 인식하도록 하라는 것입니다.

○ 이미지와 콘텐츠를 최적화할 것. 이미지는 의미 있는 파일 명을 붙이고 콘텐츠는 문법적으로 정확해야 함

○ 구글봇을 일반 사용자라 생각할 것

○ 가치 있는 콘텐츠를 제공할 것
– 하얀 화면에 하얀 텍스트를 넣어 검색 어뷰징하지 말 것

google amp SEO guideline
google amp SEO guideline

이상 거북이 미디어 전략 연구소장이었습니다.

감사합니다. (끝)

LEAVE A REPLY

Please enter your comment!
Please enter your name here

This site uses Akismet to reduce spam. Learn how your comment data is processed.