あなたのサイトがGoogleでうまくランキングされていない理由や、消費者がそれに従事していない理由 ウェブサイトやウェブサイトの速度やSEOの問題の画像サイズは、多くの場合、直帰率やランキングに影響を与えて見られています。
多くの人にとって、ウェブ用の画像を保存することは常に謎でした。 重い画像（5000px幅の元の画像サイズ、最適化されていない画像）は、サイトのユーザーエクスペリエンスを低下させるだけでなく、SEO戦略（読み込み速度、直帰率、ラン).
ウェブサイトの画像サイズのガイドラインのリストを打破しましょう。
画像サイズとウェブサイトのパフォーマンスが重要なのはなぜですか？
グラフィックが最適化されていない場合、Webサイトの読み込みに時間がかかります。 遅いウェブサイトは悪いユーザーの経験、Googleの調査のランク付けのより低い確率で起因し、その結果、少数の問い合わせおよび消費者。
ウェブサイトの画像サイズのガイドラインでは、写真を適切な比率で保存し、web用に最適化することは、次のようなさまざまなことに役立ちます。
•Speed
Googleの調査によると、webページの読み込みに5秒以上かかると、モバイル訪問者がページを放棄する可能性が90％増加します。 画像サイズを縮小したり縮小したりすることで、ウェブサイトのページを高速化することができます。
•ユーザーエクスペリエンス
高品質で魅力的な画像を使用すると、訪問者はウェブサイトを閲覧する際に、より魅力的な体験をすることができます。 これらの写真を最適化してすばやくロードすることで、訪問者にシームレスでスムーズな体験を提供し、サイトに多くの時間を費やしてコンテンツを探索
*SEOランキング
早くあなたのサイトがロードされ、より高いあなたがランク付けすることができます。 デスクトップデバイスとモバイルデバイスの両方で、最適化されたグラフィックを持つwebページのロードが大幅に高速になります。
•Sales
より高速な読み込み速度と改善されたSEOは、連絡され、予約されているのあなたのチャンスを増加させる、あなたのサイトに多くの訪問者を引
ウェブサイトに最も適した画像サイズは何ですか？
Strikinglyは、さまざまな画面サイズ、セクション、スタイル、およびデザインのための画像サイズの広い範囲で動作するように構築されています。 しかし、アップロードする寸法の大まかな概念を持っていると便利なことがあります。
ここに従うべきいくつかの一般的なウェブサイトの画像サイズのガイドラインがあります！
画像は
1から撮影されています。 背景の画像
Strikinglyの背景写真は、モニターからタブレット、携帯電話まで、幅広い画面サイズに合うように設計されています。 すべての画面で背景が優れていることを確認するには、幅1600ピクセル、高さ900ピクセルのサイズをお勧めします。 注意して人、ブランド、およびその他の情報の非背景写真を含めます！
2. 背景の設定
背景のサイズを調整/整列するには、いくつかの選択肢があります。
ストレッチ/カバーデフォルト：このオプションは、高さと幅の両方で、画面全体を埋めるために画像を伸ばします。 画像は任意の画面サイズの背景として機能するため、通常はこれが最善の解決策です。 ただし、画像の側面（特に左右）にコンテンツがある場合は、携帯電話では表示されない場合があります。
Contain:Containは完全な画像を表示し、その一部が切り取られないようにします。 ただし、一部のデバイスでは、これにより空白が発生する可能性があります。
中央：画像はセクションの中央に表示され、中央を選択した場合は拡大縮小されません。 一方、背景には、画像の端の周りの空白が小さすぎることが表示されます。 画像の一部の要素は、特に小さいディスプレイでは、大きすぎると切り取られることがあります。
タイル：タイルは中央に配置され、その後、パターンを作成するために便利である画像を繰り返します。
ウェブサイトの画像サイズのガイドラインを開始するには、画像がページに表示される幅をメモしてください。
画像はStrikingly
から取得されます•背景画像
背景画像の理想的なサイズは1600x900px
•全幅画像
ウェブサイトの画像サイズのガイドラインによると、
•半角画像
半角画像は、最高の品質のために少なくとも700pxの幅でなければなりません。
•⅓width画像
画像は、最高の品質の1/3幅の画像のために少なくとも480pxの幅でなければなりません。
•¼width images
最高品質の1/4幅の画像を得るには、少なくとも360ピクセルの幅にする必要があります。
•小さなアイコンやロゴ
彼らは少なくとも100ピクセルの幅でなければなりません。
•ギャラリー画像
ギャラリー画像には任意のサイズで結構です！ ギャラリー内の画像は、あなたのウェブサイトの上にライトボックスで開きます。
あなたのウェブサイトに必要なサイズの画像は何ですか？
画像は、ページレイアウトに応じて、ウェブサイトのパフォーマンスを最大化するために、”コンテナ”に合うように必要なだけ大きくする必要があります。 たとえば、スライドショーの写真は大きく、ブログの画像は中サイズ（ページの幅からサイドバーを引いた幅に等しい幅）、サムネイルは小さくなります。
ウェブサイトの画像サイズのガイドラインに従って、サイトのコンテンツエリアの幅を計算するためには、まず画像の寸法を確認することが重 あなたは、対策を取る際にあなたを支援するために、”ページ定規”ブラウザプラグインを使用することができ、またはあなたが経験を持っている場合は、
画像はStrikingly
から取得されます次に、ツールバーで、要素選択ツールを使用して、興味のある画像またはコンテン:
画像はStrikinglyから撮影されたものです
画像はStrikingly
から取得されますこの場合、上の列には少なくとも525ピクセルの幅の画像が必要です。
高密度の”retina”画面を持つ新しいスマートフォンの画像は、できるだけシャープに見えるようにそれよりも大きくする必要があるため、”少なくとも”と言います。
次のシナリオを考えてみましょう。
A.全幅スライドショー Web画像サイズ
webサイトの画像サイズのガイドラインでは、全幅スライドショーには幅2560ピクセルを推奨しています(ブラウザのフルサイズに自動的に拡張されます)。 これは27″および30″モニターのための通常の決断の幅です。
画像は、選択したアスペクト比を達成するために、必要な高さにすることができます。 例えば、結婚式の写真撮影のウェブサイトで一般的なフルページのスライドショーは、写真の元のアスペクト比を維持します。 他のウェブサイトでは、ページの幅全体にまたがるスライドショーを使用しますが、高さは低くなります（アスペクト比は約3：1になります）。
以下は、写真サイトからの”パノラマ”スライドショーの例です:
画像はStrikingly usreのウェブサイト
から撮影された画像は、幅2560ピクセル（2500pxに四捨五入）で、ブラウザの幅全体にまたがる画像に選択した高さ（画像の
これは、retinaディスプレイの画像サイズを2倍にする必要がある場合ではありません。
ページの幅全体を占めるのではなく、その一部（2000px、1800pxなど）のみを占める小さなスライドショーのために必要な画像サイズを調整します。)
画像はStrikingly usreのウェブサイト
B.ギャラリー内の画像サイズ（およびライトボックスビューで拡大するサムネイル）
サムネイルギャラリーは、拡大したときに写真が十分に大きくなるようにサムネイルのサイズが無視されるユニークな状況です。
これらの写真はフルスクリーンモードで開くため、ウェブサイトの画像サイズのガイドラインでは、デスクトップやタブレットでよく見えるように、少なくとも1500ピクセル幅にすることを推奨しています。
余分な”wow factor”を追加したい場合は、2000ピクセルまで上げることもできますが、通常はそうではありません。
画像はとにかくモバイルデバイスのブラウザによって調整され、1500pxはPPIの高い”retina”画面を持つスマートフォンで鮮明に見えるのに十分な大きさです。
最大高さが1200ピクセルの縦/縦の画像（縦2：3の画像では800×1200ピクセル、縦3：4の画像では900×1200ピクセルなど）はさらに小さくすることができます。
スライドショーでサイド矢印、箇条書き、モバイルでのスワイプ、またはデスクトップ上のキーボード矢印を使用して写真間を閲覧できる場合、このような画像の大きさを制限すると、ファイルサイズが合理的に短くなり、画像の読み込みが速くなります。
C.ページレイアウトでのブログ記事やその他の静的画像の推奨画像サイズ
ブログの写真がクリック拡大（または”ライトボックス”）機能を必要としない場合は、列または列に応じてサイズを設定する必要があります。コンテンツ領域の幅。
単一のブログ投稿の例を次に示します:
画像はStrikingly usreのウェブサイト
から取られています上記の方法を使用してテキストの任意の段落を測定することにより、コンテン:
画像はStrikingly usreのウェブサイト
から取得されています。
同じ情報を取得するには、画像情報の表示（プロパティ）のようなブラウザプラグインを使用することができます。
その情報（たとえば825ピクセル）を使用すると、retinaディスプレイを考慮してサイズを2倍にすることができます（幅は1650ピクセル）。
サイトのテーマと画像盗難のリスク許容度に応じて、その量を最も長いエッジでより賢明な1200ピクセルに減らすことができます（したがって、水平画像は幅1200px、垂直画像は高さ1200pxでなければなりませんが、元のアスペクト比は維持されます）。
サムネイルとして使用される小さな写真（拡大する必要はありません）は、同じ意思決定プロセスの対象となります。
結論
これらのウェブサイトの画像サイズのガイドラインは、PhotoShelterやSmugMugのような写真アーカイブサービス（セキュリティ対策が組み込まれており、サイトが必要に応じて元の高解像度ファイルから低解像度のサムネイルを生成する）、または冒頭で述べたように、これらの画像をダウンロードまたはプリントとして販売する場合には、実際には適用されません。
あなたが自己ホストサイトを持っていて、ウェブ上であなたの写真を提示する必要がある場合、これらのウェブサイトの画像サイズのガイ
適切な画像を選択することは、視覚的に魅力的で高速なウェブサイトを作成する上で重要な側面です。 間違いなく、学習曲線があります。 しかし、そこに持っていたことが他の利点があり、それはウェブサイトを作成し、維持することの興奮のすべての部分です！