このブログ（soraizm）をリニューアル！ とまで言わないけど、
いろいろとブラッシュアップしてみました〜♪
90%以上はHTMLタグやCSSって裏側の変更＆改善なので
表側のデザイン的な見栄えはほぼほぼ変わってません（笑）。
つーのも、今年の2016年1月12日以降は
MicrosoftのIEサポート状況が大きく進展して、
古いブラウザを無視できる時期になったのがキッカケ… かな。
提供元のメーカーが切り捨てたモノを個人が守ってもね〜。
なので、このブログは思い切ってIE 11を対象としました！
他のChrome・Safari・iOS・AndroidもIE 11よりは新しいバージョンで。
IE 10以下を切ったコトで大きく変わったのは…
CSSのFlexboxを使いました。
Flexboxを使うのはかなり悩んだけどね〜。
やりたいレイアウトはFlexboxを使わなくても他のCSSで実現可能なのだ。
ただFlexboxを使った方が簡単で楽に実装できる。
んが、楽になるけどブラウザをIE 11以上と限定してしまう（汗）。
作ってる途中でも心の天秤が揺れる揺れる（笑）。
画像をSVG（SVGZ）に切り替えました。
iPhoneなんかのRetinaディスプレイに対応するため
1つの画像でPC用とスマホ用ってサイズ違いを用意していたのだけれど、
SVGなら1つの画像でどんな解像度もOKって便利な画像形式なので、
がっつり全ての画像をSVGに差し替えました〜♪
ただ、SVGは容量が重いのでSVGの圧縮版なSVGZを使ってます。
この圧縮版がもし無かったらSVGは不採用！ ってぐらいの重さです（汗）。
んで、ついにこのsoraizmも
流行りのレスポンシブに対応しましたよー♪
今まではPC用とスマホ用のHTMLを作って
WordPressのプラグイン「Any Mobile Theme Switcher」で表示を切り替えてたけど、
右も左もレスポンシブが当然のような世の中になってきたし…。
一応は自分もレスポンシブを流行らせたスマホを使ってるので（苦笑）。
ちなみに…
WordPressでスマホを判断する関数「is_mobile」を使ってるんだけど、
この「is_mobile」ってのは「UserAgent」で判定しています。
なので、CSSの切り替えはブレイクポイント（サイズ）でなく、
関数にあわせて「UserAgent」にしました。
と、まぁ、やらなくてもいいブラッシュアップばかりでしたね〜。
むしろ、ユーザー環境をIE 11以上と限定してしまったから
実は「やらない方が良かった」かもな変更です、今回は（苦笑）。
リニューアル後もまだ心の天秤がゆれてる（笑）。
COMMENTs 0