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

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

Sponsored · SiteGround - Reliable hosting with speed, security, and support you can count on. →
Avatar for Masashi Sekine Masashi Sekine
April 26, 2016
Programming
1
1.3k

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

Avatar for Masashi Sekine

Masashi Sekine

April 26, 2016
Tweet

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
910
とあるサービスの運営を追体験してみよう / Let's experience a certain services vicariously
Avatar for Masashi Sekine ms76
1
930
1秒間に250通のメールをさばくAWSの使い方
Avatar for Masashi Sekine ms76
2
2.1k

Other Decks in Programming

See All in Programming
ご飯食べながらエージェントが開発できる。そう、Agentic Engineeringならね。
Avatar for yoko / Naoki Yokomachi yokomachi
1
280
AI活用のコスパを最大化する方法
Avatar for Ochtum ochtum
0
120
Fundamentals of Software Engineering In the Age of AI
Avatar for Dan Vega therealdanvega
1
200
go directiveを最新にしすぎないで欲しい話──あるいは、Go 1.26からgo mod initで作られるgo directiveの値が変わる話 / Go 1.26 リリースパーティ
Avatar for Arthur arthur1
2
470
守る「だけ」の優しいEMを抜けて、 事業とチームを両方見る視点を身につけた話
Avatar for Mitsui maroon8021
3
300
Claude Codeセッション現状確認 2026福岡 / fukuoka-aicoding-00-beacon
Avatar for monochromegane monochromegane
4
390
nuget-server - あなたが必要だったNuGetサーバー
Avatar for Kouji Matsui kekyo
PRO
0
180
AWS×クラウドネイティブソフトウェア設計 / AWS x Cloud-Native Software Design
Avatar for nrs nrslib
5
1k
Claude Code、ちょっとした工夫で開発体験が変わる
Avatar for Toranosuke Minamikawa tigertora7571
0
200
encoding/json/v2のUnmarshalはこう変わった：内部実装で見る設計改善
Avatar for Hiroki Kurasawa kurakura0916
0
320
LangChain4jとは一味違うLangChain4j-CDI
Avatar for Kenji Kazumura kazumura
1
150
メタプログラミングで実現する「コードを仕様にする」仕組み/nikkei-tech-talk43
Avatar for 日本経済新聞社 エンジニア採用事務局 nikkei_engineer_recruiting
0
160

Featured

See All Featured
Measuring Dark Social's Impact On Conversion and Attribution
Avatar for Stephen Akadiri stephenakadiri
1
140
Bioeconomy Workshop: Dr. Julius Ecuru, Opportunities for a Bioeconomy in West Africa
Avatar for AKADEMIYA2063 akademiya2063
PRO
1
68
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
Avatar for soudai sone soudai
PRO
199
73k
Facilitating Awesome Meetings
Avatar for Lara Hogan lara
57
6.8k
What’s in a name? Adding method to the madness
Avatar for The Alliance productmarketing
PRO
24
4k
Sam Torres - BigQuery for SEOs
Avatar for Tech SEO Connect techseoconnect
PRO
0
210
Amusing Abliteration
Avatar for ianozsvald ianozsvald
0
120
We Have a Design System, Now What?
Avatar for Morgane Peng morganepeng
55
8k
The agentic SEO stack - context over prompts
Avatar for schlessera schlessera
0
680
Easily Structure & Communicate Ideas using Wireframe
Avatar for Afnizar Nur Ghifari afnizarnur
194
17k
Accessibility Awareness
Avatar for Sarah Abderemane sabderemane
0
73
Writing Fast Ruby
Avatar for Erik Berlin sferik
630
63k

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.