W様の単発案件、無事納品できました。
一日で終わらせるはずでしたが、一日半かかってしまいました。
これは反省しなければいけない。
＜Bad Point＞
・パッと見のデザインで「すぐできる」と思い込んだこと
実際には、明確なFont指定があった部分でFontの調査に1時間半ほど費やしてしまった。
・CSSをやり直してしまった
class名を見るだけで、どの部分のことか分かるようにしていたが、共通部分を複数のページで使用するケースに、class名が破綻してしまった。そこで、共通部分を見直し、汎用性のあるclass名に修正した。
CSS設計って大事ですね。。
＜Good Point＞
・Webフォントについて再認識することができた。
Notoフォントはダウンロードして、それをサーバーにアップロードできることを知った。とはいえ、遅延は半端ない。キャッシュ対応は当然のこととして、Googleフォントを読み込むのとどちらが早いか、今度テストしてみようと思う。
・CSSの疑似クラス「placeholder-shown」と「placeholder」、「:-ms-input-placeholder」と「::-ms-input-placeholder」を知る
これで、focus/blurのプレイスホルダーの処理をJavaScriptを使わずにCSSだけで対応できる
・おなじみGulpの利用
作業効率アップするには、Gulpのようなツールはもはや必須です。まだSassとか使ったことがなければ是非おすすめしたい。対象バージョン用の記述を気にしない、同じような記述はグループ化できる、計算式が使えるので電卓はいらない。
ぱっと思いつくだけで、こんなにもメリットがあります。
Yes！コーダーズ・ハイ！