スマホで商品ページを下まで読み終えた買い物客が、画面の下に常に出ている「カートに入れる」ボタンに親指をそっと伸ばしている様子
商品ページ改善約10分編集：（商品ページ改善担当）

スマホの追従カートボタン（スティッキーCTA）設計｜親指で押しやすく、邪魔しない

「スマホで気になる商品を見つけて、写真を眺めて、説明を読んで、レビューまで確認して……さあ買おう、と思ったとき。あの『カートに入れる』ボタンは、どこにあったっけ？」——指で画面を上に戻しながら探す、あの数秒。買う側だと、ほんの少しのことに感じます。

でも、お店側にとってこの数秒は、けっこう大きい。買う気になった人が「ボタンどこ？」で手が止まると、そのまま別のことに気を取られて離れていく。せっかく最後まで読んでくれたのに、もったいない話です。今日は、スマホ画面の下にいつも出ている追従カートボタン（スティッキーCTA）を、親指で押しやすく、でも読む邪魔にはならない形で設計するコツを、一緒に整理していきましょう。

結論：スマホの商品ページには、画面下に常に出る「カートに入れる」ボタンを置く。効かせるコツは3つ。①親指の届く位置に、十分な大きさで置く（押し間違えない余白も）、②ファーストビュー（最初に見える画面）では隠し、少しスクロールしたら出す（最初の写真・価格を邪魔しない）、③文言は「次に何が起きるか」が分かる言葉にする（「カートに入れる」か「購入手続きへ」か、状態で出し分ける）。常に出すこと自体より、「いつ・どこに・どんな言葉で」出すかの設計で、押しやすさと印象が変わります。

まず、この記事で出てくる言葉を3つだけ先に。

いま何が起きているか：スマホでは「ボタンを探させる」だけで離れる

EC（ネット通販）の買い物は、いまや多くのお店でスマホからのアクセスが半分を大きく超えています。ところが商品ページは、もともとパソコンの大きな画面を前提に作られた名残が残っていることが多い。パソコンなら、画面の右側に商品名・価格・購入ボタンがずっと見えている作りが自然にできます。でもスマホは縦長の一本道。スクロールして読み進めるうちに、購入ボタンは画面の上の方へ消えていってしまいます。

すると何が起きるか。レビューや仕様を下まで読んで「よし買おう」と思った瞬間に、肝心のボタンが見当たらない。指で上に戻して探す——このひと手間が、購入をためらわせます。人は「あと少しの面倒」で驚くほど簡単に離れます。買う気があった人ほど、探す手間で冷めてしまうのはもったいない。

Googleも、スマホでの使いやすさ（モバイル対応）を検索評価の前提として重視しています（参考：Google 検索セントラル モバイルファースト インデックス）。つまり「スマホで押しやすいか」は、CVR（商品ページの買われやすさ＝見た人が買ってくれる割合）だけでなく、検索流入の土台にもつながる話なのです。だからこそ、スクロールしても消えない追従カートボタンで、「買いたいと思った瞬間に、迷わず押せる」状態を作っておくことが効いてきます。

具体例：追従ボタンを「押しやすく・邪魔しない」3つの勘所

ただ画面下にボタンを貼りつければいい、という単純な話ではありません。置き方しだいで、むしろ読む邪魔になったり、押し間違いを増やしたりします。ここでは代表的な3つの勘所に分けて見てみましょう。

スマホ画面の下部に「カートに入れる」追従ボタンが固定され、親指の届く範囲と十分な大きさが確保されていることを示した図
追従ボタンは「親指の届く下部」に「十分な大きさ」で。最初の画面では隠し、少し読んだら出すのが基本。

① 親指の届く位置に、十分な大きさで置く スマホは片手で持って親指で操作する人が多数です。だから追従ボタンは画面の下部が基本。画面上部に置くと、親指が届かず持ち替えが必要になります。大きさも大切で、小さすぎるボタンは押し間違いのもと。見た目のボタンに加えて、指の当たり判定（タップ領域）を少し広めにとると、誤タップが減ります。横幅はたっぷり使い、隣に別のボタンを詰め込みすぎないこと。「カートに入れる」の隣に小さな「お気に入り」を並べるなら、間に余白を置いて押し間違いを防ぎます。

② 最初の画面では隠し、少し読んだら出す 追従ボタンをページを開いた瞬間から出すと、いちばん見せたい商品写真や価格、キャッチコピーを下から隠してしまいます。ファーストビューの第一印象は購入を大きく左右する場所（→商品ページのファーストビュー改善｜最初の3秒で伝える）。だから、少しスクロールして「読む姿勢」に入ったタイミングで、すっと現れるのが理想です。最初から出すとしても、写真や価格にかぶらない高さに抑える。「常に出す」と「邪魔しない」の両立は、出すタイミングの調整で解けます。

③ 文言は「次に何が起きるか」が分かる言葉に ボタンの言葉は、押した後の行き先を想像できるものにします。カートに入れる段階なら「カートに入れる」、すでにカートがある・単品購入なら「購入手続きへ」。あいまいな「次へ」や「決定」は、押すのが少し怖い。また、まだ選択（色・サイズなど）が終わっていないのに購入ボタンだけ目立つと、押してからエラーで戻される不親切が起きます。選択が済むまでは「サイズを選ぶ」と促し、済んだら「カートに入れる」に切り替える、といった状態での出し分けができると、迷いが減ります（ボタン周りの言葉づかいは→購入ボタン・注記のマイクロコピー改善）。

この3つを押さえるだけで、「買いたい瞬間に、親指ひとつで、迷わず押せる」状態にぐっと近づきます。まずは①と②——下部に十分な大きさで、最初の画面は邪魔しない——から始めるのがおすすめです。

あなたへの影響：最後のひと押しを、取りこぼさない

商品ページの改善というと、写真を良くする・説明を練る・レビューを増やす、といった「中身」に目が向きがちです。もちろんどれも大事。でも、せっかく中身で心を動かしても、最後の「押す」でつまずかせたら、それまでの工夫が売上につながりません。追従カートボタンは、いわば「買いたい」という気持ちと「カートに入れる」という行動の間にかかる、短い橋です。

この橋を整えると、効果は地味に、でも確実に出ます。下まで読んでくれた熱心な人ほど、ボタンがすぐそこにある恩恵を受けます。逆に言えば、追従ボタンがないページは、いちばん買う気のある人に「探す手間」を課していることになる。これは広告費をかけて集めたアクセスを、最後の最後で取りこぼしているのと同じです。

一方で、やりすぎにも注意が必要です。追従ボタンが画面を占領しすぎると、商品写真や説明が読みにくくなり、かえって不快感につながります。「常に出す」ことが目的ではなく、「買いたい瞬間に、邪魔せず、すぐ押せる」のが目的。この順番を忘れないことが、押しやすさと心地よさの両立につながります。

明日からやること（3ステップ）

スマホの追従ボタンを整えたことで、迷わず購入まで進めたお客さんと、それを見て安心するEC担当者
最後のひと押しを取りこぼさない設計で、買いたい気持ちをそのまま届けよう。

いきなり全部を完璧にしなくて大丈夫です。まずはこの順番で、ひとつずつ。

  1. 自分のスマホで、売れ筋の商品ページを下まで読んでみる。「買おう」と思った瞬間に、ボタンがすぐ押せるか。探す手間があれば、そこが伸びしろです。
  2. 画面下部に追従カートボタンを置く。親指が届く下部に、十分な大きさで。ファーストビュー（最初の画面）の写真・価格を隠さないよう、少しスクロールしたら出す設定にする。
  3. ボタンの文言と出し分けを整える。「カートに入れる」「購入手続きへ」など行き先が分かる言葉に。色・サイズの選択が必要な商品は、選び終わるまで促し文言に切り替える。

この3つを整えるだけで、最後のひと押しの取りこぼしがぐっと減ります。慣れてきたら、追従ボタンが出るスクロール位置の微調整や、押し間違いを防ぐ余白の調整に進んでいきましょう。

チェックリスト：追従カートボタンを見直す10項目

関連テンプレ・ツール

もう一歩踏み込みたい人は、あわせてどうぞ。

自分のお店のスマホページが「最後のひと押し」で取りこぼしていないか気になる方は、商品ページ改善チェックリスト50で買いやすさを点検したり、無料のEC計算ツールで改善インパクトの採算を確かめてみてください。買いたい気持ちは、育てるだけでなく「そのまま届ける」ことも大切。親指ひとつで押せる設計で、最後のひと押しを取りこぼさないお店にしていきましょう。

参考（公式・一次情報）