モバイルウェブページはユニークな動物です。大画面と正確なマウスクリックのために設計されたデスクトップフレンドリなWebページとは異なり、モバイルWebページは画面が小さく、不正確な指タッピングのためにサイズが調整されています。さらに、現代のWebサイトは、デスクトップとモバイルの両方の形式で公開することが義務付けられているため、すべてのWebページを実際に2回作成する必要があります。
08の01画面サイズと「不動産」は異なる
これは、デスクトップとモバイルのWebページの間で最も明白な違いです。ほとんどのデスクトップモニタは19インチから24インチの対角サイズですが、タブレットは通常10インチの対角です。スマートフォンは4インチの対角です。シンプルなズームアウトでは、Webページをモバイルフレンドリに変換することはできません。これは、テキストのみを読むことができないためです。同様に、ズームアウトされたウェブページ上で指タッピングを正確に行うことは不可能になる。モバイルWebデザイナーは、実際にページレイアウトへのアプローチ全体を変更する必要があります。一般的に、デザイナーはサイドバーや不要な画像を削除したり、小さい画像を選択したり、フォントサイズを大きくしたり、コンテンツを展開可能なウィジェットに折り畳む必要があります。この不動産の制限は、Webデザイナーの間で全く違った考え方を導いてきました。
ウィジェットと「スライダー」が入っています。サイドバーと空白があります
モバイルフレンドリーなページのほとんどは、サイドバーのナビゲーションリンクの一部またはすべてを削除し、折りたたみ可能な/展開可能なメニューウィジェットで置き換えることが期待できます。同様に、コンテンツの左右に空白がないことを期待し、タブレットとスマートフォンの不動産の使用を最大限にしようと努力するデザイナーとしての空白ははるかに少なくなります。
指のタッピングは、マウスのクリックよりも精度が低い
デスクトップ上の正確なマウスポインタとは異なり、人間の指はブロブであり、指でタップするとハイパーリンクの画面に大きなターゲットが必要です。モバイルウェブページ上のより大きな矩形のタップターゲット（タイル）を見ることができ、テキストベースのハイパーリンクが少なくなることが期待されます。さらに、指タップの不正確さに対応するために、メニューはしばしば大きなボタンと大きなタブに置き換えられます。
04/08モバイルページのURLが異なる
モバイルフレンドリーなWebページには、通常、そのアドレスの重要な部分として文字「m」が含まれています。モバイルのタブレットやスマートフォンでサーフィンすると、モバイルURLが自動的に選択されます。場合によっては、通常のデスクトップ版のページに切り替えることができるタップ可能なリンクが表示されます。
08の05広告が削減または削除された
はい、これは読者にとっては素晴らしいことですが、ウェブ広告主にとっては本当に難点です。タブレットやスマートフォンには部屋が少なくなるため、多数のスポンサーリンクや大きなバナー広告を配置するだけでは機能しません。代わりに、モバイルウェブページに、特に画面の中央下部に特殊な小さなポップアップタイプの広告が表示されることを期待します。モバイル機器が成熟するにつれ、他の賢いタイプの小型広告が考案されている。
06の08チェックボックスと小さなリンクは苛立つ
ウェブサイト運営者が小さな画面用にコンテンツを完全に再デザインしないと、しばしば小さいタイプの小さなチェックボックスをクリックするためにブロブタイプの指を使用するようになります。これにより、ユーザは、チェックボックスを正確にタップするために、試行錯誤またはピンチズームを使用する必要があります。
07/08パスワードログインが不明瞭になるか、過度に小さくなる
はい、これは多くのモバイルウェブページで現代的な迷惑です。多くのウェブサイト運営者は22インチの画面で考えているため、2つの迷惑なモバイルエクスペリエンスを設定します：ログインとパスワードのフィールドは小さくて盗難が難しく、スライディングモバイルキーボードはログインとパスワードフィールドをカバーします。ログインフィールドを表示するには、ピンチズームを使用して調整する必要があります。また、非表示のログインボタンを表示するには、画面をスクロールしてキーボードをオフにする必要があります。うまくいけば、現代のウェブ出版社はすぐにこの悩みの周りに巧妙な方法を見つけるでしょう。
08の08写真はより顕著になる
一般に、写真は小さいスクリーンに収まるように収縮します。まれに、写真が実際にタブレットまたはスマートフォンディスプレイの幅を埋めるように拡大されます。
