Wednesday, October 4, 2023
HomeEmail MarketingAMP Emails in Gmail Now Totally Supported by Android and iOS —...

AMP Emails in Gmail Now Totally Supported by Android and iOS — Stripo.e mail


Nice information, everybody!

Gmail completed rolling out its assist of dynamic emails for iOS. Now AMP emails in Gmail App work completely each on iOS and Android.

As of April 2020, this performance is totally accessible to all Gmail customers. 

You’ll not must do something to see AMP emails in your inboxes on cellular gadgets as dynamic emails are turned on by default for all Gmail customers, together with G-Suite.

A bit tour into the historical past of AMP for Electronic mail

In March 2019, Google rolled out its AMP for e mail. And on July 2, it went accessible for all Gmail customers, together with G-Suite.

At first, the AMP for Electronic mail know-how was supported by Gmail and Mail.ru on desktop gadgets. 

Yahoo and AOL are planning on supporting AMP quickly.

Initially, AMP was about to render on desktop gadgets solely.

However on November 21, 2019, Gmail began rolling out its assist of dynamic emails for iOS and Android. They completed rolling out AMP for Android in December 2019. Nonetheless, this course of for iOS took them longer.

As of April 2020, AMP is totally accessible to all Gmail customers each on cellular and desktop gadgets.

How AMP for e mail renders on cellular gadgets now

We examined 7 main AMP layouts and shared our suggestions and outcomes with the Gmail staff. You are able to do the identical, btw 😉 Google is now open to feedback.

1. AMP accordion

That is the AMP template we used for our take a look at. You’ll be able to see its code in our demo editor, plus you should utilize it in your checks.

Accordion means that you can make emails concise and prevents prospects from bothersome scrolling as you “cover” content material into collapsible sections. Clients have to click on on a obligatory part identify to see its content material. 

Irrespective of if that is our Drag-n-Drop AMP-accordion block, otherwise you embed a customized code that you simply’ve constructed with Google playground, AMP accordion rendered nicely each on iOS, and Android.

AMP Emails_Accordion_Non-Expanded Section(1)

(AMP accordion with non-expanded sections. Gmail on Android)

AMP Emails on Mobiles_Accordion_Expanded Section(1)

(AMP accordion with an expanded part. Gmail on Android)

Use template

Issues detected:

None — AMP accordion labored nicely on iOS and Android.

2. AMP carousel

This time we used two templates for our checks:

  1. the one with preview photos;

  2. the one with out preview photos.

You’ll be able to see their codes in our demo editor, plus you should utilize these templates in your checks.

Picture carousel prevents from bothersome scrolling and allows an e mail marketer to put quite a few banners in a single display screen.

AMP_Carousel_Android

(Gmail on Android)

Use template

Issues detected:

None — AMP carousel labored nicely on iOS and Android.

3. AMP lightbox impact

The lightbox impact permits zooming in a selected ingredient of the e-mail. We utilized it to pictures.

Our take a look at confirmed that the lightbox impact works fairly nicely each on Android, and iOS if the e-mail is SHORT.

AMP_Lightbox_Expanded Photo (1)

(Gmail on Android, lightbox impact, a zoomed-in picture)

But when you construct an everyday promo e mail, you’ll face some difficulties with the Lightbox impact.

Issues detected:

The picture upon a click on will get zoomed in someplace in the midst of the e-mail lengthwise. The remainder of the display screen will get black.

LightBox Effect_AMP_Android_Gmail

(I scrolled down to seek out the zoomed-in picture)

How are your prospects imagined to know they should scroll right down to see the picture?

Answer:

We suggest that you don’t use this impact as Gmail determined to disable this element.

4. AMP sidebar

The sidebar is a collapsible navigation menu that will get opened on the left of the display screen.

It saves valuable area in emails, doesn’t annoy recipients as they will “shut” it at any time when they need and it navigates your subscribers precisely the place they need.

For our take a look at, we used the sidebar code that Google presents on its AMP for Electronic mail web page. The take a look at confirmed that the sidebar works nicely each on Android, and iOS with a slight distinction. You will need to point out that we didn’t apply any types to the sidebar. We simply pasted hyperlinks (however you’ll be able to apply types should you like):

On this OS, the hyperlinks bought inexperienced.

AMP_SideBar_Expanded

On iOS, the hyperlinks bought blue.

AMP_Sidebar on iOS

We checked — all these hyperlinks labored. And the sidebar would shut should you click on the “shut” button.

Issues detected:

None. The sidebar labored nicely throughout iOS and Android. 

5. AMP kind

We used the template, added the mock “endpoint” in it with our Mock Server to test if our kind actually works and is able to “posting” suggestions to an actual server. You can even strive it. 

Varieties help you collect suggestions from prospects straight in emails. 

I find it irresistible 🙂

It labored! It labored on iOS and Android. 

We checked — “solutions” have been delivered to our Mock server 🙂

But, we seen a slight distinction, after I gave “5” / rated and left a remark, after which clicked on “Ship Suggestions”:

The shape mentioned “Thanks in your opinion”, but I used to be nonetheless in a position to see the ranking I might given and my remark.

AMP Form on Gmail

It doesn’t make a lot of a distinction, however on iOS, my suggestions disappeared. But, I may nonetheless see the “Thanks” half.

AMP_Form_Gmail on iOS

Use template

Issues detected:

None. This type labored fairly nicely throughout these two OSs which is absolutely nice 🙂

6. AMP selector

Selector permits your prospects to decide on attire colours, stuffing, and so forth. straight in emails.

This prevents you from the need to incorporate all of your wealthy assortment in a single e mail and from inserting quite a few product playing cards in your promo.

It labored nicely each on Android and iOS.

Selector on Android_Gmail

(AMP selector on Android)

Use this template

Issues detected:

None.

7. AMP-list

Lists are supposed to assist us present our customers with recent content material — all data will get up to date the second prospects click on on the “View extra” / “View latest” button, and so forth.

That is the template we used for our take a look at.

That is how my e mail regarded on desktops:

Use this template

Issues detected:

There have been some. Although, basically, it really works nicely on cellular gadgets and really nicely on desktops.

The button was energetic, the content material was up to date upon each click on. However the button was not center-aligned.

AMP_Live List_Android

Identical right here — the content material would get up to date after I clicked on the button. However the button design bought slightly bit damaged.

Button on iOS_Gmail

Answer:

Gmail doesn’t acknowledge “enter sort = submit” for buttons.

Here is what we did to our button design:

  • we changed “enter sort” with the “button sort”;
  • added the closing button tag on the finish of the code pattern </button>;
  • eliminated the “worth” half which contained the button label of the e-mail;
  • put the “label button” earlier than the closing tag.

Here is the code we used when designing our button:


<button sort="submit" identify="add-to-cart" fashion="define:none;text-decoration:none;font-family:arial, 'helvetica neue', helvetica, sans-serif;font-size:18px;colour:#FFFFFF;border-style:stable;border-color:#34265f;border-width:12px 40px;show:inline-block;background: none 0% 0% repeat scroll #34265f; border-color: #34265f; border-radius: 30px;font-weight:regular;font-style:regular;line-height:22px;width:auto;text-align:heart;cursor:pointer;" position="button" tabindex="4" on="faucet:AMP.setState({showArticles: '1'})">View precise posts</button>

Now, even on iOS our e mail works nicely and appears precisely as we wished it to.

iOS_Updated Button_Gmail Live-List

How do you take a look at AMP emails on mobiles?

There are 3 ways to do it: 1) sending them by way of your ESP in case your e mail tackle is whitelisted with Google, 2) including our e mail tackle which we use to ship take a look at emails from as a trusted sender to your Gmail account, or 3) sending them from Google Playground (amp@gmail.dev).

Getting whitelisted with Google

In our “The best way to Get Whitelisted with Google to Ship AMP Emails — Our Expertise” weblog submit we offer you a step-by-step information on learn how to get Google’s permission to ship AMP emails.

The whole course of is not going to take you lengthy. Apart from, our checks present that AMP is value all the trouble it takes as its conversion is 5 occasions larger than the conversion of conventional HTML emails. 

Including Stripo as a trusted sender

We already described in one among our posts how one can add Stripo as a trusted sender to your Gmail account.

It’s required to ship emails to your gadgets from take a look at accounts.

So, learn how to add Stripo as a trusted sender to your Gmail account:

  • open Gmail on the desktop;

  • go to the settings;

  • in a dropdown menu, choose “Settings”;

Building-AMP-Emails-with-Stripo_Settings-in-Gmail

Building-AMP-Emails_Enabling-Dynamic-Content-for-Gmail

  • click on the “Developer settings” part to have the ability to see AMP emails ;

  • tick the “Enable dynamic emails from amp@gmail.dev” to have the ability to obtain AMP emails from Google Playground as nicely;

  • enter our e mail tackle information@stripo-test.e mail ;

Adding Stripo As Trusted Sender

By doing this, you enable us and Google to ship dynamic emails to you.

Sending AMP emails from Google Playground

Google Playground permits constructing, validating and testing AMP emails. It sends take a look at emails from amp@gmail.dev. 

To have the ability to obtain AMP emails from the aforementioned e mail tackle, it’s good to tick the “All the time enable dynamic emails from amp@gmail.dev ” field.

We described all the required steps within the earlier paragraph.

Necessary: all these e mail settings could be accomplished on desktops solely. They’re instantly utilized to cellular gadgets. 

However bear in mind to refresh your Gmail web page on mobiles 😉 Sign off after which log in once more.

Which variations of Android and iOS assist AMP 

Android — 5.01, and better.

 iOS —  OS 6, and better.

What different e mail purchasers assist AMP on mobiles

Mail.ru does assist AMP on cellular gadgets. Mail.ru states that solely desktop Octavius and cellular apps show AMP.

Each the desktop and cellular variations of this e mail shopper do assist AMP.

Phrase of recommendation

Here is only a pleasant reminder. To have the ability to ship AMP content material, it’s good to:

  • get whitelisted with Google;
  • repair all of the bugs if any happens. You will note them within the Preview mode (in any other case customers will see HTML e mail);
  • add the fallback — HTML model — on this e mail;
  • ensure that your ESP/CRM is able to sending AMP emails;
  • AMP emails lose their AMP elements should you ahead them.

Ultimate ideas

If the AMP characteristic isn’t seen for you but, you’ll be able to be a part of the beta channel for testing AMP emails in Gmail on Android and iOS.

As of April 2020, the AMP4Email know-how is totally supported by iOS and Android by default.

RELATED ARTICLES

Most Popular

Recent Comments