スマホ用画面のサンプル作成中。やり方を少し変更しました。

こんにちは。慶です。


スマホ用の画面がなんとなくできてきました。







スマホの場合サイドバーは邪魔なので消すようにしました。


サイドバーの必要情報はフッターに入れようかなと思います。


当初はBootstrapを利用してレスポンシブデザイン化するやり方一本で進めようとしましたが、


やはりこれ一本だとどうしてもデバイスによって今ひとつな感じになってしまったので


スマホとPCでデザインを振り分けるやり方を取り入れました。


※スマホの場合はサイドバーがあると邪魔でバランス悪い。







PCとスマホで振り分けるやり方として、


htmlに条件分岐を入れるかプラグインで振り分けるかで検討しましたが、


今後の保守性を考慮して編集対象のファイル数をできるだけ減らしたい、


できるだけメンテナンス時に意図せぬ影響が出ないよう独立させたいので後者を選択。


Multideviceswitcherというプラグインを利用することにしました。


単に自分が慣れていないだけなんですがなかなか骨が折れてます。


とりあえずオンスケジュールでまず仕上げることを第一目標に作成していきます。




読者登録はこちら


本ブログを一読されてご興味のわいた方は読者登録いただけると幸いです！
↓↓↓ぽちっと押下↓↓↓