웹사이트를 방문하여 홈페이지를 로드하는 데 시간이 걸린다는(homepage takes ages to load) 사실을 알게 되는 것보다 더 실망스러운 일은 거의 없습니다 . 더 나쁜 것은 이미지 품질이 좋지 않고 레이아웃이 잘 최적화되지 않은 경우입니다.
실제로 Google 연구(Google study) 에 따르면 53%의 사람들이 3초 이내에 로드되지 않는 사이트를 떠나게 되어 이탈률이 높아지고 수익이 감소하는 것으로 나타났습니다.
이러한 문제를 해결하기 위해 Google 은 (Google)Accelerated Mobile Pages ( AMP )를 만들었습니다 . AMP 는 사이트 로딩 시간을 단축할 뿐만 아니라 매력적인 사이트, 스릴 넘치는 모바일 경험 및 평균 클릭률(CTR) 증가를 디자인 하는(design a compelling site) 데 도움(CTR) 이 됩니다 .
이 가이드에서는 Google AMP(Google AMP) 가 Google에서 모바일 페이지용으로 선호하는 형식인 이유 와 WordPress 용 (WordPress)AMP 를 구현하는 방법을 설명합니다 .
구글 AMP란?(What Is Google AMP?)
Google AMP 는 경량의 사용자 우선 웹사이트를 만들고 구축하는 데 도움이 되도록 2015년 10월(October 2015) 에 출시된 웹 구성요소 프레임워크 입니다. 모바일 이니셔티브는 웹페이지의 제거된 버전을 제공하여 웹 속도를 높이도록 설계되었습니다.
WordPress , Pinterest , Washington Post , Reddit 등 많은 대기업 에서 AMP 를 도입 하여 월간 순방문자 수가 증가했습니다(increase in monthly unique visitors) .
웹페이지가 Google 의 (Google)AMP 를 통해 모바일 사용자에게 제공되면 기본적이고 단순해 보이기 때문에 번개처럼 빠르고 역동적인 경험과 더 나은 사용성을 목표로 하는 AMP 의 목표를 달성할 수 있습니다.(AMP)
WordPress 사이트에 AMP가 필요합니까?(Do You Need AMP on Your WordPress Site?)
AMP 는 빠르지만 웹페이지를 더 빠르게 로드하거나 사이트 속도를 높이는(increase your site speed) 유일한 방법은 아닙니다 .
게시자, 비즈니스 및 기타 산업에 대한 AMP 의 긍정적인 영향 을 보여주는 많은 사례 연구가 있지만 사례 연구에서 실패한 사례도 많습니다. 이것은 AMP(AMP) 가 모든 사이트를 위한 것인지 아닌지에 대한 명확한 결정이 없다는 것을 의미합니다 .
하지만 사실인 것은 AMP 의 성공이 몇 가지 결정 요인에 달려 있다는 것입니다. 예를 들어 사용자가 주로 데스크톱인 경우 AMP 페이지는 데스크톱에서 풍부한 기능과 함께 표시되지 않고 AMP 캐시(AMP Cache) 에서 제공 되지 않으므로 사용자가 이러한 이점을 누리지 못할 수 있기 때문에 AMP 가 적합하지 않습니다.(AMP)
황금률은 AMP 가 주로 뉴스 사이트와 블로그를 운영하는 게시자에게 권장된다는 것입니다. 포트폴리오 사이트나 방문 페이지와 같은 다른 모든 항목에는 반드시 AMP(AMP) 가 필요한 것은 아닙니다 .
또한 AMP(AMP) 가 아닌 페이지가 2.5초 표준 이내 또는 그 이하로 로드될 수 있다면 AMP 를 설치하거나 유지 관리할 필요가 없을 것입니다 .
WordPress 사이트에서 AMP를 구현하는 방법(How to Implement AMP on a WordPress Site)
WordPress 에서 웹 페이지 의 AMP 버전을 만드는 것은 개발자만 처리할 수 있는 작업처럼 보일 수 있지만 약간의 지식과 지침만 있으면 스스로 할 수 있습니다.
Google 에는 AMP 페이지를 구축하고, 페이지를 통합 및 최적화하고, 분석 추적을 설정하고(set up analytics tracking) , 사이트 요구 사항에 맞게 페이지를 디자인할 때 안내하는 워크플로 프로세스가 있습니다.
시작하려면 Google 에서 템플릿 코드를 제공합니다. 이 코드를 복사하여 .html 확장자로 저장한 다음 필요한 마크업을 추가할 수 있습니다. 그러면 페이지가 실행 가능한 AMP HTML 문서로 바뀝니다.
게시하기 전에 이미지를 포함하고, 레이아웃을 수정하고, SEO에 맞게 페이지를 최적화하고(optimize the page for SEO) , 사이드바에 제공된 지침을 사용하여 페이지를 미리 보고, 마무리할 수 있습니다.
원하는 경우 자신의 WordPress 사이트 에서 시도하기 전에 amp.dev 홈페이지에서 (amp.dev)AMP 로 실험할 수 있습니다.
WordPress에 Google AMP를 설치하는 방법(How to Install Google AMP on WordPress)
WordPress 사이트 에 Google AMP 를 수동으로 설정하고 설치하는 것은 복잡합니다. 그러나 WordPress용 공식 AMP 플러그인(official AMP plugin for WordPress) , AMP for WP 또는 AMP WP 와 같은 플러그인 을 사용하여 프로세스를 더 간단하게 만들 수 있습니다.
이 가이드에서는 공식 WordPress AMP 플러그인 을 사용하여 WordPress 사이트 에서 AMP 를 설정하고 설치하는 방법을 보여줍니다 .
WordPress AMP 플러그인을 사용하여 AMP를 설치하는 방법(How to Use the WordPress AMP Plugin to Install AMP)
- 시작하려면 WordPress(WordPress) 사이트 에 WordPress AMP 플러그인을 설치하고 활성화 하십시오. WordPress 대시보드로 이동하여 Plugins > Add New 를 선택합니다 .
- 검색 상자에 AMP 플러그인(plugin) 을 입력 하고 지금 설치(Install Now) 를 선택 하여 플러그인을 설치합니다.
참고(Note) : WordPress.com 을 사용 (WordPress.com)하는 경우 플러그인을 설치하려면 (install any plugins)비즈니스(Business) 플랜으로 업그레이드해야 합니다 .
- Plugins > Installed Plugins 으로 이동하여 AMP 를 찾아 활성화(Activate ) 링크를 선택하여 AMP 플러그인을 활성화하고 사이트에서 작동하도록 합니다.
- 플러그인을 활성화한 후 설정을 조정하여 AMP 페이지를 사용자 지정합니다. 플러그인을 구성하려면 AMP > Settings 으로 이동 하고 마법사를 사용하여 AMP 페이지 설정을 구성합니다.
- 설정 조정이 끝나면 게시(Publish ) 버튼을 선택합니다 . 사이트는 방문자에게 표시되지 않거나 Google 에서 검색할 수 없지만 (Google)AMP 사이트 에 페이지, 게시물 또는 둘 다를 표시할지 여부를 선택할 수 있습니다 . 이렇게 하려면 AMP > Settings > Advanced Settings, 지원되는 템플릿(Supported Templates) 확인란을 선택 해제하여 더 많은 옵션을 가져옵니다.
- 원하는 옵션(options) 을 선택한 다음 변경 사항 저장(Save Changes) 을 선택 합니다.
- Plugins > Add NewYoast SEO & AMP 를 검색하여 Yoast SEO(Yoast SEO) 를 AMP 설정에 통합할 수도 있습니다 .
- 지금 설치(Install Now) 를 선택 하고 플러그인 을 활성화 합니다. (Activate)활성화되면 SEO 로 이동하여 (SEO)AMP 를 선택 하여 페이지에 대한 추가 사용자 지정 옵션을 얻은 다음 변경 사항 저장(Save Changes) 을 선택 합니다.
- 게시하기 전에 원하는 게시물 또는 페이지 URL 끝에 amp 를 추가하여 (amp)AMP 사이트를 미리 봅니다. 예를 들어 https://yourwebsite.com/blog-post-title/amp/로 이동할 수 있습니다.
WordPress AMP를 검증하는 방법(How to Validate WordPress AMP)
WordPress 사이트에 (WordPress)AMP 가 설치된 상태 에서 다음 단계는 올바르게 작동하는지 테스트하는 것입니다. 뿐만 아니라 유효성 검사를 통해 지원되는 플랫폼이 사이트에 액세스 및 링크할 수 있는지 확인 하고 문제 해결을 위해 AMP 오류를(errors for troubleshooting) 찾을 수 있습니다 .
수동으로 또는 Google의 AMP 테스트 도구 를 사용하여 (Google’s AMP Testing tool)WordPress AMP 의 유효성을 검사할 수 있습니다 .
WordPress AMP를 수동으로 검증하는 방법(How to Validate WordPress AMP Manually)
- 이렇게 하려면 AMP 페이지를 연 다음 확인하려는 웹페이지 의 URL 끝에 #development=1
- 브라우저로 이동하여 개발자 도구 콘솔(developer tools console) 을 엽니다 . Firefox 를 사용하는 경우 menu > Web Developer > Web Console 을 선택합니다 . AMP 페이지 에 오류가 있으면 빨간색으로 강조표시됩니다.
유효성 검사 오류는 잘못된 코드, 잘못된 접두사 또는 허용되지 않는 태그로 인해 발생할 수 있지만 오류 옆에 원인에 대한 설명이 표시됩니다.
Google의 AMP 테스트 도구를 사용하여 WordPress AMP를 검증하는 방법(How to Validate WordPress AMP Using Google’s AMP Testing Tool)
- Google AMP 테스트 도구(Google AMP Testing tool) 페이지를 열고 사이트, 게시물 또는 페이지 의 URL 을 입력한 다음 (URL)테스트 URL(Test URL) 을 선택 합니다. 사이트의 코드를 붙여넣고 테스트 URL(Test URL) 을 선택할 수도 있습니다 .
- Googlebot 이 사이트를 분석하고 유효한 경우 AMP 페이지가 Google SERP(Google SERPs) 에 어떻게 표시되는지 미리 볼 수 있습니다.
Google AMP 테스트(Google AMP Testing) 도구를 사용하면 AMP 오류를 식별 하고 사이트(AMP) 에서 문제를 일으키는 코드를 볼 수 있습니다. 공유(Share) 버튼을 선택 하여 동료와 분석을 공유할 수도 있습니다.
또한 Google AMP Validator 도구를 사용하여 코드가 유효성을 검사하는지 확인하거나 Chrome AMP 확장 프로그램(Chrome AMP extension) 을 사용하여 페이지의 유효성을 검사하고 경고 또는 오류를 표시할 수도 있습니다.
WordPress 사이트 AMP(AMP up Your WordPress Site)
Google AMP 는 특히 이미 모바일 트래픽이 많은 경우 모든 사이트에 대한 주요 변경 사항입니다. 뉴스 콘텐츠가 있는 사이트를 운영하는 경우 AMP 를 바로 설치하는 것이 합리적일 수 있지만 다른 비즈니스의 경우 잘못 설치하면 전환에 해를 끼칠 수 있습니다.
전체 사이트에서 AMP를 사용하기로 결정하기 전에 트래픽이 많은 페이지에서 AMP 를 테스트 하여 긍정적 또는 부정적인 결과가 나오는지 확인하는 것이 좋습니다.
WordPress 사이트 에서 AMP 를 사용해 보셨습니까 ? WordPress 용 AMP 사용에 대해 공유할 다른 팁이 있습니까? 의견에서 우리와 공유하십시오.
What Is AMP for WordPress and How To Install It
Few things are more frustrating than visitіng a website only to find that its homepage takes ages to load. Worse still, is when the images are of poor quality and layouts aren’t well optimized.
In fact, a Google study found that 53 percent of people leave sites that fail to load in three seconds or less, which leads to high bounce rates and decreased revenues.
To deal with these issues, Google created the Accelerated Mobile Pages (AMP). Not only does AMP accelerate your site’s loading time, but it also helps you design a compelling site, thrilling mobile experience, and increase in average click-through rate (CTR).
In this guide, we’ll explain why Google AMP is Google’s preferred format for mobile pages, and how you can implement AMP for WordPress.
What Is Google AMP?
Google AMP is a web component framework launched in October 2015 to help create and build lightweight, user-first websites. The mobile initiative is designed to speed up the web by serving up a stripped down version of your webpage.
Many large companies including WordPress, Pinterest, Washington Post, and Reddit have adopted AMP and experienced an increase in monthly unique visitors.
When your webpage is served to mobile users via AMP in Google, it’ll look basic and simplistic, thus achieving AMP’s goal of lightning fast, dynamic experiences and better usability.
Do You Need AMP on Your WordPress Site?
AMP is fast, but it’s not the only way to make web pages load faster or increase your site speed.
There are many case studies that demonstrate AMP’s positive impact on publishers, businesses, and other industries, but there are also many case study failures. This means there’s no clear-cut decision as to whether AMP is for all sites or not.
What rings true though is that the success of AMP depends on some decision factors. For example, if your users are primarily from desktop, AMP isn’t for you because AMP pages don’t display with rich features on desktop, and they’re not served from the AMP Cache so users may not enjoy these benefits.
The golden rule is that AMP is recommended primarily for publishers running news sites and blogs. Anything else like a portfolio site or landing pages doesn’t necessarily need AMP.
Plus, if your non-AMP pages can load within or below the 2.5-second standard, you probably don’t need to install or maintain AMP.
How to Implement AMP on a WordPress Site
Creating an AMP version of your web page on WordPress may look like a task only developers can handle, but with a little knowledge and some guidance, you can do it on your own.
Google has a workflow process that guides you as you build an AMP page, integrate and optimize the page, set up analytics tracking, and then design the page for your site’s needs.
To get started, Google will provide you with a template code, which you can copy and save to a .html extension, and then add the required mark-up. This will turn the page into a workable AMP HTML document.
Before you publish, you can include images, modify the layout, optimize the page for SEO, preview, and finalize the pages using instructions provided on the sidebar.
If you want, you can experiment with AMP on the amp.dev homepage before trying it out on your own WordPress site.
How to Install Google AMP on WordPress
Manually setting up and installing Google AMP on your WordPress site is complicated. However, you can use plugins like the official AMP plugin for WordPress, AMP for WP, or AMP WP to make the process simpler.
For this guide, we’ll show you how to set up and install AMP on a WordPress site using the official WordPress AMP plugin.
How to Use the WordPress AMP Plugin to Install AMP
- To get started, install and activate the WordPress AMP plugin on your WordPress site. Go to the WordPress dashboard, select Plugins > Add New.
- Type AMP plugin in the search box, and select Install Now to install the plugin.
Note: If you’re using WordPress.com, you have to upgrade to the Business plan to install any plugins.
- Go to Plugins > Installed Plugins, find AMP and select the Activate link to activate the AMP plugin and make it work on your site.
- Once you activate the plugin, adjust the settings to customize the AMP pages. To configure the plugin, go to AMP > Settings and use the wizard to configure your AMP page settings.
- Select the Publish button once you’re done adjusting the settings. Your site won’t be visible to your visitors or discoverable by Google, but you can choose whether you want the pages, posts, or both to be shown on your AMP site. To do this, go to AMP > Settings > Advanced Settings, and deselect the Supported Templates checkbox to get more options.
- Select the options you want and then select Save Changes.
- You can also integrate Yoast SEO into your AMP setup by going to Plugins > Add New and then search for Yoast SEO & AMP.
- Select Install Now, and Activate the plugin. Once activated, go to SEO and select AMP to get further customization options for your page, and then select Save Changes.
- Before publishing, preview your AMP site by adding amp to the end of any post or page URL you want . For example, you can go to https://yourwebsite.com/blog-post-title/amp/
How to Validate WordPress AMP
With AMP installed on your WordPress site, the next step is to test that it works correctly. Not only that, but validation also ensures that supported platforms can access and link to your site, and you can find AMP errors for troubleshooting.
You can validate WordPress AMP manually or using Google’s AMP Testing tool.
How to Validate WordPress AMP Manually
- To do this, open an AMP page, and then add #development=1 to the end of the URL for the web page you’re validating.
- Go to your browser and open the developer tools console. If you’re using Firefox, select the menu > Web Developer > Web Console. If there are any errors on the AMP page, they’ll be highlighted in red.
Validation errors can be caused by incorrect code, invalid prefixes, or disallowed tags, but you’ll see an explanation of the causes next to the error.
How to Validate WordPress AMP Using Google’s AMP Testing Tool
- Open the Google AMP Testing tool page, enter the URL of your site, post, or page, and then select Test URL. You can also paste the site’s code and select Test URL.
- The Googlebot will analyze your site and if valid, you’ll see a preview of how your AMP pages could appear on Google SERPs.
With the Google AMP Testing tool, you can identify AMP errors and see the problem-causing code on your site. You can also select the Share button to share the analysis with your colleagues.
You can also use Google AMP Validator tool to make sure that your code validates, or use the Chrome AMP extension, which also validates the pages, and shows any warnings or errors.
AMP up Your WordPress Site
Google AMP is a major change for any site, especially if you already have lots of mobile traffic. If you run a site with newsy content, it may make sense to install AMP right away, but for other businesses, you could hurt your conversions if you get it wrong.
We recommend testing AMP on a few high-traffic pages to see if you get positive or negative results before making the decision to use it across your entire site.
Have you tried AMP on your WordPress site? Do you have any other tips to share about using AMP for WordPress? Share with us in the comments.