Upgrade to Pro — share decks privately, control downloads, hide ads and more …

AMPをかじってみた話 / The first impression of AMP

Avatar for Masashi Sekine Masashi Sekine
April 26, 2016
Programming
1.4k
1

AMPをかじってみた話 / The first impression of AMP

Avatar for Masashi Sekine

Masashi Sekine

April 26, 2016

More Decks by Masashi Sekine

See All by Masashi Sekine
Free study Google Apps Script
Avatar for Masashi Sekine ms76
1
1.1k
Introduction to HTTP2
Avatar for Masashi Sekine ms76
0
920
とあるサービスの運営を追体験してみよう / Let's experience a certain services vicariously
Avatar for Masashi Sekine ms76
1
940
1秒間に250通のメールをさばくAWSの使い方
Avatar for Masashi Sekine ms76
2
2.1k

Other Decks in Programming

See All in Programming
「Linuxサーバー構築標準教科書」を読んでみた #ツナギメオフライン.7
Avatar for akase244 akase244
0
1.4k
運転動画を検索可能にする〜Cosmos-Embed1とDatabricks Vector Searchで〜/cosmos-embed1-databricks-vector-search
Avatar for 開発室Graph studio_graph
1
520
Offline should be the norm: building local-first apps with CRDTs & Kotlin Multiplatform
Avatar for Renaud MATHIEU renaudmathieu
0
230
The Past, Present, and Future of Enterprise Java
Avatar for ivargrimstad ivargrimstad
0
230
Kubernetes上でAgentを動かすための最新動向と押さえるべき概念まとめ
Avatar for Sota Makino sotamaki0421
3
770
ソフトウェア設計の結合バランス #phperkaigi
Avatar for Takuma Kajikawa kajitack
0
160
Liberating Ruby's Parser from Lexer Hacks
Avatar for ydah ydah
2
2.3k
Programming with a DJ Controller — not vibe coding
Avatar for seki at druby.org m_seki
3
620
The Less-Told Story of Socket Timeouts
Avatar for Misaki Shioi(塩井美咲/しおい) coe401_
3
780
ドメインイベントでビジネスロジックを解きほぐす #phpcon_odawara
Avatar for Takuma Kajikawa kajitack
3
830
個人的に嬉しかったpnpmの新機能・3選
Avatar for Atsushi Matsuo matsuo_atsushi
0
100
Vibe NLP for Applied NLP
Avatar for Ines Montani inesmontani
PRO
0
520

Featured

See All Featured
What the history of the web can teach us about the future of AI
Avatar for Ines Montani inesmontani
PRO
1
530
Speed Design
Avatar for Sergey Chernyshev sergeychernyshev
33
1.6k
Evolving SEO for Evolving Search Engines
Avatar for Ryan Jones ryanjones
0
180
Everyday Curiosity
Avatar for Cassini Nazir cassininazir
0
200
Applied NLP in the Age of Generative AI
Avatar for Ines Montani inesmontani
PRO
4
2.2k
How to Build an AI Search Optimization Roadmap - Criteria and Steps to Take #SEOIRL
Avatar for Aleyda Solis aleyda
1
2k
A Modern Web Designer's Workflow
Avatar for Chris Coyier chriscoyier
698
190k
AI Search: Implications for SEO and How to Move Forward - #ShenzhenSEOConference
Avatar for Aleyda Solis aleyda
1
1.2k
HU Berlin: Industrial-Strength Natural Language Processing with spaCy and Prodigy
Avatar for Ines Montani inesmontani
PRO
0
330
Understanding Cognitive Biases in Performance Measurement
Avatar for Philip Tellis bluesmoon
32
2.9k
Paper Plane (Part 1)
Avatar for Katie Cordina Lindsey katiecoart
PRO
0
6.9k
The Curious Case for Waylosing
Avatar for Cassini Nazir cassininazir
0
320

Transcript

  1. AMPΛ͔ͬͯ͡Έͨ࿩ @ms76

  2. Accelerated Mobile Pages ੩తͳίϯςϯπΛ ߴ଎ͰϨϯμϦϯάͤ͞ΔͨΊͷख๏

  3. ৽͍ٕ͠ज़Ͱ͸ͳ͘ɺ طଘͷHTML, CSS, JavaScript ʹରͯ͠ ߴ଎ͳϨϯμϦϯάΛୡ੒͢ΔͨΊʹ ੍͋͑ͯݶΛՃ͑ͨ΋ͷɻ ֓ཁ

  4. 1. ࠷ॳʹಡΈࠐΉHTMLʹϨΠΞ΢τʹ ؔ͢Δ৘ใΛશͯೖΕΖʂ 2. ϨΠΞ΢τ͕ޙ͔Β่ΕΔΑ͏ͳॻ͖ ํ͸͢ΔͳʂʢͰ͖ͳ͍ʣ 3. ผϦιʔε͸શͯඇಉظͰಡΈࠐΊʂ మଇ

  5. 1. AMP validationʹύε͢ΔͱfreeͰ Google AMP Cacheʹ৐ͤͯੈք΁ ഑৴ͯ͘͠ΕΔ 2. ࠓޙSEOʹޮՌ͕͋Δ ϝϦοτ

  6. ۩ମతʹͲΜͳੈքͳͷ͔ʁ

  7. img video audio iframe frame frameset object param applet embed

    form input script ҎԼͷλά͸ېࢭ

  8. amp-img amp-video amp-audio amp-iframe ୅ΘΓʹ͜ΕΛ࢖͑ʂ

  9. JavaScriptʁ ͦΜͳා͍΋ͷ͸ېࢭʂʂ ୅ΘΓʹઐ༻JavaScriptϥΠϒϥϦ Λ࢖͑ʂ

  10. CSS͸·͋ڐͦ͏ɻ Ͱ΋֎෦ϦιʔεಡࠐΈ͸μϝɻ ΠϯϥΠϯ <style>λάͰɻ

  11. ࡞ΕΔؾ͕͠ͳ͍…

  12. ͔Βͷ Demo

  13. ҙ֎ͱϥΠϒϥϦ͸ἧͬͯΔͷͰ ͋Δఔ౓ͷUI/UXΛ੔͑ͯ ࡞Δ͜ͱ͸Ͱ͖ͦ͏Ͱ͢ɻ ݁࿦

  14. https://www.ampproject.org/ https://github.com/ampproject/amphtml/ blob/master/spec/amp-html-format.md AMP HTML࢓༷ Accelerated Mobile Pages Project ࢀߟ

  15. Thank you.