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

Other Decks in Programming

See All in Programming
Advanced Micro Frontends: Multi Version/ Framework Scenarios @WAD 2025, Berlin
Avatar for Manfred Steyer manfredsteyer
PRO
0
400
Vibe Codingの幻想を超えて-生成AIを現場で使えるようにするまでの泥臭い話.ai
Avatar for Kuu fumiyakume
15
6.7k
“いい感じ“な定量評価を求めて - Four Keysとアウトカムの間の探求 -
Avatar for Nealle nealle
2
12k
バイブスあるコーディングで ~PHP~ 便利ツールをつくるプラクティス
Avatar for uzulla uzulla
1
110
PicoRuby on Rails
Avatar for makicamel makicamel
3
140
顧客の画像データをテラバイト単位で配信する 画像サーバを WebP にした際に起こった課題と その対応策 ～継続的な取り組みを添えて～
Avatar for Takuya TAKAHASHI takutakahashi
4
1.3k
ペアプロ × 生成AI 現場での実践と課題について / generative-ai-in-pair-programming
Avatar for コドモン開発チーム codmoninc
2
21k
Flutterで備える！Accessibility Nutrition Labels完全ガイド
Avatar for 野瀬田　裕樹 yuukiw00w
0
170
テスト駆動Kaggle
Avatar for ねぼすけAI isax1015
1
650
リバースエンジニアリング新時代へ！
GhidraとClaude DesktopをMCPで繋ぐ/findy202507
Avatar for @tkmru tkmru
3
1k
MCPを使ってイベントソーシングのAIコーディングを効率化する / Streamlining Event Sourcing AI Coding with MCP
Avatar for Tomohisa Takaoka tomohisa
0
170
ソフトウェア設計とAI技術の活用
Avatar for 増田 亨 masuda220
PRO
21
5k

Featured

See All Featured
The Success of Rails: Ensuring Growth for the Next 100 Years
Avatar for Eileen M. Uchitelle eileencodes
45
7.5k
Navigating Team Friction
Avatar for Lara Hogan lara
187
15k
Code Review Best Practice
Avatar for Trisha Gee trishagee
69
19k
Java REST API Framework Comparison - PWX 2021
Avatar for Matt Raible mraible
31
8.7k
Sharpening the Axe: The Primacy of Toolmaking
Avatar for Bryan Cantrill bcantrill
44
2.4k
A Tale of Four Properties
Avatar for Chris Coyier chriscoyier
160
23k
Dealing with People You Can't Stand - Big Design 2015
Avatar for Cassini Nazir cassininazir
367
26k
Adopting Sorbet at Scale
Avatar for Ufuk Kayserilioglu ufuk
77
9.5k
[RailsConf 2023 Opening Keynote] The Magic of Rails
Avatar for Eileen M. Uchitelle eileencodes
29
9.6k
Six Lessons from altMBA
Avatar for Skipper Chong Warson skipperchong
28
3.9k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
Avatar for Marc Duiker marcduiker
30
2.2k
The World Runs on Bad Software
Avatar for Brandon Keepers bkeepers
PRO
70
11k

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.