レスポンシブテーマと応答ウェブサイトは何ですか?
レスポンシブWebデザインは世界をブログで新しいホットな話題です。 頻繁に応答ウェブサイトやテーマを選ぶ前に、よく寄せられる質問への回答をご覧ください。
我々は、すべてのロット、今日のWebデザインドメインにこの言葉「応答」を聞きます。 人々は非常にお勧めと応答性のデザインを使用することの重要性夢中になります。 しかし、の分野で初心者専門のブログやwebmasteringは、多くの場合、 応答性のウェブサイトとどのように1を開発することであるかについて、すべてこのバズのホールドを取得するには少し時間がかかります。
人々はしばしば自分の作成 した画像ファイル(例えばPSD)に基づいてWebサイトのテーマを 。 すべてのウェブサイトのデザインはイメージとして開始しているが、一つは彼らのデザインは、応答性の原理に準拠し、モバイルフレンドリーであることを非常に注意しなければなりません。 のは、被験体にディップを取ると、この問題についてのすべてを見つけるしてみましょう。
さて、ウェブサイトの応答性は、それが上で見られているデバイスに応じて表示を調整する能力を指します。 デスクトップPCを使用するために使用される人々のほとんどはそこにデバイスのすべての種類がある-nowていた時代は終わりました。 デスクトップ、ラップトップ、ネットブック、タブレット、ミニタブレット、電子書籍リーダー、スマートフォン、それほどスマートではない携帯電話! あー! あまりにも多くの懸念すべきではありません!
すべてのこれらのデバイスは、自分の特定の画面サイズや解像度を有しています。 「剛性」のウェブサイトは、に適応することができる(またはに応答する、と言うことができます)、様々な画面サイズではないでしょう。 ブラウザでの水平スクロールバーの外観は、ウェブサイトが応答しない最も顕著な兆候の一つです。

ウェブサイトのテーマは、応答性とモバイルフレンドリーにする必要があります。
これとは対照的に、応答性をテーマにしたウェブサイトは、適応することができますし、コンテンツは任意の画面サイズの容易に読み取り可能であることを確認します。
あんまり。 応答性のテーマは、ウェブサイトのコンテンツは、訪問者が使用することができることを主な目的と表示を調整します。 この目標を達成するために、ウェブサイトはそれの一部が付属(サイドバーなど)のコンポーネントおよび他のコンポーネント(例えば、画像、フォントなど)の変化の大きさだ隠すことができます
あなたのウェブサイトのテーマがどのように応答知ることは非常に簡単です。 ただ、コンピュータモニタや携帯電話の画面サイズの異なる上でそれを開きます。 あなたのウェブサイトは大丈夫見て、すべてのコンテンツが読み取り可能である場合は、あなたのウェブサイトが応答します。 あなたのウェブサイトをテストするための装置の異なる種類を持っていない場合は、使用することができます応答のためのオンラインテストを 。
一般的な答えは、はい、それは非常に重要であるということです。 しかし、あなたの前に - あなたは、あなたのWebトラフィックデータを見るべき応答1でそれを変換するためにあなたのウェブサイトのイメージチェンジを行うための決定を下します。 このデータから、あなたのウェブサイトは、モバイルデバイスから受信しているどのくらいのトラフィックを探してみてください。 通常のウェブサイトは、デスクトップ/ラップトップ上で使用するように設計されているブタあなたのようなデバイスからの重要なトラフィックを取得している場合はタブレット/携帯電話 -あなたはあなたのウェブサイトがこのようなデバイス上で見ているか確認する必要があります。
現在では、アジアのウェブサイトは、 モバイルデバイスからのトラフィックの27%の平均を受けています。 モバイルデバイスは比較的はるかに人気があるので、この割合は、ヨーロッパやアメリカなどの分野でのウェブサイトのための非常に高いであろう。
あなたは、応答性が簡単にだけ CSSを使用して達成することができることを驚かれることでしょう。 現在のCSS標準を使用すると、異なる画面タイプのためにあなたのウェブサイトのスタイル設定することができます。 これは、さまざまな画面サイズ用に別のCSSルールを持つことができることを意味します。 例えば:
@media画面と(最大幅:320ピクセル){
.primary-サイドバー{表示:なし} //非表示サイドバー画面サイズが320ピクセル以下であり、
}
@media画面と(最小幅:1024px){
ボディ{フォントサイズ:12ピクセル} //画面のため設定されたフォントサイズがより大きい1024pxのサイズ
}
このようなカスタマイズされたCSSルールは、画面上の使用可能なスペースに応じて、あなたのウェブサイトの外観を制御します。
あなたのためのレスポンシブデザインのために行くことにした場合、ウェブサイトやブログ 、あなたは次のような利点を持つことを期待することができます:
- モバイルデバイスユーザーがそれを使用することが可能になり、新たな情報のために戻ることを決定することができるため、トラフィックはあなたのウェブサイトに増加します。 モバイルユーザーは、ウェブサイトのコンテンツを使用できない場合-theyは戻って来ることはありません!
- あなたがあなたのウェブサイト上の広告を使用する場合は、オンラインでお金を稼ぐ -あなたの収入を応答ウェブサイトはうまくまた、モバイルデバイス上で広告を表示することができるようになりますので、増加させることができます。
- あなたはあなたのウェブサイトの異なるバージョンを開発したりする必要はありません異なるプラットフォームのためのブログ 。 複数のバージョンはより多くのメンテナンス時間を要求するので、これは、同様のメンテナンスに時間を節約します。
- あなたは異なるタイプのデバイスに複数のバージョンを開発する場合は、Googleのインデックス作成の重複URLの危険に直面しています。 同じコンテンツを指す異なるURLが重複したURLと呼ばれます。 Googleは、コンテンツがあまりにも重複していることを信じて、重複するURLに重いペナルティを置きます。 レスポンシブウェブサイトのデザインは、このようなペナルティからあなたを守ります。
- 同ウェブサイトはすべてのブラウザのエージェントのために動作しますので、あなたは正しいエージェントの検出を心配する必要はありません。
- あなたのウェブサイト上のすべてのページがそれに関連付けられた1つのURLのみを持つことになりますので、ソーシャルメディアのウェブサイト上のURLの共有が容易になります。
レスポンシブデザインの有意な欠点は、余分なCSSルールは、CSSファイルのサイズを大きくし、結果として可能性があることを除いてはありませんダウンロード時間が増加します。 しかし、より高速なインターネットは世界中で利用可能になって-Iは、これは任意の実際の問題を提起するとは思いません。
レスポンシブ設計では、異なる画像が異なる画面サイズには使用されません。 代わりに、同じ画像は、デバイスの画面に収まるようにCSSを介してリサイズされます。 だから、モバイルデバイスは、デスクトップ接続で提供しています同じ高解像度の画像をダウンロードする必要があります。
今、私たちは応答デザインは、モバイルインターネット接続に少し余分な負担をかける可能性があることを知っている、あなたがあなたの現在の(応答性または非応答性)デザインが動作しているどのくらいの速テストすることができるしていることが重要です。 これをテストするための最高のオンラインツールがされPageSpeed の Googleからの。 このツールは、両方のデスクトップおよびモバイルデバイス上であなたのウェブサイトを得点することができます。
Googleのウェブサイトのほとんどは、今で応答します。 例えば、 Chromebookのウェブサイトは、応答性のデザインを使用しています。 しかし、Googleは、インターネットに関連するものの先駆的企業です。 より多くの他の企業は、レスポンシブデザインの重要性を認識しているように、ウェブサイトでは、この新しいパラダイムにシフトしています。 ウェブサイトを見てくださいウェンディーズレストランチェーン 、インバウンドマーケティング会社ハブスポットや新聞ボストン・グローブいくつかのインスピレーションを得るために。
はい、まだ応答デザインを採用していない多くの主要なウェブサイトがあります。 例としては、 CNNやBBCを 。 これらは、大規模なウェブサイトや大規模な投資を必要とするかもしれない応答性を組み込むための完全に再設計されています。 つまり、これらのメディアの家が応答行くためにまだある理由である可能性があります。
いいえ、それは本当に高価ではありません。 あなたはワードプレスに基づいてウェブサイト/ブログをお持ちの場合、使用可能な応答テーマがたくさんあります。 ワードプレス(すなわちのデフォルトテーマTwentyThirteenは )も反応するように設計されています。 ワードプレスやBloggerによって提供される自由なテーマのほとんどは、応答性です。 しかし、あなたは - あなたは、その応答性を確認する必要があるサードパーティのテーマを使用している場合。