• MENU●●●●
  • PC画面スマホモバイル自動切り替え要素指定方法


    シリウスカスタマイズ アコーディオンブラインドメニューシリウスへ取り付け完了 詳細は外部カスタマイズメニューでご覧ください

    スポンサー広告

    関連記事


    PC画面とスマホモバイルでの外部要素自動表示切り替え指定方法

    シリウスサイトのパソコンでの閲覧表示のスタイルはiPhone機能での設定で
    サイト内に置く画像は ヘッダー画像 およびサイズ指定なしのボックス枠を
    含めて自動調整されます

     

     

    その他のサイズのある置物

     

    スライダー画像やユーチューブ動画などは PCサイトでサイズの指定を
    しており スマホ モバイル画面で表示される際は枠内に収まりきれず
    適合表示しないとなり 閲覧者目線で見てみれば ずれがある
    見ずらい となり それはまたグーグルさんも評価は同じで コンテンツは
    優れていても サイト構成がいまいちならば 良いサイトとして
    みなされないと判断されるようです

     

    対処法は スマホ モバイル画面内で表示される際は適合サイズに
    自動調度されピタッと収まるようサイズを指定すればよいのです

     

    スポンサーリンク

     

     


     

    では 大まかですが解説します

     

    詳細を求める方は 巻末のエントリーメニューより 各要素の
    指定手順をご覧ください

     

    スライダー画像を例にに進めます

     

    パソコン画面で表示されるスライダー画像とスマホモバイル画面で
    表示されるものを順に一つずつ 二つ縦並びにします

     

    二つ並べて 一つはパソコンで表示される記述コードで囲むのです

     

    記述コード
    <pcc>

     

    </pcc>
    スライダーを表示するための画像ファイルは記事カラム内に
    通常置きますがその表示用画像ファイルを囲むということです

     

     

    <pcc>
    ここに要素を置きます
    スライダーなら 画像ファイル
    ユーチューブなら 埋め込みコード
    サイト内で置いていたサイズ指定は変更なしです
    </pcc>

     

     

     

     

    もう一つをスマホモバイル用として指定します

     

    スマホモバイル用記述コード

     

    記述コード
    <ipc>

     

    </ipc>

     

     

    <ipc>
    スマホモバイルでの表示では
    要素のサイズは自動調整されませんので 300PXとか310PXとかに
    サイズ調整してください
    </ipc>

     

     

    アクセス状況によりどちらかが判断され 表示されます

     

    PC用要素で囲めばPC画面でのみ表示され
    スマホ モバイル画面では表示されない

     

    スマホモバイル要素で囲めば
    PC画面では表示されない

     

     

    二つ並べても 表示されない要素はないものとして判断されますから
    隙間は空きません

     

    パソコン用に横サイズを500PXにしてます
    ですが パソコンでのみ認識できるコードでかこんでいるため
    スマホ モバイルからは見えません




    スマホモバイル用ですと300程がベスト
    以下サイズ これは画像です
    PC画面スマホモバイル自動切り替え要素指定方法

     


     

    今回の記述コードはシリウスサイトで外部スクリプトなどに有効に使えます

     

    PC画面スマホモバイル自動切り替え要素指定方法 P-TOP
    SIRIUS iPhone機能 シリウスモバイル対応カスタマイズ P-TOP
    SIRIUS シリウスカスタマイズ

    PC画面スマホモバイル自動切り替え要素指定方法関連解説
    iPhone機能を追加したなら手動作業も必要
    シリウスサイトを設定画面でiPhone機能を追加することは簡単にできますが、それて終わりではありません 手動でいくつものスマホモバイル適合作業を行う必要があるのです
    iPhone用テンプレート初期化
    シリウスで以前よりiPhone用テンプレート同時公開しているサイトで モバイルユーザビリティの警告があるような場合 テンプレートに問題がある可能性があります
    iPhone画面にユーチューブ動画表示サイズを適合する手順
    シリウスサイトをiPhone同時後悔設定にした際 サイト内に置いてあるユーチューブ動画もiPhone画面で調度良い表示サイズに指定しましないと半分程度の範囲でしか認識できません
    iPhoneサイト背景カラーをカスタマイズ
    SIRIUS シリウスiPhoneサイトの背景カラーを意味深なカラーにカスタマイズしてみるとまた違ったイメージを打ち出せるかもしれません?
    iPhone機能 モバイル表示画面を確認する
    シリウスをiPhone同時公開に指定する際 モバイル画面では どのように表示されるかを確認しながら構築してゆくことが出来ます
    スマホとPC画面を分離適合サイズで読み易く表示する方法
    シリウスサイトのスマホサイトとPCサイトでの表示内容をモニタリングサイズに適合した読みやすい構成に分離表示する方法のご案内です
    スマホサイト フォントサイズを簡単カスタマイズする方法
    SIRIUS シリウスのiPhone機能 デフォルトフォントサイズは スマホサイトの構成により 小さすぎて読みずらい場合もありますが 読みやすくカスタマイズ変更するこは簡単にできます

       広告

    .













    お勧め目 抜粋






















































    shop

    特典付き広告..ポチする
    【上位版】次世代型サイト作成システム「SIRIUS」


    シリウスカスタマイズで気を付けること


    サイトにnorton|ノートンの安全評価を付ける


    カスタムに使える情報

    Webデザインで使えるWeb配色ツールまとめサイト