ご覧いただきありがとうございます。
初心者にも親切丁寧なWEBデザイナー
more design officeの樹下です。
WEBサイトをスマホで見ていて、
「お問い合わせボタンが小さくて押しにくい」
「ボタンがどこにあるか分からない」
と思った経験はありませんか？
実は、ボタンの「押しやすさ」はサイトの成約率（コンバージョン率）に直結する非常に重要な要素です。どんなに良いサービスでも、最後のボタンが押しにくいだけで、お客様は離脱してしまいます。今日は、スマホユーザーに優しい「親切なボタン設計」について、4つのポイントで詳しく解説します。
1. 「親指」が届く範囲を意識した配置
画面の一番上や、左右の端すぎる場所は、片手操作では非常に押しにくいエリアです。お客様が「申し込もう！」と思った瞬間に、自然と親指の近くにボタンがある。この「無理のない配置」が、お客様のストレスを減らし、スムーズなアクションへと繋がります。
イメージ画像： ボタンはなるべく真ん中に
2. 「指の腹」で確実に捉えられる適切なサイズ
スマホのボタンが小さすぎると、隣のリンクを誤って押してしまったり、何度もタップし直したりすることになります。
AppleやGoogleのガイドラインでは、タップ領域は最低でも「44px〜48px以上」が推奨されています。これは、大人の指の腹がしっかりと収まるサイズです。「デザイン的に小さい方が綺麗だから」という理由で小さくせず、まずは「押しやすさ」という機能を最優先しましょう。
イメージ画像： 適切なサイズのボタン
3. 「追従（フローティング）ボタン」で迷わせない
縦に長いLP（ランディングページ）やブログ記事では、スクロールしても常に画面の下の方にボタンが表示され続ける「追従ボタン」が非常に効果的です。
お客様が文章を読み進め、「これいいな」と思ったその瞬間にボタンがそこにある。わざわざ一番下までスクロールしたり、メニューに戻ったりする手間を省くことができます。この「いつでも声をかけられる」安心感が、お問い合わせへの心理的ハードルを下げてくれます。
イメージ画像： 右下に固定でボタンを設置
4. ボタンの「色」と「言葉」で背中を優しく押す
ボタンは背景色とハッキリ区別できる「目立つ色」にすることが鉄則ですが、ただ目立てば良いわけではありません。
「送信」という事務的な言葉よりも、
「無料で相談してみる」
「空き状況を確認する」
など、そのボタンを押した後に何が起こるのかが具体的に分かる言葉（マイクロコピー）を添えましょう。お客様が次に取るアクションを具体的にイメージさせることで、安心してお申し込みへと進んでいただけます。
イメージ画像： 何が出来るのか具体的に説明したボタン
さいごに
ボタン一つ、配置一つを整えることは、お客様を目的地まで優しくエスコートする「親切心」の現れです。あなたの想いが詰まったサービスに、一人でも多くのお客様が辿り着けるよう、指先への優しさを忘れないサイト作りを心がけましょう。
「自分のサイトのボタン、押しにくいかも？」「スマホでの見え方を改善したい」という方は、ぜひお気軽にご相談くださいね。初心者の方にも分かりやすく、効果的な改善案をご提案させていただきます。
▼スマホでの使いやすさにこだわったHP制作はこちら
▼成約率を高めるボタン配置のLP制作はこちら
