You Look Too Cool

Googleの広告サイズをレスポンシブにする

Googleがモバイル対応していないウェブサイトの検索順位を落とすという件ですが、2015年4月21日から適用されるそうです。いきなり順位が変わるのか、その日から徐々に変わるのか、分かりませんが、対応できる部分は対応しておいたほうがよさそうです。

Googleの広告を貼っている場合の対応方法について考えてみました。
モバイル対応というのは「モバイル端末でも正しく見られるようにする」ということです。画面からはみ出さないようにレイアウトを工夫する必要があります。具体的には表示の幅を小さくします。
しかしデスクトップでも小さいままだと今度はこちらが見にくくなります。
広告サイズもデスクトップでは大きく、モバイルでは小さく表示されるようにしたいです。 (さらに…)

デスクトップとモバイルの両方に自動的に対応する「Bootstrap3」

Bootstrapがバージョン3になりました。
Bootstrap
色々と変更されましたが、目立つのはレイアウト関連でしょうか。
最近はデスクトップ用の表示とモバイル用の表示の両方に対応していることが望ましいですが、Bootstrapを使うと簡単に設定できます。
後述のサンプルのようにDIVを設定すると、デスクトップのように幅が広い場合には2カラム表示、モバイルのように幅が狭い場合には1カラム表示、と自動的に調整されて表示されます。 (さらに…)