OJapp Tips
ツール開発者が書く Web のノウハウ集
Webサイトを最も簡単にアプリ化する方法 | OJapp PWA Code
Webサイトを最も簡単にアプリ化する方法を紹介。無料の1P1A・1S1AコードをHTMLに1行追加するだけで、manifest.jsonを作成せずWeb App Manifestを動的生成し、PWAとしてホーム画面に追加できる仕組みを解説します。
PWAとは？2026年最新！ホーム画面に追加できるWebサイトの仕組みと最も簡単な実装方法
2026年最新のPWAを初心者向けに解説。1S1A・1P1Aという2つの新しい設計思想から、manifest.jsonでWebサイトをホーム画面に追加する仕組み、Service Workerの役割までわかりやすく紹介します。
PWAを導入する？検討する意味すらない理由｜今や「令和版apple-touch-icon」です
PWAを導入すべきか何時間も検討していませんか？ホーム画面対応だけなら、今のPWAは大規模な開発ではありません。apple-touch-iconのように1行追加するだけで、iPhone・Androidのホーム画面体験を整えられる1P1Aという方法を紹介します。
WordPressのPWAプラグインで何が変わる？導入するメリットと活用例を解説 | OJapp PWA Marketing
WordPressのPWA化で何が変わる？「1ページを1アプリに」する新発想のPWAプラグインで、リピート率向上やGA4計測を実現。ブログ・EC・サロン等での活用例と、サイトの再訪問を生み出す導入メリットを解説！
ホーム画面マーケティングとは？PWAで「ページを届ける」という新しいWeb戦略
OJappが提案する「ホーム画面マーケティング」とは何かを解説。PWAを使って商品や記事、予約ページをホーム画面へ追加し、検索ではなくホーム画面から直接アクセスされる新しいマーケティング手法を紹介します。
PWAの二極化：トップへ還る「1S1A」と、全ページをアプリ化する「1P1A」
PWAには「One Site. One App.（1S1A）」と「One Page. One App.（1P1A）」という2つの設計思想があります。本記事では、なぜ従来のPWAでは個別ページを独立したアプリにできないのか、scope・start_url・同一オリジンの仕組みを交えながら、それぞれの特徴とトレードオフを解説します。
1P1A（One Page. One App.）というPWA設計思想
1P1A（One Page. One App.）とは、Webサイト全体ではなく、1ページを1つのアプリとして扱うPWAの設計思想です。ページごとのアイコンや起動URLを活用し、従来の「1サイト＝1アプリ」を超えた新しいホーム画面体験を解説します。
PWAでは出来ないは嘘。ユーザー毎の個別ページをホーム画面に追加する方法
MDNでは、start_url にユーザーIDなどの一意な情報を含めないことが推奨されています。start_url に相対パスを指定すれば、現在表示しているページをそのままホーム画面へ追加でき、ECサイトやブログ、プロフィールページなどにも応用できます。
存在しないURLを指定したら分かった、iPhoneホーム画面アイコンの隠れ仕様
PWA LABで存在しないURLを指定してホーム画面追加を検証したところ、iPhoneではtheme_colorとサイト名から自動生成アイコンが作られる挙動を確認しました。
iOSとAndroidではPWAのゴールが違う｜対応・非対応だけでは語れない本当の違い
AndroidとiPhoneのPWAは何が違うのか。AndroidはWebをアプリ化し、iPhoneはWebページをホーム画面に置く体験を重視しているという視点で整理します。
【PWA事件簿】iPhoneのミニUIを消したくて、Androidを巻き込んだら、上下から謎のAI?に挟み撃ちにされた話
【PWA事件簿】iPhoneのミニUIを消したくて、Androidを巻き込んだら、上下から謎のAI?に挟み撃ちにされた話 こんにちは、OJappです。 今回は、ここ数日間で私が体験した、 「PWA（Progressive Web Apps）の仕様の深淵に触れて脳汁が出た後に、ブラウザの過保護なAI?にキレ散らかした」 という、実録デバッグドキュメンタリーをお
PWAに必要なmanifest.jsonの基本｜iPhoneとAndroidで効く項目を実験ベースで解説
PWAに必要なmanifest.jsonの基本を初心者向けに解説。iPhoneで効く項目、Android Chromeでインストール候補にするための設定、アイコンやscopeの注意点をまとめます。
AIOとは？SEOとの違いとAIに引用されやすい記事の作り方
AIOとは何か、SEOとの違い、AIに好まれる情報の特徴、今できる対策を初心者向けに解説。PWA LABのような実験記事がなぜ強いのかも紹介します。
PWAアイコンは any maskable だけでは足りない？AndroidとiPhoneで崩れる理由
PWAのアイコン指定でany maskableだけを使うと、AndroidとiPhoneで見え方がズレることがあります。manifest.jsonに通常アイコンとmaskableアイコンを分けて書く理由を解説します。
PWAのmaskableアイコンで数時間溶かした話｜purpose: any maskable と apple-touch-icon の罠
PWAのmaskableアイコンをiPhone・Android・PC Chromeで検証。purpose: maskableだけで起きた不具合と、any maskable、apple-touch-iconの注意点を解説します。