Search icon CANCEL
Arrow left icon
Explore Products
Best Sellers
New Releases
Books
Videos
Audiobooks
Learning Hub
Conferences
Free Learning
Arrow right icon
Arrow up icon
GO TO TOP
AMP: Building Accelerated Mobile Pages

You're reading from   AMP: Building Accelerated Mobile Pages Create lightning-fast mobile pages by leveraging AMP technology

Arrow left icon
Product type Paperback
Published in Oct 2017
Publisher Packt
ISBN-13 9781786467317
Length 370 pages
Edition 1st Edition
Languages
Tools
Concepts
Arrow right icon
Author (1):
Arrow left icon
Ruadhan O'Donoghue Ruadhan O'Donoghue
Author Profile Icon Ruadhan O'Donoghue
Ruadhan O'Donoghue
Arrow right icon
View More author details
Toc

Table of Contents (17) Chapters Close

Preface 1. Ride the Lightning with AMP FREE CHAPTER 2. Building Your First AMP Page 3. Making an Impression - Layout and Page Design in AMP 4. Engaging Users with Interactive AMP Components 5. Building Rich Media Pages in AMP 6. Making Contact - Forms in AMP 7. Dynamic Content and Data-Driven Interaction 8. Programming in AMP - amp-bind 9. When AMP Is Not Enough - Enter the iframe 10. Ads and Analytics in AMP 11. AMP Deployment and Your Web Presence 12. AMP - Where It's At and Where It's Going 13. AMP Components 14. Actions and Events 15. amp-bind Whitelisted Functions 16. amp-bind Permitted Attribute Bindings

Your first AMP component - <amp-img>

The next validation error message is interesting:

The tag 'img' may only appear as a descendant of tag 'noscript'. Did you mean 'amp-img'?

This error deserves special attention: it's the first error that's complaining about what looks to be standard use of an HTML tag. It's basically telling us that the HTML <img> tag is not permitted in AMP, and it's suggesting an alternative <amp-img>.

Let's try to swap in <amp-img> in place of our <img> tag. Copy this line in instead:

<amp-img src="https://theampbook.com/ch2/lightning.jpg"></amp-img>

Note the closing </amp-img> tag. The HTML img tag is a void tag, which means that it doesn't need to be explicitly closed. However, the same does not hold for amp-img; so you must close it explicitly...

lock icon The rest of the chapter is locked
Register for a free Packt account to unlock a world of extra content!
A free Packt account unlocks extra newsletters, articles, discounted offers, and much more. Start advancing your knowledge today.
Unlock this book and the full library FREE for 7 days
Get unlimited access to 7000+ expert-authored eBooks and videos courses covering every tech area you can think of
Renews at €18.99/month. Cancel anytime