Questions? Feedback? powered by Olark live chat software

AMP Design

14
Mar

Accelerated Mobile Pages are Up and Running – What This Means to You?

So, the much anticipated news is out. Finally, Google has launched Accelerated Mobile Pages aka AMP. It’s been nearly three weeks since the launch and many publishing sites have already adopted AMPs and reaping the benefits.

By now the term AMP must sound very familiar to many of you. Don’t worry if you haven’t heard yet. When speed is the bare minimum to survive in this fast-paced world, the websites that we access day in and day out must also be pepped up.That too with the mighty boom in mobile technology, your mobile sites ought to load in a jiffy. Else, all your visitors will walk away costing you a fortune.

Google’s answer to these glitches is the amazing AMP Project. It is an open source initiative to help create mobile optimized content on pages that load swiftly, providing a better mobile web experience. Now that the AMPs are up and running, let’s dig in more about them:

What AMP Does?

AMP Project

If your business is to publish articles and news online, then AMP will be your savior. Many of us might frown to read on the mobile web because of the slow and slaggy experience. The same happens with a visitor when they want to find something through your site and if it’s taking ages to load. But AMPs just take that worry load off your shoulders. An accelerated mobile page at its core is an HTML page that has been designed for super-fast loading. Certain components of HTML and CSS are not used, since the platform is completely designed for enhanced readability and speed.

It comes with a set of rules for publishers and advertisers that stops the usage of heavy graphics, interactive features and ads in their articles. Google also stores different versions of the pages on its servers around the world and populates AMP articles at the top of search engine results page (SERP).

How Can You AMP Your Site?

AMP Your Site

The fundamental components of an AMP are similar to any web page but with differences here and there:

  • AMP HTML: A subset of HTML with some custom tags and properties.
  • AMP JS: A dedicated JavaScript framework for mobile pages.
  • AMP CDN: An optional Content Delivery Network to optimize your pages.

That being said, let’s get started.

  • To begin with, you will have to maintain minimum two versions of your pages: original version and the AMP version.
  • Okay, here’s an alert ahead. AMPs do not permit any kind of form elements, third-party JavaScript, on-page comments and other usual elements of a standard page. Why? Simple. AMP is focused on speed and readability; all the above said components won’t suffice the purpose.
  • Next, rewriting your CSS to accommodate those limitations might be required. Also, a special amp-font extension for intensive custom fonts may be needed in order to load them without trouble.
  • Multimedia components like images must add the custom amp-img element with defined width and height. The same applies for videos – a custom tag amp-video for locally hosted videos. For YouTube video, it is amp-youtube.
  • Here comes the major part. For Google to detect the AMP version of your page, you need to include the below tag (by law!) in the original version of your page:

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

  • Also there’s something called Schema.org metadata. It helps specify the type of content your page hosts and makes your content eligible to appear in Google Search.

And, that much is for you. If you are a publisher or any business that loves to woo your visitors with lightning speed you ought to accelerate your thought to go AMP now.

What do you think? Will this technology suit everyone alike? Share your thoughts below.

 

facebooktwittergoogle_pluslinkedin
10
Feb

Will the AMP Project Doom Responsive Design Technology?

Speed is the name of the game in this digital race. Even among the techno giants this truth seems to have stirred a sudden awakening. Every business is trying to speed up their productivity, delivery time and among many other things, their websites. Would you even stay for a second longer if a web page is taking its own sweet time to load? Yeah, none of us would.

Responsive Design

That’s clearly why during the final quarter of 2015, Google announced a technology that helps speed up the mobile web and load articles on smart phones in an instant – Accelerated Mobile Pages aka AMP. This project is an open source initiative to help create mobile optimized content on pages that load swiftly, providing a better mobile web experience.

Okay, there’s probably already a set of questions running in your mind: In which way is this similar or different from the trending responsive design technology? Will my web page need that? Read on to find more:

What is AMP?

For many of us, reading on the mobile web might not be a happy choice due to the slow and crampy experience. An accelerated mobile page at its core is an HTML page that has been designed for super fast loading. Certain components of HTML and CSS are not used, since the platform is completely designed for enhanced readability and speed.

AMP vs. Responsive Web Page

AMP vs. Responsive Web Page

An AMP and a responsive web page both are based on the same fundamental components: HTML, CSS, and JavaScript. But, how different or similar are they?

  • Both types of web pages will work on a mobile phone.
  • A responsive design is focused on adaptability and flexibility; an AMP is focused on speed and readability.
  • AMP is ideal for static content and things like web forms are not supported; a responsive design can handle them with ease.
  • Responsive designs demand complete re-design of the site; AMPs can work with existing site.

User Experience

User Experience

Wooing your visitors with a great user experience favors your business and makes them keep coming back for more. More than immediate business, it builds a sense of trust in your service, opening channels for constant sharing and engagement. Trust me, this isn’t overrated!

That apart, no one can forget Google’s mobile-friendly algorithm update released last year and how every business went in a frenzy to go mobile-friendly. To overcome the situation, going responsive was the easiest solution that rendered free-flowing web pages regardless of the screen sizes.

This time for your site to be on Google’s good book, providing a mobile-friendly user experience with lightning speed might be mandatory. And, here’s where AMPs come – web pages optimized for speed.

Does my website need AMPs?

AMP Technology

Well, that’s an inevitable question we all need to face sooner. As the name suggests, it’s for mobile only. At least, at the moment. Companies that have adopted AMP technology till now have all been news publishers who are in need to optimize their reading content. If you are a website delivering published content to mobile users, AMP it is.

However it has limitations with respect to web form loading and other layout aspects that makes it a secondary choice compared to responsive web design. Things said and done; though it’s not now, it will come soon. There’s news that Google might start directing traffic to AMPs by February 2016. Let’s keep a watching eye on the possible impact it will bring in the days to come.

Meanwhile tell us, do you think AMPs will sweep off responsive web design altogether? Share your comments below.

facebooktwittergoogle_pluslinkedin