モバイル端末向けにウェブサイトを最適化する方法

ビューアブル・エリアで様々なデバイスでのページの表示を設定する
Tilda-ウェブサイトレイアウトは、タブレット、スマートフォン、ネットブック、ノートパソコン、デスクトップパソコン用に自動的に調整されます。
さらに、モバイル用にパディングのサイズを変更したり、様々なデバイス用にブロックの可視性を調整したり、Tilda のZero Block エディタを使って独自のレスポンシブ・レイアウトをデザインしたり、モバイル用のアダプティブ・モードをオフにしたりすることもできます。
Ссылки:

ブロックの可視性を調整する
モバイルとデスクトップで異なるバージョンのブロックをデザインする方法
もっと読む

モバイル版パディングの調整
モバイル版のパディングサイズを変更する方法
もっと読む

独自のレスポンシブウェブサイトバージョン
Zero Block エディターを使ってモバイル版をデザインする方法
もっと読む

ウェブサイトのアダプティブモードをオフにする
さまざまな画面解像度に対応するウェブサイトのアダプティブバージョンをオフにする方法
続きを読む
ブロック・ビジビリティ・オン 様々なデバイス

表示領域/ブロックの可視性は、特定の種類のデバイスでどのブロックを表示できるか、または表示できないかを決定する設定です。このパラメータは、どのブロックの設定パネルでも調整できます。
必要な理由と仕組み

ブロックが デスクトップではよく見えるが 、モバイルではあまりよく見えない場合は、ブロックの可視性を980px以上に設定するとよいでしょう。こうすることで、ブロックはデスクトップ向けになり、モバイルデバイスでは表示されなくなります。(русская версия отличается - 特定のブロック(ヒーローセクションなど)が良く見える場合)


その後、ブロックをコピーし、その設定を調整することでモバイルでの表示に最適化します(画像の変更を伴う場合があります)、 フォントを使用している、 など)。ブロックの可視性を "0-980px" に設定します。その結果、モバイル版のブロックが表示されます。 フォントサイズ?

結局、PCからアクセスした人はデスクトップ版を、モバイルユーザーはモバイル版を見ることになります。

ブロックの可視性は、ブロックの設定パネルで見つけることができ、特定の画面解像度のデバイス上でブロックを表示したり、表示しなかったりするように調整することができるパラメータです。例えば、あるブロックはタブレットで、またあるブロックは携帯電話でうまく表示されません。 (この場合、パラメータに異なる値が設定されることになります。)

すべてのブロックの表示を変更する必要はありません。写真が間違ってトリミングされているブロックや、選択したブロックがモバイル版に適していない場合にのみ変更できます。

デスクトップで見栄えのする表紙ができました。テキストは左に、メインオブジェクトは右に配置されています。では、モバイルデバイスでもきれいに見えるように調整してみましょう。 (русская версия отличается)

モバイルサイト版がどのように見えるか確認してみよう。 ご覧の通り、モバイルでは表紙/写真がトリミングされ、あまりよく見えない。(русская версия отличается)

モバイルデバイスに表示されないようにするには、カバーブロックの設定パネルでブロックの可視性を"> 980px "に設定する。これで、モバイルユーザーには表示されなくなります。
ブロックをコピーする。

モバイル版のブロックを調整する-写真とテキストの配置を 変更する(неясная русская фраза)

ブロックの可視性を"≦980px "に設定したので、980pxより広い画面のデバイスには表示されません。

完了!これで、表紙/ヒーロー・セクションが画面幅によって異なる表示になりました。

様々なデバイスの画面幅の例:
iPhone5: 320px
iPhone6: 375px
iPhone6+: 414px
iPad1024px
サムスン・ギャラクシー:360px
ノキア・ルーミア:320px

(отличаетсяпорядокверсий)。

モバイル用にパディングを調整する
どのブロックでも、「設定」タブを開き、「上部パディング」と「下部パディング」オプションの近くにあるアイコンをクリックして、モバイル・デバイス用のパディングを指定します。
レスポンシブ・デザインの調整Zero Block

ブロックの設定タブにあるオプションでZero Block に変換することで、様々なデバイスに対応するようにブロックを調整することができます。このオプションはほとんどのブロックで利用可能です 現在/瞬間(уточняется, что это сейчас пока что в доступе или что уже есть???)

ブロックを変換したら、幅の範囲に応じて5つのスクリーンタイプでどのように見えるかを手動で調整できます。Zero Block 、レスポンシブ・デザインを調整する方法については、以下をお読みください。 "Zero Block :カスタムブロックの作成方法"および "Zero Block :レスポンシブデザイン"の記事を参照してください。
ウェブサイト・アダプティブモードをオフにする
アダプティブモードをオフにすると、モバイルでもデスクトップと同じようにページが表示されます。これを行うには、ページ設定→追加で「モバイル表示を無効にする」チェックボックスを選択し、ページを再公開する必要があります。
左側がモバイルデバイスに適応したウェブサイト版、右側がアダプティブモードをオフにしたウェブサイトである。
製造元
Tilda