AMP Webpages

AMP stands for "Accelerated Mobile Pages". It was started by Google and Twitter to make super-duper fast mobile pages. You can identify if a page is made with AMP tech on Google, just look for a small lighting icon at the end of the page title.

AMP Page high-level info:

- Stripped down HTML (lightweight)

- Javascript not allowed

- AMP specific HTML tags

- You can maintain an AMP version site and non-amp (use rel tags), or be 100% AMP

- AMP pages can be cached by Google, so 2nd time load is even faster

- Supports ads

- Amp email components

Who uses it?

CNN, The Washington Post, Wired, TeslaCarSearch.com, Gizmodo, BMW, and more.

Why?

Why did Google start this tech? So that mobile users can get to their content quickly. According to KISSmetrics, 40% of people will leave a web site that takes more than 3 seconds to start loading.

SEO benefit:

- AMP pages are shown higher in rankings that standard pages.

- Amp pages will be shown on mobile browsers vs non-AMP pages. Meaning Google may not display your standard html page at all on mobile browsers.

I've mentioned in the past, Google is consumer friendly. They want the user to search and find their answer quickly. Faster loading webpages is part of that equation.

Demo AMP page

Intro to Amp video by Google

Google's tools for AMP pages: search, analytics, ads, adsense, youtube video

Amp component examples

AMP page example

Results from Google mobile Chrome search

Snippets

The best way to explain this to you is to first have your try it. Go to Google and search for the below 2 and you should see the below.

"what is in a keto diet"

"top 10 productivity tips"

You should see the below in your search results. This is a snippet (aka Position Zero). Google extracts key content from your website and displays it to the user so that they can quickly get their answer before exploring sites in the search results.

Open Graph Tags

Results from Google deskotp Chrome browser search

Why you should own this spot in Google results?

Think about it. You are on TOP of Google results, you don't even have to pay to be there. You are beating other companies who pay $1-$75 a click to be on top. It's free.

Now that you know the power of this, how do you get up on top?

It's not such an easy thing, but you'll never get listed in position zero unless you put some work into it, and be patient. So here is what you need to do.

Decide what type of snippet you want to render on the search page. Check this page for snippet examples.

For Google to read your site content, it needs to be structured. To structure data, you need to use schema markup. The full list of schema types is here. Scan it and read the details on how to set up schema tags for your site content.

If you are using Wordpress for your site, check the plugins section. There are plenty of pluggins made that support Schema markup.

Once done, check if you did it right using Google's structured data testing tool.

Last step, keep working on your site content, get backlinks, create some web history and be patient. Google is not going to list a site's data on position zero if that site hasn't been around for a while, has lots of topic-related content and doesn't have lot of inbound traffic from quality sites. Their goal is to give this position to the best.

That being said, did this ever work for me? Yes. I displaced 2 competitors and took over their position. It took over 6 months to get my content listed on the SERP and be granted position zero.

Schema

We just touched upon this in the above point. Schemas are a specific way of writing your HTML so that search bots can read the content, and all the rich elements around it and then display it to users in the SERP.

Schema is how you see stars ratings in front of an electroinc product you search for. It's also how you can search for a flight on Jetblue right on Google's SERP instead of from Jetblue.com

Everything you need to know about Schema markup is here and so is all the coding details. 

Optimize Your Images

I've touched on this in the past, but let's spend more time on it here.

Key reasons to optimize your site's image:

#1) 20% of US searches happen on Google Images.

#2) Optimized images will cause your page weight to drop and lift your site load speeds. Google likes this :)

How to optimize images:

1) Use jpg or png images: I would say use jpg over png because the file size tends to be smaller.

2) Reduce the size of your image: Most likely you don't have a wallpaper download or photography site, so you don't need to display high pixel images. Reduce your image pixel based on where it is going on a site. If it's part of a blog post, perhaps the largest width of the image can be 600 px. Or if it's a heading, the largest can be 1600 px.

3) Remove unwanted image meta data: If you are using stock photos, or images you've take, that image has tons of data (ex: time/date, geo location, photographers name, etc). Reduce the image size as stated in step 2 above and next, remove all the unnecessary image data. Right-click on the image and view the details.

To view, all the additional info in your image go here.

To delete all additional info in your image go here.

4) Rename your images: Most stock images and even your local pc will rename your image. Rename your images to match keywords. Imagine if someone searched for "cell phone charger", if you want your image to appear on images.google.com, Google needs to understand your image is related to that topic. So you should name your image to match that topic's keywords.

5) Write Alt tags: Alt tags are text descriptions of an image. Back in the days when the internet was slow and an images didn't load and your browser couldn't render the image, it would display the name of the image instead. This name came from the Alt tag.

Today this is an additional way for Google to understand the topic of your image. So make sure all your images have it. I know it's a lot of work, but its a 1-time task and it's worth it. If you want to get legal about it, Alt tags are required according to the American Disability Act.

6) Keep images in /images folder: It's the default for most sites and it makes Google's job easier. However, if you want to change it for some reason, make sure you put that URL in your sitemap.xml file

7) Sitemap for images: You can create a sitemap just for images. You can do this if you like. However, I'd recommend this step mostly for sites where images are part of their business. Ex: stock photo sites, photography sites, infographic site, etc.

Open Graph (OG) Tags

When content is shared on Facebook and Twitter, the shared item usually appears with the image, title, and description. The content is displayed by the social networks by consuming Open Graph (OG) tags in the site's HTML.

This is a must do step, so don't skip it. Your share content will look mr

Read more here about the basics of OG tags

Visit the Open Graph Protocol website for detailed info.

Simple online Open Graph generator

Powerful Open Graph and Twitter Card maker

OG tag example

Canonical tags

A canonical link tells search bots the original source of your content on your site. Your site may have duplicate content, so canonical tags can help.

Examples of when you need canonical tags:

- your site pages have http and https access

- your site pages are available with or without www prefix

- there are multiple versions of a page on different urls on your site

Google's explanation of canonical tags and how to implement them.

Matt Cutts' explanation. He used to work at Google.

Verify your canonical tags here.

Remove Duplicates

1) Titles across site content:

- Each page should have it's own unique page title

2) Remove Duplicate Meta Tags

- If you are using Meta-tags (recommended), use unique ones for each page.