一部の画面サイズでは、CTAはスクロールせずに見える範囲にあります
私はWebサイトをデザインしていて、ランディングページに2つのボタンが上下に並んでいます。 1つはプライマリボタンで、もう1つはセカンダリボタンです。
ページの構造には、画面の約40％を占める画像が含まれ、その下にタイトルと簡単な説明が続きます。その下に、上記の2つのボタンが続きます 
私が直面している問題は、ここに見られるように、十分な高さがない可能な最小の画面サイズ（iphone 5）の場合、2番目のボタンがスクロール時にのみ表示されることです 
この構造は、ある種のセクションを間に分割することによってユーザーを混乱させるので、これがユーザーにとって問題になるのではないかと思いますか？
ユーザーがスクロールすることを理解しています。ボタンが表示されないのではなく、構造の一貫性について疑問に思っています。考えられる回避策の1つは、説明テキストを減らすか、そのサイズを小さくすることですが、可能であればそれを避けたいと思います。
誰かがこの問題に直面し、これに以前に取り組んだことがあるかどうか疑問に思っています。私の考えを確認するためのデータはありませんが
一般的な形状（水平の正方形）と主ボタンの位置（折り目の真上）は、偽の底を作成します。
したがって、ここでの問題は、ユーザーがawareではないことです。つまり、プライマリボタンの下に別のボタンがあり、それを検出する必要があります。
下にスクロールしてセカンダリボタンが見つかったら、ユーザーは何らかのコンテキストを持っているため、CTAがランディングページに属していることを理解する必要があります。
しかし、スクロールとクリックはworkです。ユーザーが必要とするジェスチャーの量を最小限に抑えるエクスペリエンスを提供できれば、コンバージョン率が向上する可能性があります。
2つのボタンを小さい画面に並べて配置するか、スクロールせずに見える範囲にさらにコンテンツがあることを明確にします。
私はあなたのための最良の解決策は次のとおりだと思います：
1-試行すべてのボタンの長いタイトルを短くしますが、冗長な単語は削除します。
2-ボタンは小さな画面でも同じ場所になければなりません。これにより、アプリへのアクセスが減少します。
3-あなたがする必要があるのは、2つのボタンを並べて配置することです。 コンテンツが小さい場合やそれ以上の場合でも、常にアプリの下部に固定してください。したがって、スクロールしている場合、ボタンは常に表示されます。添付の画面に示すように。
または、上部の画像の高さを犠牲にして、下のコンテンツのためのスペースを作ることもできます。小さい画像でも同じ目的に役立ちます。
300px未満では、既に述べたように、要素は通常のレンダリングでわずかに縮小される場合があります。
または、画像を背景として使用し、テキストとボタンをオーバーレイします。
この問題を処理する方法はいくつかあります。
私は同様の問題に直面し、低解像度デバイスの画像の高さを減らしました-それはユーザーが決定を下すのに役立ちます（明らかに勝つ-次に非表示-意図的に非表示ではないことを理解しています）、「参照」という単語が2回表示される/戻る回避できるCTAでは、CTAを並べて表示できます 
スクロールせずに見える範囲とスクロールせずに見える範囲に関する懸念は、数十年前に発生しました。今やインターネットは十分に一般的であり、問題ではないと思われます。ユーザーは、Webページ全体が1つの画面に収まらず、スクロールする必要があることを知っています。 今日最も人気のあるサイトは、本質的に無限のスクロール体験です。
コンテンツがページに表示されるほど魅力的でない場合、ユーザーはスクロールしません、ではありません「混乱」しているため。
本当にユーザーがあなたのサイトで何をしているか知りたいなら、を使うことができますさまざまな画面サイズでのスクロール動作とクリック率を監視するJavaScript。
考慮すべきオプション：
- 特に「アカウント」リンクとボタンの周りの空白を減らします。
- アプリのようなナビゲーションバーを作成します。 （本質的には、ハリルハンナが推奨するものです。）
- ボタンの1つを削除します。 「食事プラン」と「メニュー」の違いは何ですか？一方は他方のサブセットと簡単に見なすことができます。
- Jairaj Ramendranの提案 のように、ボタンのテキストを短くして並べて配置します。
タイトルを画像にオーバーレイします。
![mockup]()
