이번 포스팅은 네이버 웹마스터도구의 웹 페이지 최적화를 위한 모바일 앱 링크 문제 해결이라는 주제의 포스팅입니다.
블로거들의 숙제 중 하나인 웹마스터도구 문제 해결이 매우 어렵죠.
저도 매일 머리아플정도로 해결책을 찾느라 고생하고 있습니다.
저 같은 경우 웹 페이지 최적화에서 모바일 앱 링크에서만 문제가 생겨서 직접 해결해보기로 하였습니다.
네이버 웹마스터도구의 모바일 앱 링크 문제를 해결하는 절차를 요약하면 다음과 같습니다.
Step 1. 네이버 웹마스터도구 로그인 → 검증 → 웹 페이지 최적화 클릭
Step 2. 웹 페이지 최적화 검증 → 확인
Step 3. 최적화 되지 않은 곳 찾기
Step 4. 모바일 사용성 → 앱링크의 물음표 부분 클릭
Step 5. 웹 표준 HTML 마크업 가이드 클릭
Step 6. HTML 문서의 <head>, </head>를 제외한 메타태그 복사
Step 7. 티스토리 블로그관리 홈의 HTML/CSS편집
Step 8. HTML의 <head>부분 어딘가에 복사한 메타태그 삽입 후 저장
Step 9. 네이버 웹마스터도구로 돌아가 모바일 사용성 앱 링크 존재 확인!
그럼 지금부터 하나하나 자세히 웹 페이지 최적화를 위한 네이버 웹마스터도구의 모바일 앱 링크 문제를 해결해보겠습니다.
Step 1. 네이버 웹마스터도구 로그인 → 검증 → 웹 페이지 최적화 클릭
웹 페이지 최적화
우선 문제를 해결하기 위해 네이버 웹 마스터도구로 들어가 위의 화면처럼 검증의 웹 페이지 최적화를 클릭합니다.
Step 2. 웹 페이지 최적화 검증 → 확인
웹 페이지 최적화 검증
웹 페이지 최적화를 클릭하고 위의 화면의 확인을 클릭하면 본인 블로그의 웹 페이지 최적화 상태를 확인할 수 있습니다.
본인의 블로그 주소 뒤에 아무것도 입력하지 않고 그냥 확인만 누르시면 됩니다.
Step 3. 최적화 되지 않은 곳 찾기
최적화 확인
검색 로봇 수집과 콘텐츠 부분은 최적화가 잘 되어 있는 것을 확인하실 수 있습니다.
최적화가 되지 않은 곳에서의 문제만 해결해주시면 됩니다.
Step 4. 모바일 사용성 → 앱링크의 물음표 부분 클릭
앱 링크 문제
최적화가 되지 않은 곳을 발견했네요.
바로 모바일 사용성의 앱링크 부분입니다.
페이지와 연동되는 모바일 앱 링크가 존재하지 않는다고 빨간네모박스안에 표시되어 있네요.
그럼 지금부터 문제를 알았으니 해결을 해나가야겠죠.
앱링크 옆에 파란네모박스안의 물음표 부분을 클릭해서 자세히 살펴봅니다.
Step 5. 웹 표준 HTML 마크업 가이드 클릭
웹 표준 HTML 마크업 가이드
앱링크 옆에 물음표를 클릭하면 위와 같은 화면이 나옵니다.
여기에서 자세한 내용은 웹 표준 HTML 마크업 가이드를 참고하라고 나오네요.
참고하라니 참고를 해봐야겠죠.
위의 빨간네모박스안의 웹 표준 HTML 마크업 가이드를 클릭해서 들어갑니다.
Step 6. HTML 문서의 <head>, </head>를 제외한 메타태그 복사
메타태그 복사
문제해결의 실마리가 여기에 있네요.
모바일 앱을 연결하기 위해서는 HTML 문서의 <head> 태그내에 메타태그를 활용하라고 하네요.
활용하라고 했으니 당연히 활용해서 문제를 해결해야죠.
위의 빨간네모박스안에 메타태그 내용들을 복사합니다.
여기에서 <head>와 </head>부분은 제외하고 복사를 해줍니다.
<head>부분은 실제로 티스토리 블로그 안에 존재하는 큰 틀이기 때문에 안에 내용인 메타태그 알맹이만 복사해서 옮겨주면 됩니다.
Step 7. 티스토리 블로그관리 홈의 HTML/CSS 편집
HTML/CSS 편집
이제 메타태그를 복사했으니 티스토리 블로그에 옮겨서 붙여넣기를 해줘야겠네요.
티스토리 블로그의 블로그 관리홈으로 들어가 위의 빨간네모박스안의 HTML/CSS편집을 클릭해줍니다.
Step 8. HTML의 <head>부분 어딘가에 복사한 메타태그 삽입 후 저장
메타태그 삽입 후 저장
보기만해도 머리아픈 티스토리블로그의 HTML입니다.
여기에서 위의 화면의 빨간네모박스안의 복사한 메타태그를 <head>부분 어딘가에 붙여넣기를 해줍니다.
그리고 오른쪽 위의 저장을 눌러줍니다.
이러면 모든 작업은 끝나게 됩니다.
Step 9. 네이버 웹마스터도구로 돌아가 모바일 사용성 앱 링크 존재 확인!
모바일 앱 링크 문제해결
메타태그를 복사해서 티스토리 블로그에 붙여넣기하고 저장까지 완료를 했습니다.
하지만 한가지 더 해야할 것이 있죠.
바로 네이버 웹마스터도구로 돌아가서 문제가 해결되었는지까지 확인을 해주어야합니다.
위의 화면을 보시면 모바일 사용성 부분에서 빨간네모박스안의 앱링크 문제가 해결된 것을 확인하실 수 있으실겁니다.
최적화 작업에 한 걸음 더 다가가서 매우 뿌듯하네요.
앞으로도 공부하고 연구해서 최상위 블로그로 만들기 위해 노력해야겠네요.
혹시라도 하시다가 모르시는 부분 있으신 분은 댓글 달아주시면 알려드리겠습니다.
그럼 이상으로 네이버 웹마스터도구의 웹 페이지 최적화를 위한 모바일 앱 링크 문제 해결 포스팅을 마치도록 하겠습니다.
다음에도 웹마스터도구의 문제가 있을시에 다른 포스팅으로 찾아뵙도록 하겠습니다!
도움이 되셨다면 공감버튼 꾸~~욱!! 눌러주세요!
'고풍 재테크 > 애드센스' 카테고리의 다른 글
구글 애드센스 광고승인을 위한 블로그 관리 노하우!! (0) | 2018.01.21 |
---|---|
구글 웹마스터도구 등록하는 방법 직접 실행해보기! (0) | 2018.01.20 |
구글 애드센스 수익을 위한 네이버 웹 마스터 도구 등록방법 안내!! (0) | 2018.01.16 |
구글 애드센스 청구서 수신 주소 확인 절차(PIN입력) (0) | 2017.12.29 |
구글 애드센스 신청 절차 안내! (0) | 2017.11.24 |