한국의 개발자들을 위한 Google for Developers 국문 블로그입니다.
Accelerated Mobile Pages 문제를 검사하는 효과적인 방법
2016년 11월 4일 금요일
사이트의
Accelerated Mobile Pages
를 제작(#AMPlify)할 때 페이지의 유효성 검사 상태를 주기적으로 확인하는 것이 중요합니다. 유효한 AMP 페이지만 Google 검색에 표시되기 때문입니다.
AMP를 구현할 때 페이지에
오류
가 포함되어 이로 인해 Google 검색에서 색인을 생성하지 못할 수 있습니다. 페이지에는 권장사항이 아닌 구성요소나 추후 오류가 될 수 있는 구성요소인 경고도 포함될 수 있습니다.
Google Search Console
은 Google에서 어떤 AMP 페이지를 오류로 파악했는지를 확인할 수 있게 하는
무료 서비스입니다
. 어떤 URL에 문제가 발생했는지 알게 되면 몇 가지 손쉬운 도구를 통해 쉽게 유효성 검사 오류 세부정보를 확인할 수 있습니다.
1. 브라우저 개발자 도구
개발자 도구를 사용하여 유효성을 검증하려면 다음 단계를 따르세요.
브라우저에서 AMP 페이지를 엽니다.
URL에 '#development=1'을 추가합니다. 예:
http://localhost:8000/released.amp.html#development=1
Chrome DevTools 콘솔
을 열고 유효성 검사 오류를 확인합니다.
Developer Console 오류는 다음과 유사하게 표시됩니다.
2. AMP 브라우저 확장 프로그램
AMP 브라우저 확장 프로그램(
Chrome
및
Opera
에서 사용 가능)을 사용하여 유효하지 않은 AMP 페이지를 재빨리 파악하고 디버깅할 수 있습니다. 사이트를 탐색할 때 확장 프로그램이 방문한 모든 AMP 페이지를 평가하고 페이지의 유효성 여부를 표시합니다.
AMP 페이지 내에 오류가 있는 경우 확장 프로그램 아이콘이 빨간색으로 표시되며
발생한 오류의 수를 표시합니다.
AMP 페이지 내에 오류가 없는 경우 확장 프로그램 아이콘이 녹색으로 표시되며
경고가 있다면 경고의 수를 표시합니다.
페이지가 AMP가 아니지만 AMP 버전을 사용할 수 있는 페이지인 경우 링크 아이콘과
함께 아이콘이 파란색으로 표시되며 확장 프로그램을 클릭하면 AMP 버전으로 브라우저
가 리디렉션됩니다.
확장 프로그램을 사용하면 확장 프로그램 아이콘을 클릭하여 페이지에 있는 오류나 경고를 확인할 수 있습니다. 모든 문제에 소스 줄, 소스 열, 문제가 무엇인지 나타내는 메시지가 표시됩니다. 문제에 대한 자세한 설명이 존재할 경우 '자세히 알아보기' 링크로
ampproject.org
의 관련 페이지로 이동합니다.
3. AMP 웹 유효성 검사 도구
validator.ampproject.org
에서 이용할 수 있는 AMP 웹 유효성 검사 도구는 AMP 페이지의 유효성을 검사할 수 있는 간단한 웹 UI를 제공합니다.
도구를 사용하려면 AMP URL을 입력하거나 소스 코드를 복사/붙여넣기하면 웹 유효성 검사 도구가 줄 사이에 오류 메시지를 표시합니다. 웹 유효성 검사 도구에서 직접 수정할 수 있으며 유효성 재검사가 실행되어 내가 제안한 수정으로 문제를 해결할 수 있는지 알려줍니다.
어떤 AMP 페이지 상태 확인 방법을 선호하시나요? 아래의 댓글이나
Google 웹마스터 Google+ 페이지
에 의견을 공유해 주세요. 질문이 있거나 도움이 필요하다면
웹마스터 도움말 포럼
에 자유롭게 글을 올려주시기 바랍니다.
게시자: Tomo Taylor, AMP 커뮤니티 관리자
Contents
ML/Tensorflow
Android
Flutter
Web/Chrome
Cloud
Google Play
Community
Game
Firebase
검색
Tag
인디게임페스티벌
정책 세미나
창구프로그램
AdMob
AI
Android
Android 12
Android 12L
Android 13
Android 14
Android Assistant
Android Auto
Android Games
Android Jetpack
Android Machine Learning
Android Privacy
Android Studio
Android TV
Android Wear
App Bundle
bootcamp
Business
Chrome
Cloud
Community
compose
Firebase
Flutter
Foldables
Game
gdg
GDSC
google
Google Developer Student Clubs
Google Play
Google Play Games
Interview
Jetpack
Jetpack Compose
kotlin
Large Screens
Library
ma
Material Design
Material You
ML/Tensorflow
mobile games
Now in Android
PC
Play Console
Policy
priva
wa
wear
Wearables
Web
Web/Chrome
Weeklyupdates
WorkManager
Archive
2024
11월
10월
9월
8월
7월
6월
5월
4월
3월
2월
1월
2023
12월
11월
10월
9월
8월
7월
6월
5월
4월
3월
2월
1월
2022
12월
11월
10월
9월
8월
7월
6월
5월
4월
3월
2월
1월
2021
12월
11월
10월
9월
8월
7월
6월
5월
4월
3월
2월
1월
2020
12월
11월
10월
9월
8월
7월
6월
5월
4월
3월
2월
1월
2019
12월
11월
10월
9월
8월
7월
6월
5월
4월
3월
2월
1월
2018
12월
11월
10월
9월
8월
7월
6월
5월
4월
3월
2월
1월
2017
12월
11월
10월
9월
8월
7월
6월
5월
4월
3월
2월
1월
2016
12월
11월
10월
9월
8월
7월
6월
5월
4월
3월
2월
1월
2015
12월
11월
10월
9월
8월
7월
6월
5월
4월
3월
2월
1월
2014
12월
11월
10월
9월
8월
7월
6월
5월
4월
3월
2월
1월
2013
12월
11월
10월
9월
8월
7월
6월
5월
4월
3월
2월
1월
2012
12월
11월
10월
9월
8월
7월
6월
5월
3월
2월
1월
2011
12월
11월
Feed