【IE対応編】WEBのコーディングでググって調べた基礎の基礎のまとめ
WEBのコーディングでググって調べたことシリーズも今回で最後です。
- 「【IllustratorでのWEBデザイン編】WEBのコーディングでググって調べた基礎の基礎のまとめ」
- 「【RWD、CSS3編】WEBのコーディングでググって調べた基礎の基礎のまとめ」
- 「【jQuery編】WEBのコーディングでググって調べた基礎の基礎のまとめ」
ときて、いよいよ今回の案件で1番苦労したIE対応です。
今までIEの旧バージョンを気にすることが無かった
完全に問題発言ですねw というのも「IE対応をしていて改めてグラフィックデザインとWEBデザインの違いを実感」の記事でも書きましたが、コーディングの実績としてはまだまだ数が少なく、WEBスクールで作った課題や卒業制作は、自分の好きなサイトを作ったため、モダンブラウザで動けばいいや！と割り切ってしまったためです。ですから、その時点ではIEの旧バージョンを使っている人なんて、完全に無視していたわけです。
そんなノリで今回の案件も最初はIEのことは気にせず、ガンガンCSS3を使っていたら、「IE8で見えてないよ！」ということになり（正確にはIE9すらアウトだったのですが）、グラデーションの上に白抜きの文字のデザインだったので、本当に消えたように見えず、「やった！出来た！」と思って、IE8で見たときは死ぬかと思いました（実際にそのあと死ぬ程ググることになるわけですが…）。
では、早速、IE対応関連でググったことをまとめていきます。
IE対応の基本
やはり、今回の最大のIEへの敗因は、そもそものIE対応の基本知識が皆無だったためだと思います。ですから、IE対応を網羅した基礎知識があって、HTMLを本当に正確に記述出来ていれば、こんなに苦労はしなかったはずです。ですから、この辺りはしっかり身に付けたいです。
CSS3 PIEとSelectivizr.jsの使い方
CSS3を多用してコーディングしてしまったので、それらをどうにかして表示してもらわなければいけません。そのために「CSS3 PIE」については、かなり色々と調べました。そして、CSS3のセレクタがIEの旧バージョンでも使えるようになる「Selectivizr.js」も入れてみたのですが、こちらを入れた途端に「CSS3 PIE」で表示で来ていたのものが出来なくなるという悲劇がおきたので、結局「Selectivizr.js」の方は使わずにセレクターの選択はjQueryを使用して行いました。
とにかく色々大変だったCSS3のIE対応のググったことまとめです。
アストン研究室（あすとんらぼ）: CSS3 PIE（PIE.htc）の使い方と注意点まとめ
レスポンシブのIE対応
こちらは記述すべきものをググった通りに書いて、さらにこれも記述した方が良い、というようなものも全て記述したので、すんなり出来ました。たまには1発で出来てもらわないと困りますよね。
その他
他にもググって今後も調べそうなことを、ここにまとめています。特に「このタグの中ってなんのタグがかけるんだっけ」は本当にそのタイトル通りの疑問が浮かぶことが良くあるので、まずは改めてしっかり頭に叩き込みます。
まとめ
新しい技術をググって調べて学習することは本当に重要ですが、基礎的なことをググっているとコーディングは本当に進みません。ググる力も必要ですが、基礎力UPを頑張っていきます！
