レスポンシブサイトをワンソースでコーディングする際、たとえばグローバルナビを「PC用画像 → スマホ用画像」「PCは画像 → スマホはテキスト」などの場合、どのように変換してますか?
背景画像にすると、印刷で出ない(設定で治るが)ので背景処理以外で検討したい所ですが、そのあたりの意見も踏まえて教えてください。
Media Queriesで画面ごとのCSS作るときにPCなら●●●ってクラスはdisplay: none;でスマホの場合はblockで(あるいは逆で)って切り替えて、中要素を個別に用意しとくくらいしか思いつかないな。背景画像アリなら簡単でいいのに。
やっぱそうですよね~。個別に用意して、displayで切り替える。これってスパム扱いはされないんですよね?あと、僕の場合、要素の位置がスマホとPCで変わる場合も、個別に用意してます。
javascriptで切り替えるとか?display:none;が一番簡単そうだけど重くなるだけで、ワンソースでやる意味がなくなりそう
そう!重たくなるってのが、一番の懸念点です。では通常みなさんは、背景処理してるってことですよねぇ?
みんなの回答 2 件
Media Queriesで画面ごとのCSS作るときにPCなら●●●ってクラスはdisplay: none;でスマホの場合はblockで(あるいは逆で)って切り替えて、中要素を個別に用意しとくくらいしか思いつかないな。
背景画像アリなら簡単でいいのに。
javascriptで切り替えるとか?display:none;が一番簡単そうだけど重くなるだけで、ワンソースでやる意味がなくなりそう
関連するトピックス