AMP.
Clasificación: | Libro Electrónico |
---|---|
Autor principal: | |
Formato: | Electrónico eBook |
Idioma: | Inglés |
Publicado: |
Birmingham :
Packt Publishing,
2017.
|
Temas: | |
Acceso en línea: | Texto completo |
Tabla de Contenidos:
- Cover
- Copyright
- Credits
- About the Author
- Acknowledgements
- About the Reviewer
- www.Packtpub.com
- Customer Feedback
- Table of Contents
- Preface
- Chapter 1: Ride the Lightning with AMP
- What do AMP pages look like?
- Why now?
- Why performance is important on mobile
- Mobile technology advances won't make websites fast
- Business cases behind AMP
- Web performance
- why are web pages slow?
- What exactly is AMP?
- AMP-HTML
- AMP-JS
- AMP Cache
- AMP URLs
- Preparing your web server environment
- AMP Hello World
- your first AMP pageOptional but recommended boilerplate
- Structured metadata and the AMP carousel
- Validating your AMP pages
- What's with the code?
- How AMP solves mobile web performance
- Optimizations that make AMP fast
- AMP pre-rendering
- Controversy and criticisms of AMP
- Benefits of AMP
- AMP adoption
- So, do you need AMP?
- Summary
- Chapter 2: Building Your First AMP Page
- Going from HTML to AMP-HTML
- Including the AMP-JS library
- Validating your AMP pages
- Developer tools consoleOnline validator
- Command line validation
- Fixing AMP validation errors
- AMP boilerplate validation errors
- Using JavaScript in AMP pages
- Using CSS in AMP pages
- Your first AMP component
- Layout in AMP
- HTML tags that aren't allowed in AMP
- Forbidden HTML tags
- HTML tags with AMP-HTML replacements
- HTML tags that are allowed, but with restrictions
- AMP components
- Measuring AMP page performance
- Measuring mobile web performance
- What is good web performance?
- Waterfall charts
- WebPagetest.orgPageSpeed Insights
- Remote debugging with developer tools
- Summary
- Chapter 3: Making an Impression
- Layout and Page Design in AMP
- Laying out elements in AMP pages
- The AMP-HTML layout system
- The layout attribute
- Using responsive layout
- Canonical AMP pages
- Art-direction and responsive images
- Using srcset to optimize image loading
- Using the heights and sizes attributes
- Adding a related articles section with thumbnail images
- Using CSS3 flexbox for layout in AMP
- Scaling up for larger screens
- Using flex and media queries for horizontal layoutUsing responsive images and srcset to deliver high quality images on all screen sizes
- Using element media queries to display art-directed images
- Using flex-item layout
- Horizontal flex items
- Vertical flex items
- Full width flex item container
- Flex items with specific proportions
- Mixing flex and non-flex items
- Using placeholders and fallbacks to improve user experience
- Placeholders
- Fallbacks
- Using custom CSS in AMP pages
- Adding custom fonts to AMP pages