サイトのモバイル版：どのように行うには？適応設計
今日、ほとんどの人はオンラインでモバイルガジェット - タブレット、携帯電話、これに関連して、サイトの最適化も新しいレベルになります。ユーザーが来て、サイトがモバイルデバイス用に最適化されていないことを認識した場合： - 彼が出てくると別のより便利を探すために開始されることに100％の99あなたは、画像を表示することができない、ボタン、小さくて読めないフォント、デザインスキューをオフに引っ張りました。検索ロボットは、リソースが無関係である、すなわち検索クエリと一致しないことをチェックする。したがって、ページのデザインは、必然的に様々なモバイルデバイスに適合しなければならない。サイトのモバイル版とは何ですか、それを行う方法、それを適用する最善の方法は何ですか？この記事で詳しく読む。
したがって、サイトをモバイル版に適合させる4つの主要な方法があります。
第1の方法 - 適応設計
アダプティブテンプレートは変化を示唆画面サイズに応じたサイトの画像原則として、標準の1600,1500,1280,1100,1024、および980ピクセルに設定されています。実装には、CSS3 Media Queriesを使用します。サイトのデザインは同時に変更されません。
このメソッドの利点は次のとおりです。
- 便利なデザインは、構造自体が画面のパラメータに適合していて、どんなアップデートでも最初からデザインを開発する必要はなく、CSSとHTMLを修正するだけです。
- 1つのURL - ユーザーは覚えておく必要はありませんリダイレクトする必要はありません（あるアドレスから別のアドレスにリダイレクトする必要はありません）。これはウェブマスターの作業を複雑にする可能性があり、検索エンジンは単一のアドレスでリソースをソートしてランク付けする方が簡単です。
もちろん、適応テンプレートには独自のテンプレートがありますこれはメリット以上のものです。それにもかかわらず、多くの開発者はこのコンセプトを遵守しています。たとえば、Googleのモバイル版のサイトでは適応設計が行われています。したがって、欠点は次のとおりです。
- アダプティブデザインは、同じタスクをサポートしていませんモバイルデバイスとして、PC上のように。これが、例えば、銀行のウェブサイトのモバイル版である場合、ユーザーが為替レートまたは最も近いATMに関する情報を有する可能性が高い場合、この設計は十分である。しかし、それがセクションとサブセクションが多い複雑な構造化リソースであれば、適応型レイアウトはビジターにアピールすることはまずありません。
- ダウンロードが遅いと、お気に入りのサイトが嫌い。これは特に、アニメーション、ビデオクリップ、ポップアップなどのアクティブな要素が豊富なリソースに当てはまります。重い重量のために、ページは単純に「減速」し、ユーザーは怒って離れ、サイトの検索位置が下がります。
- モバイル版を無効にできない - その他1つの重大な欠点。そのようなレイアウトによって隠されている要素がある場合、無効にして通常のドメインに移動できるサイトとは異なり、その要素を開くために何もできません。
それにもかかわらず、このようなモバイル版のサイトは高速ですが、特別なスキルとコストがなくても、リソースをあらゆるガジェットに適合させることができます。しかし、欠点を鑑みれば、複雑なナビゲーションやアニメーションを必要とせず、最小限の情報とマルチメディアで、小さくてシンプルなリソースに適しています。複雑なサイトでは、他の2つの方法が適しています。
2番目の方法は、サイトの別バージョンです
この方法は非常に一般的であり、しばしば成功するモバイルデバイス上のサイトを知覚のためにより便利にする。その本質は、アプリケーション用に描画され、別のURLまたはサブドメインにある別のバージョンのページを作成することです（例：m.vk.com）。同時に、主要な機能は保存され、サイトのデザインは単に異なって見えます。この方法の利点は明らかです。
- ユーザーフレンドリーなインターフェース。
- バージョンが主リソースとは別に存在するため、変更や編集が容易です。
- 別のバージョンのサイトの重みが低いため、適応テンプレートよりもはるかに高速です。
- 最も頻繁にモバイルのページのメインバージョンに行く機会があります。
しかし、ここでも欠点がありました。
- 複数のアドレス - デスクトップ版とモバイル版サイト。ユーザーに2つのオプションを覚えさせるにはどうすればよいですか？ウェブマスターは、デキューアップバージョンからモバイルへのリダイレクト（リダイレクト）を規定することが多いが、モバイルページにこのページが存在しない場合には、エラーが発生する。ここでは2つの同一のリソースをランク付けすることが困難な検索エンジンでは困難があり、これが進捗に直接影響します。
- ユーザーが誤ってそれに行くと、コンピュータからサイトのモバイル版は、出席に影響することができばばかげて見えるだろう。
- このバージョンは、デスクトップを大幅に縮小することが多いため、ユーザーは非常に限定された機能を得ることになります。しかし、同時に、何かが欠けている場合、訪問者はページのフルバージョンに行くことができます。
一般に、別個のモバイルサイトはそれ自体を正当化するモバイルデバイスにリソースを適合させる最も一般的な方法です。これは、Amazonなどの大規模なオンラインストアで一般的です。
3番目の方法はRESS-designです
Google検索エンジンはこれを積極的にサポートしていますモバイルデザインの方向性これは、電話やタブレットにサイトを適合させる最も複雑で費用がかかりますが、効果的な方法です。それはRESSと呼ばれています。これはモバイルアプリケーションのリソースターゲティングで、各デバイスごとに個別にダウンロードできます。アンドロイドの場合 - GooglePlay、アップルの場合 - iTunesの場合
このようなアプリケーションは、高速で、無料で、便利で、さまざまな種類の情報に対応する能力を持ちながら、携帯電話のメモリとインターネットのトラフィックは、ブラウザを介してサイトにアクセスしたときと同じように食べられません。リンクは常に画面に表示され、ブラウザのアドレスバーに複雑な名前を入力する必要がないため、簡単に入力できます。
もちろん、ここには欠点があります。開発の複雑さ、多数のプログラマーの労働の高コスト、レイアウトのいくつかのバリエーションを作る必要性。モバイルデバイスがアプリケーションによって認識されないことがあります。定期的な技術サポート、不足の修正が必要です。それにもかかわらず、このオプションは、その生産的でスムーズな操作のために提供された3つの中で最高のものとみなされます。
モバイルサイトを作る最も安い方法
上記の方法のすべては、長くて複雑な、しかしまだウェブマスターの仕事を支払っているとは限りません。このような開発が緊急に必要でない場合は、シンプルで無料のモバイル版のサイトを使用できます。それを簡単にする方法は？
特別なテンプレート（プラグイン）をダウンロードする適応設計。たとえば、WP Mobile Detector、WordPress Mobile Pack、WPSmart Mobileなどです。彼らは、携帯電話にサイトを正しく表示するのに役立ちます。同時に、モバイル版へのページのより良い適応のために修正すべきいくつかのヒントを受け取ります。
もちろん、この方法はほとんどのために適しています深刻なリソース。むしろ、この無料機会は、小さくて簡単なサイト、ブログ、ニュースフィードを対象としています。 YandexのようなGoogleの検索エンジンは、今日モバイル版では深刻な要求をしていることを忘れないでください。この方法を使ってポジションを下げるチャンスがあります。
この方法では、ほとんどの場合、広告とポップアップのバナーは切り取られますが、ページは「遅れ」なく迅速に読み込まれます。
モバイル版の作成原則
どんなものであれ、モバイル版のサイトは無料で作成されますまたはウェブマスターのスタッフの助けを借りて、RESSシステム上で、または適応テンプレートを使用して行われます。最も重要なことは、効果的な作業のためには、いくつかの非常に重要な原則に従うことが求められることです。だから、サイトのモバイル版は何でしょうか？どのように生産性、効率的かつ生産的にするには？
不要なものはすべて削除します
ミニマリズムは、モバイルサイトの開発者。それは花、ボタン、バナーに満ちている情報を、受信することがいかに難しい想像し、あなたは右の材料を見つけるために、延々とスクロールしなければなりません。モバイルデザインはシンプルで清潔でなければなりません。色空間（例えば、会社）を分離するための2-3を選択します。そのうちの一つが白である場合、それは良いです。小さな画面をクリアし、読みやすいゾーン上のスペースを分割します。バーチャルキーは、ユーザーがどこをクリックしているかを明確に把握できるように表示する必要があります。これは商品です。ここにデータを記入するためのフォームがあります。ここには配送と支払いに関する情報があります。
有用と思われる追加のオプションデスクトップ版では、ユーザーの生活を楽にしてくれるので、合併症だけが発生します。最も重要な要素だけを残す。アニメーション、広告バナー、マルチメディアは、おそらくサイトやアプリケーションの速度を落とし、主なものから気をそらすだけです。
アラインメント
均等化の問題はあまり重要ではありませんが、あなたがそれを間違って行うと、重要な言葉の終わりだけを受け取るからです。左右のアライメントは共通であると考えられます。あなたの携帯電話のニュースラインをどのように反転させるか想像してみてください。あなたは上から下へ、左か右へはそうしません。
統一
遷移の長い連鎖の可能性がない場合、いくつかのステップを1つにまとめるようにしてください。たとえば、サイトにはいくつかの段階でデータを入力する必要があります。名前には、各家に別々の家、通り、アパートなどが含まれている住所を入力する必要があります。ユーザーが多数の小さなセルを取得しようとしないようにするには、名前と住所。
そして離脱
時には、反対に、あなたも切断する必要があります多くの情報。たとえば、ドロップダウンメニューには、配送が行われる80以上の都市のリストがあります。ユーザーがこの巨大なリストをスクロールする必要がないように、それらを地域別にグループ化します。彼が地域の中心または地域を指し示すとき、都市の別のリストは中止されます。
チェックリスト
ちなみに、リストについては。 2つはアルファベットまたはその他の順序で置換されています。それらの選択は、何が表示されるかによって異なります。
固定していると便利ですユーザは彼が探しているものを正確に知っている。たとえば、都市、番号または日付です。 2番目のオプションは、長い複合名や同じ名前のバリエーションが多数ある場合に適しており、各ドロップダウンリストによってユーザーが目標に近づきます。自動置換を使用するバリアントは、訪問者が支援を必要とする場合によく使用されます。例えば、ニッティングのためのサイトは、編み針を購入することを提案する。ユーザーは検索クエリ "Metal knitting needles"を入力し、ツールチップには "Spokes 5 mm"、 "Spokes 4,5 mm"などが表示されます
オートフィル
この段落は、特にオンラインで販売し、標準的な支払い方法、納品書などを記入する必要があります。電話で購入する場合は、コンピュータにアクセスする時間がない可能性が非常に高いため、購入プロセスをできるだけ迅速かつ便利に行う必要があります。
このために、フォームにはすでにデータは、最も一般的な回答に頼ることができます。たとえば、ある地域で働いている場合は、今日の日付、現金での支払い方法、都市などを挿入します。それらは変更することができますが、ターゲットに当たった場合、ユーザーの時間が節約されます。
すべてが読み込まれ、すべてが見えます
モバイル版のウェブサイトを作成するときは、すべての電話が異なっており、同じビジョンいます。たぶん、あなたのサイトは、小さな画面で表示されるので、フォントは、ボタンシンプルで読みやすいべきである - 彼らは次のページに取得タップしなかったことを十分に大きく、それがインターネットに来る場合は特に画像は、別途大型開いておく必要がありますお店。
いくつかの統計
モバイルデバイスへのサイトの適応について言えば、このプロセスがネットワークを促進することの重要性を理解するための統計に頼ることはできません。
数字は以下の通りです。 今日のガジェットは、若年層の子供や一部の高齢者を除いて、人口の87％が使用しています。エコノミストは、今後5年間、モバイルコマースの成長を100回予測しています。同時に、サイトの21％のみがモバイルデバイスで動作するようになっています。したがって、インターネットトラフィックと電子商取引市場はわずか5分の1で占められています。
これらの数字を考えてみてください。あなたのリソースを適応させるのは理にかなっていますか？もちろん、はい。さらに、この市場には余裕がある限り、自分のセグメントを取ることができます。
モバイル版はどこに必要ですか？
モバイル版を使用するのは適切です高い評価を得ようとするプラットフォーム。結局のところ、これはユーザーに直接的な影響を与え、あなたのサイトに快適に滞在できる条件を作り出します。
モバイル版がなければ、存在することはできません：
- ニュースポータルは、仕事や勉強の途中で電話を見ている人の大部分です。
- ソーシャルネットワーク - 同じ理由で、プラスそこにコミュニケーションの要因は、オンラインであるので、フレンドリーチャットを作成すると便利です。
- 参照サイト、ナビゲーション付きサイトなど、人々が何かを探しているときに人が回る場所。
- オンラインストア - ショッピング旅行に時間を費やさずにモバイルインターネット経由ですべてを購入するバイヤーを誘致する機会。
結論の代わりに
今日、モバイル技術は市場でリーダーシップを発揮するためには、インターネットリソースが要件を満たしていることを確認する必要があります。ユーザの要求が増加するため、サイトは絶えずアップグレードされ、異なるデバイスに適応されなければなりません。ある人が特定のリソースに不快なら、彼は製品や価格に関する情報を得ることができず、注文し、配送について学ぶことができ、すべてが可能になる場所を見つけることは明らかです。したがって、競争に勝つためには、柔軟で便利で機能的で面白いリソースを持つことが重要です。
このモバイル版のサイトを作成するAndroidまたはIos。これを行うには、上記の再設計の方法の1つ、アダプティブテンプレート、サブドメインに新しいサイトを作成してリダイレクトで移動する、フリーテンプレートを使用する、モバイルアプリケーションを作成するなどの方法を選択する必要があります。
このようなアプローチは、既存の顧客の忠誠心を維持するだけでなく、新たな訪問者を引き付ける機会を提供するのにも役立ちます。
</ p>
