블로그 글을 작성하면서 구글 서치콘솔과 AMP 오류를 해결한 과정을 기록하고자 합니다. 이번 글에서는 구글 서치콘솔과 AMP의 중요성, 그리고 구글 애드센스를 운영하는 데 있어 왜 중요한지 설명하고, 구체적인 문제 해결 과정을 다루겠습니다.
1. 구글 서치콘솔이란 무엇이며, 왜 중요한가?
구글 서치콘솔(Google Search Console)은 웹사이트 소유자가 자신의 사이트가 구글 검색 결과에서 어떻게 표시되는지 모니터링하고 관리할 수 있는 무료 도구입니다. 서치콘솔은 웹사이트의 색인 상태를 확인하고, 사이트맵 제출, 검색 분석 데이터 제공, 그리고 오류나 보안 문제를 진단할 수 있는 기능을 제공합니다.
1.1. 구글 서치콘솔의 주요 기능
- 색인 상태 확인: 웹사이트의 페이지가 구글 색인에 어떻게 포함되고 있는지 확인할 수 있습니다.
- 검색 분석: 웹사이트의 검색 트래픽, 클릭 수, 노출 수, 평균 클릭률(CTR) 등을 분석할 수 있습니다.
- 사이트맵 제출: 구글에 사이트맵을 제출하여 색인 속도를 높이고, 새로운 페이지가 빠르게 색인되도록 할 수 있습니다.
- 오류 진단: 크롤링 오류, 모바일 사용성 문제, 보안 문제 등을 확인하고 해결할 수 있습니다.
1.2. 구글 애드센스를 위해 중요한 이유
구글 서치콘솔은 구글 애드센스를 운영하는 데 매우 중요합니다. 서치콘솔을 통해 웹사이트의 색인 상태와 검색 성능을 모니터링하고 최적화할 수 있기 때문입니다. 검색 트래픽이 증가하면 애드센스 광고 노출 빈도도 증가하게 되어 수익을 극대화할 수 있습니다.
2. AMP란 무엇이며, 본페이지만 색인이 되고 AMP 페이지가 색인이 안되면 어떤 문제가 있는가?
AMP(Accelerated Mobile Pages)는 구글이 주도하는 오픈소스 프로젝트로, 모바일 웹페이지의 로딩 속도를 극대화하기 위해 설계되었습니다. AMP는 간소화된 HTML과 엄격한 스타일 규칙을 사용하여 페이지 로딩 속도를 빠르게 합니다.
2.1. AMP의 주요 특징
- 빠른 로딩 속도: AMP 페이지는 간소화된 HTML과 제한된 CSS, JS를 사용하여 페이지 로딩 속도를 크게 향상시킵니다.
- 모바일 최적화: AMP는 모바일 기기에서의 최적화를 목표로 하여, 모바일 사용자에게 더 나은 경험을 제공합니다.
- 검색 순위 향상: 구글은 AMP 페이지를 우선적으로 처리하여, 검색 결과에서 상위에 노출될 가능성이 높습니다.
2.2. AMP 페이지가 색인이 안될 때의 문제점
AMP 페이지가 색인되지 않으면 다음과 같은 문제점이 발생할 수 있습니다:
- 트래픽 감소: AMP 페이지는 모바일 기기에서 빠르게 로드되므로 사용자 경험이 향상됩니다. AMP 페이지가 색인되지 않으면 모바일 사용자들이 페이지를 방문하는 빈도가 줄어들 수 있습니다.
- 검색 순위 저하: AMP 페이지가 구글 색인에 포함되지 않으면 검색 순위가 저하될 수 있습니다. 이는 결국 웹사이트의 전체적인 트래픽 감소로 이어질 수 있습니다.
- 애드센스 수익 감소: 트래픽 감소는 애드센스 광고 노출 빈도와 클릭률의 감소로 이어지며, 이는 수익 감소로 연결됩니다.
구글 서치콘솔과 AMP 오류 해결 과정
워드프레스에 글을 쓰며 하나하나 문제 해결 과정을 기록하기로 마음먹은 지가 좀 되었습니다. 실제로 몇 개의 글을 썼는데 구글 검색 결과에 내 글이 하나도 나오지 않았습니다. 검색을 해보니 구글 서치콘솔에 등록해야 글이 구글에 표시된다고 합니다. 하여 구글 서치콘솔에 등록하고 기다렸으나, 글이 검색 결과에 나오는 경우도 있고 그렇지 않은 경우도 있었습니다.
다음은 구글 서치콘솔에서 AMP 항목을 확인했을 때의 상황입니다. 글도 몇 개 없는데 두 개나 오류가 있다고 합니다. 세부 사항을 확인하기 위해 내용을 들어가 보았습니다.
잘못된 이유가 두 가지 보였습니다. 사실 이 AMP 문제는 1주일 전에 해결하려다가 못했습니다. 그전에는 잘못된 이유가 첫 번째 항목만 있었는데 지금은 오히려 늘어났습니다.
이 글을 쓰는 이유는 그 부분이 이제 해결되었기 때문입니다. 이제 테스트 시 유효한 페이지라고 수정이 되었습니다. 오늘 이야기는 워드프레스 초보자로서, 이전에 HTML을 다뤄보지 않은 사람으로서 무엇이 문제였는지 확인해가는 과정입니다. 1주일 전부터 틈틈이 검색하였지만 딱 맞는 대답을 찾지는 못했습니다. 하여 GPT를 이용하여 여러 가능성을 염두에 두고 수정하였지만 잘 해결되지 않았습니다. 항상 나왔던 문제는 아래와 같습니다.
HTML을 하나도 모르는 나는 오른쪽의 저 말이 무슨 말인지 몰랐습니다. GPT와 오랫동안 이야기를 한 결과 하나의 결론은 meta name="viewport" 태그가 문제가 있는 것은 분명하다는 것입니다.
이 글은 워드프레스로 작성되며 AMP-WP 플러그인을 사용 중입니다. 이 플러그인은 자동으로 모바일 페이지를 생성합니다. 내가 직접 AMP를 수정하지 않는다는 것입니다. 이는 GPT가 수정하라고 하는 그 HTML을 내가 직접 수정할 수 없다는 말입니다 (물론 잘 다루는 분들은 가능하겠지만, 나는 못합니다).
한동안 글을 안 쓰다 어제 GPT로 계산기를 만드는 글을 썼는데 또 같은 문제가 발생했습니다.
/챗gpt를 사용하여 간단한 계산기를 만들어보자 : 코딩을 하나도 몰라도 가능한이유. 계산기 만들기1
이번에는 꼭 해결하리라 생각했습니다. 다행히 성공하여 기록으로 남깁니다. 글이 몇 개 안 되지만, 이전에 AMP까지 무리 없이 색인에 성공한 글도 있습니다. 두 개가 있는데, 나는 여기에 집중해서 차이를 살펴보았습니다. 특별히 통과한 글을 쓸 때와 통과하지 못한 글을 쓸 때 특별한 설정이나 플러그인이 달라지거나 하는 부분은 없었습니다. 그렇다면 무엇이 차이가 나는가!
확인해보니 전율이 느껴졌습니다. 통과하지 못한 글들은 모두 내가 내부에 HTML 코드로 어떤 프로그램을 만들어둔 것이었습니다. 결과적으로 내부 HTML 안에 meta name="viewport"가 들어가서 AMP 생성에 문제가 되었던 것입니다. 내가 코드를 하나도 몰라서 발생한 문제입니다.
기본적으로 GPT에게 코드를 짜달라고 하면 빈 페이지에서도 단독으로 작동하는 코드를 만들어주는 것 같습니다. 이것이 다른 글 내부에 들어갈 때는 약간의 수정이 필요한데, 나는 그걸 몰랐습니다. 실제로 색인은 안 되더라도 웹페이지에 직접 가면 작동을 잘하니까 문제가 없는 것으로 생각했던 것 같습니다.
코드를 모르니 다시 GPT에게 요청합니다. 처음 시작이 다른 것을 알 수 있습니다. 왼쪽이 일반적으로 계산기를 만들어달라고 하면 단독 페이지에서 구동할 수 있게 HTML의 시작과 끝을 알려주는 것 같고, 오른쪽은 수정 후 웹페이지 내부에 들어가는 상태입니다. 오류가 났던 부분은 왼쪽 중간에 보이는 meta name 부분입니다. 이게 전체 페이지에 한 번만 들어가야 하는데, 중간에 계산기에서 한 번 더 들어가 모든 문제가 시작된 것입니다.
요즘 GPT로 코딩하는 것에 많이 재미를 느끼는데, 아마 구글 애드센스를 처음 시작하거나 워드프레스를 처음 시작하는 사람 중에 코드를 모른다면 나처럼 몇 일이나 삽질할지 몰라 기록으로 남겨둡니다.
AMP라는 말도, AMP 오류도, 구글 애드센스도 이번에 블로그를 하면서 처음으로 알게 된 말입니다.