Updates of AMP in 2019

Since 2016 Google has been giving businesses an opportunity to focus on their websites mobile experience. The release of Accelerated Mobile Pages was a clear indicator of how Google was trying to prioritize the mobile-first approach. If you do have an online business are not optimizing your website for a faster, smoother, & richer mobile experience, then you’re definitely setting yourself up for failure. In this blog, we will be looking at the evolution of AMP & its current state of progress at the moment.

The Evolution Of AMP

As I’ve mentioned before AMP was launched during 2016. It was an open-source project by Google which combined the development efforts of millions of people to ensure faster delivery of data on mobile pages. What AMP does is, it removes all the “unnecessary” clutter that might be delaying the loading of the pages. From what you can see, you’ll notice AMP pages will be without too many images, they’ll have a simple font. Under the hood, the CSS will be optimized for faster delivery of data, HTML and JS code will be delivered as a first in first out basis.

History Of AMP

Since releasing in 2016 AMP have been the talk of the town among Digital Marketers all around the world. Digital Marketing professionals and tech enthusiasts are both looking at AMP pages from the perspective of gains. While marketing professionals see it as another method of lead gen through articles, the IT dept is looking for ways to go even faster. But lead forms were not always available and have only been recently introduced leading to a spike in the popularity of AMP pages, ensuring 900,000 businesses online are currently using AMP for some if not all their pages.

While AMP pages were initially built to deliver news faster, companies have adopted it to suit their requirements for a variety of different pages. Brands are focused on AMP developments for their product pages as they’ve seen a significant bump if buy-ins from the customer based on faster data delivery. Especially e-commerce players who say an increase of up to 20% in their sales figures as compared to companies that did not use AMP.

All AMP Updates of 2019

In the first quarter of 2019, some interesting updates were released by the AMP team. Let’s look at some of the most interesting one’s below:

1. Video Optimization on AMP

One of the most important updates to AMP in 2019 has been the video optimization efforts that have been taken. As a digital marketing company in Pune helping small business access the gains of AMP, we know the importance of video in a marketing strategy. Three new updates have been made,
i. Videos can now be docked so that the user can continue to scroll as they are reading their content
ii. You can now install a video player that has AMP video interface features you might need as a business
iii. You can use the AMP video optimization to run ads and keep a track of them on your website

These three features have really come as a blessing to video marketers, especially who were recently seeing a decline in watch times across the internet.

2. Input Masking

Lead gen on AMP pages is just in a nascent stage but it is still an extremely necessary step that needed to be taken. One large step forward for AMP lead gen pages is that you can now customize what you form should look like to a large degree.

3. Smoother List Scrolling

Since the internet is filled with the list, & one of the most common actions users take on their phone is to scroll, AMP has now enabled smoother scrolling options while the page is in development. You can set the grid and, resize the containers to provide the best experience to the users.

Conclusion

Very few businesses in India are taking advantage of AMP pages as there are not too many digital marketing companies in Pune that are technically capable of providing that solution. If you want to know what CodePlateau can do for your business, get in touch with us today!

7 Tips To Get Started With AMP Stories For Your Business

We’ve all witnessed the boom of Snapchat stories. So much so that other popular social media applications were soon seen mimicking the feature. Although Snapchat was the first to introduce the feature to people and popularize it, it is actually Instagram that brings in the most users to the stories features. Now we’ve seen a lot of other applications try and attempt the stories feature to varying amounts of success such as Facebook which has seen the most disappointing turnout. Now the latest company to jump on the bandwagon is Google introducing the AMP stories.

As per Google AMP stories are an immersive visual content format that is fast and open, built specially for the users.

What Are AMP Stories?

It’s a feature built by Google similar to Instagram stories that help content creators build short-term, visual content for their viewers. However, unlike stories features in other apps, Google AMP stories will be featured in Google’s search results.

If you take into consideration that more than 75% of all user time is spent on their mobile phone you can clearly see why Google is pushing for mobile first content.  Since the whole concept of AMP was to push mobile first AMP will display an array of search results in the form of swipeable feeds. You can swipe right or left depending on whether you liked the story and would like to see more sources for the same information.

AMP stories also make it easier to share the information you’ve just received at lightning speeds. Google is hoping to capitalize on the format and draw users who are more accustomed to using other apps.

What Are The Components That Make AMP Stories?

Unlike traditional AMP content, you don’t have to rely merely on text anymore. You can include graphics, animation, videos and more. This is highly beneficial for content creators. AMP stories are made of 3 main components that you need to absolutely master if you want to rule the search engine game.

–    The story itself

–    The story page

–    The story grid layer

The story is the main content itself while the story page is the location when your content is based on. The grid layer contains all the elements that make up the page and the story.

So you must now be wondering how to get started with AMP stories?

 

7 Steps To Use AMP Stories On Your Website

  1. Code The Page

Now I’d like to say it’s easy for all companies to get started with posting AMP stories on their web pages but it isn’t as simple as that. Before you begin you need to code the regular pages of your website to AMP pages.  Use the following canonical tag on the original story

<link rel=”amphtml” href=”http://www.example.com/blog-post/amp/”>

If you want the entire AMP code set you can download it from the following link: https://github.com/Automattic/amp-wp

https://www.ampproject.org/docs/getting_started/create/basic_markup

Add the code to your WordPress page like you would for any other plug-in and you’re done with the first difficult step. In our opinion having a professional web design and development company in Pune to help you setup AMP pages will save you from a lot of future problems. You wouldn’t want the data on your website to suddenly disappear, do you?

  1. Run A Sample

Before you get started with the main content you need to check if all your settings are in order. Running a test project goes a long way to check this. For this, you’ll need a test server.

To be on the safer side of things you should use a secure layer with the test server to protect yourself from any data breaches. Once your local server has been set up, try using the link https://localhost:8000/article.html

Check the layout the design and if everything looks spot on you can move on to step number 3

  1. Create Cover Photos

Your stories can have multiple components but one single cover page. This cover photo should ideally represent what lies within the stories. To create a cover page, assign a unique ID for your cover to the first page:

<amp-story standalone>

<amp-story-page id=”cover”>

</amp-story-page>

</amp-story>

If you’ve worked with Photoshop at any point in your career you’ll know that cover photos need to be built using layers with each one built on top of the other.

The first layer will have <amp-story-grid-layer> element in the <amp-story-page>

There will be other attributes that you need to use to ensure conformity such as “fill”, “responsive”. Here is an example of what an ideal code will look like as provided by the AMP tutorials

<amp-story-page id=”cover”>

<amp-story-grid-layer template=”fill”>

<amp-img src=”cover.jpg”>

Width=”xx”, height=”xx”

Layout=”responsive”

</amp-img>

</amp-story-grid-layer>

</amp-story-page>

You can use multiple layers by adding the “vertical template” rather than the “fill template” as mentioned above.

  1. Additional Pages

Once you cover page is set up you can start to add other pages to your AMP stories.  You can find the code you will need to enter (based on which template you choose to use) on the AMP site. There are several other resources available to help you better code for AMP stories.

Of course, if you think you need professional help you can always get in touch with the best web development company in Pune.

  1. Glitz it Up with Animation

There are multiple animation elements you can use on your AMP stories to get the Wow! Factor. However, unlike social media apps, you can’t just drag and drop the elements in your AMP stories. You will need to code them in. There are plenty of animation presets already available like “fade-in” “fly-in-right”, “pulse”

  1. Close Out Story

You’ll need to effectively close out your story and provide your consumers with additional links from your content or related content. This last screen is known as the “bookend”.

  1. Validate Your AMP File

Before you upload the pages you will need to validate them using the Chrome Devtools Console. Remember if AMP pages are not validated they are not considered as AMP and do not give you any advantages. There are 2 methods of validating AMP files the other being using the AMP validator browser extension.

 

Why Should Businesses Use AMP Stories?

The golden rule of any business is to stay ahead of the competition. AMP stories are the next big wave to give you an edge over the competition. Also, it is now known that users are more accustomed to seeing short-form visual content which can be seen by how much more popular online streaming platforms have become. Good storytelling leads to better attention-grabbing of the users.

Using Stories To Push Products:

Who says that traditional marketing metric cannot follow good storytelling guidelines? In fact, 92% of consumers surveyed by the SEO-Journal responded that they wanted their advertisement to tell a story rather than just hit them with facts.

Reducing Page Load Times

Speed is good. The faster you are able to deliver the right content to your consumers the better. They’ll be invested in the conversation and look forward to it more. This undoubtedly leads to a lower bounce rate, higher conversion rates and not to mention you’ll also receive a slight boost in rankings courtesy Google. But that’s only if you work with the right web development companies in Pune like CodePlateau who are accustomed to delivering AMP pages to their customer.

Getting More Creative

Because of the way AMP pages are built you have more opportunities to experiment with creative styles. The design is an important element when it comes to potential customers picking your product or service over the competition.

With AMP pages you can add a whole lot of features and that can add a certain oomph to your content. While you’re at it you should also push your viewers to your AMP content until they become more accustomed to it. Links, buttons to promote your AMP stories in your content won’t hurt.

Better Rankings

As I’ve mentioned before AMP pages help with search engine optimization. If your website ranks well on all parameters important to Google it’s obvious they’ll be willing to give you a push up the results.

 

Conclusion

In this fast-paced world, your competitive advantage lasts only for a few months, maybe even less depending on the rate of technological innovation. If you want to get ahead of the competition you need to try and grab every advantage you can. Getting the best web development company in Pune, CodePlateau, to help you build and design attention-grabbing AMP stories and pages for your website is the right move to make right now. If you need more information about AMP stories or need some assistance in your web development needs, get in touch with us today.

All You Need To Know About AMP (Accelerated Mobile Pages)

Since we’re living in a world of short attention spans your consumers are looking for the fastest smoothest web browsing experience. With the advent of the smartphone more and more of the users browsing experience has moved to smartphones. Google recognized this and in 2015 made speed a ranking factor and again in December 2015 hinted at making mobile website loading speeds a ranking factor too. Web developers in Pune and around the world began experimenting with mobile-friendly versions of their website but it wasn’t good enough.
Kissmetrics data shows that pages that take longer than 3 seconds to load are more likely to be abandoned by up to 40% of the users. To battle, this problem Accelerated Mobile pages were introduced, and it was found that websites that were AMP-optimized showed a significant improvement in their rankings. In this blog, we’ll look at what AMP Pages are and how you can use CodePlateau’s world-renowned web development services to take advantage of them on your own website.

What Are Accelerated Mobile Pages?
It began when Google and Twitter joined forces to bring about a faster online experience to their users. It is an open source experience that helps design your web pages to make them faster and provide a better user experience. It’s a plugin that can help reduce your web page to the absolute essential basics to make it load quicker.

How To Optimize Your Web pages For AMP?

  • This is what most of your readers are here to find out. The solution, simple, download the AMP plugin from right within the WordPress plugins search or from the Github downloads. You will need to change a bit of code however and that’s where the excellent team of web developers from CodePlateau in Pune come in handy.
  • What we also suggest is that you create two different versions of your content pages. One can simply be a mobile-friendly version where you can have all your features and customizations while the AMP pages will be bare bones but provide a better online experience to the user. You don’t have to be worried about Google considering the pages as duplicate as they take into account the AMP version as long as your page has been validated online.
  • Use AMP URL’s to distinguish between the two.

So How Does The AMP Plugin Work?

Like we’ve mentioned before the AMP plugin strips your webpage to the absolute basic code required by smartphones to run smoothly. There are three parts to the AMP structure:
1) AMP HTML
2) AMP JS
3) AMP CDN

AMP pages don’t load regular Javascript, there is an AMP Javascript subset that you need to use. There are several other factors that you need to consider before using the AMP plugin on your page –

– Before you can roll out your AMP pages they need to be validated
– It is best to avoid custom fonts on your AMP pages as this may delay load time as these fonts have to be specially loaded every time
– You have to specify height and width for every image you share on your page if you want them to load correctly
– Videos need specially approved extensions to run on your AMP pages

You also need to be aware of the fact that AMP pages are built for quickness and readability. You might not even be able to enable the social sharing icons on your AMP pages as these are built using Javascript. CodePlateau’s web development team in Pune have found a workaround for this issue, get in touch with us for additional details.

5 Benefits Of Using AMP Pages For Your Website
While there are numerous benefits of using AMP pages for your website, we’ll be looking at the top 5. These are the factors that can really help enhance your site’s ranking and help you convert more sales.

1) Quicker Loading Speeds – The whole purpose of building AMP pages is to get an edge over your competition when it comes to the speed with which the content on your pages load. Users love a faster browsing experience as can be ascertained by the KissMetrics numbers.

Here are some more statistics to help convince you that you need AMP pages for your website

  • Every second your page delays in loading you are losing 9.4% of your pageviews
  • Conversion rate drops by 3.5% with every second added to your page load time
  • Bounce rate can go up by 8.3% for pages that take more than 3 seconds to load

In commercial terms, depending on your monthly traffic this could amount to a serious loss of site visitors, sales and more

2) Highlighted Results In Search – When it comes to SEO every advantage you can find is worth the time you spend getting it. Websites that rely heavily on their content for marketing were thrilled when AMP pages were introduced as it provided them with a green lightning symbol to display them as AMP pages. They also showed up higher in the search results. AMP pages have a higher click-through rate than their non-AMP counterparts.

3) Higher Listing In Search – Since speed is now one of the ranking factors on Google pages that load quicker tend to have a higher listing in search. This is especially true for AMP pages as not only do they have faster loading times as compared to non-AMP pages, they also have a better click-through rate. While Google may not necessarily be focusing on earning money using AMP pages it has helped them generate more revenue. A better user experience has led to more users pushing to use Google as their default browser. More clicks mean more money for Google.

4) Better Ad Support – Speaking of Google making money using AMP pages it has also helped content creators streamline the Ad’s on their sites. Since only custom AMP approved HTML works along with streamlined CSS code and almost no Javascript there are fewer distractions on your web page. Users can focus on the content and there is plenty of space for Ads. While you don’t want to clutter your pages with Ad’s less clutter makes it more convenient for people to click on Ad’s when they’re truly interested in them. AMP pages make the Ad’s stand out more effectively than the rest of the content on the page.

5) Simpler User Tracking – It’s not just that AMP pages provide the user with a better experience they also provide the content creator with more data to work with. Using Tag manager on their AMP pages provides Google webmasters with more information about their users. All the metrics you can find on Google Analytics are provided separately for AMP pages.

Conclusion
India is still in a very nascent stage when it comes to adopting AMP pages. If you want to get a head start on your competition you should start working on converting your pages to AMP as soon as possible. While setting up AMP pages on your website might seem easy there is some web development knowledge that you would need. Who better to help you out with your problem than Pune’s best Web Development company CodePlateau. If you’d like to get started on your project or need more information on the subject, we’d love to hear from you. Get in touch today!