最近サイトを作っても、スマホやタブレットに対応させないと話にならないよね。

ワードプレスで既存のテーマを選べば、そこまで設定してくれているからあんま考えなくていいけど、プログラミングマスターを目指すプログラミング小僧としては、どんなやり方があるのか把握だけはしておきたい。

ワードプレスでサイトをスマホ対応・タブレット対応にするには、どうやら3つの方法があるらしい。

①レスポンシブデザイン

その1つはレスポンシブデザインというものだ。

ここ数年めちゃくちゃよく聞くよね。

レスポンシブとは訳すと「反応がいい」とかの意味だけど、プラウザのスクリーンサイズに合わせてレイアウトを調整する手法だ。

使うのはCSSだ。

メリット

CSSで画面サイズに合わせてレイアウトを調整するだけだから、たった1つのHTMLでスマホやタブレットなどをカバーできるからメンテナンスが楽。

スクリーンサイズだけが問題になるから、新しい端末が出ようとHTMLを修正する必要がないのだ。

デメリット

逆にデメリットとしては1つのHTMLをスクリーンサイズに合わせて調整するだけだから、デザインを端末ごとに変更するってのはなかなか難しい。

PCでサイドバーに表示していた部分をスマホなら、下に表示するって感じで調整する感じだからね。

プログラミング小僧的にはこれが一番やりやすそうだ。

スポンサーリンク

②スマホやタブレットに合わせて表示するHTMLを変更

レスポンシブデザインと違い、端末ごとにHTMLを切り替える方法もある。

端末ごとにデザインを決められるけど、その分作業は2倍3倍になる。

そりゃ端末ごとにHTMLを考えて記述しないといけないし、条件分岐で色々分けなきゃいけないしね。

「メンテナンスにどんだけ時間かかるねん!」って感じだ

これはプログラミング小僧としては難易度とめんどくさいという理由で厳しそうだ。

スポンサーリンク

③ワードプレスのテーマを切り替える

スマホやタブレットなど、ユーザーがどの端末を使ってサイトを見ているかによって、ワードプレスのテーマごと切り替える方法もある。

これはワードプレスを使っているからこそ出来る方法だ。

スマホとPCでガラっとデザインを切り替えられるのはなかなか魅力的!

ただその方法はまだ詳しくないから、いずれ覚えてたら追記しようと思う(笑)

 

おすすめの記事