ブログ|静的志向

言語言語切替
日本語 English
サイト内検索

札幌在住のTakaによる静的htmlで作成したブログです。

素早く表示されるブログを作ることを目的として書いています。

cssの大改修をやっているんだけど終わる気配がない

雪ミク

サイトのレイアウトも決まり、じゃぁ次は...の前に、現状無駄な記述が多いcssをすっきりさせようと頑張り中~なんですけど、これが終わり気配無し。

ボクがやりたかったことは、静的html1枚でスマホ・タブレット・パソコンに対応し、タブレットについては縦画面でも横画面でも見やすいこと。現在の進行状況でレイアウトは決まり、じゃぁ次はどんどんコンテンツを作ろう!...となる前にcssの整理整頓が必要になっています。

重複が多くてぐっちゃぐっちゃ

1枚のcssで作ると@media only screen and が多くなって見づらいです。ボクはこれを解決するために共通・スマホ・タブレット・パソコンと4枚のcssで分けています。しかし4枚に分けたことの弊害として、同じ内容が各スタイルシートで記載されいる箇所があるのです。

スマホ・タブレット・パソコンで同じ内容なら共通のcssに1回書けば済みます。hタグのデザインなどを共通のcssでまとめておけば、もしデザインの変更があったときにも1箇所の中身を変更するだけでスマホ・タブレット・パソコンのすべてに反映してくれます。この方がメンテナンスもしやすい!

ということで現在デュアルモニターを4分割して各cssの中を整理整頓しています。しかし今までやってきたことが雑過ぎて、中々進みません。とりあえずヘッダーまでは終わらせましたが...この先メイン・サイドバー・フッターが残っています。まぁフッターはそんなに時間かかんないと思うけど。

あとcssのメンテナンス性も上げたいですね。自分なりに見やすくして、何がどこに書いてあるのかわかりやすくして。ここもまだっまだ改良の余地がありまくりです。

現在導入したのはコメントタグをインデントして、htmlと同じような構造が見えるようにcssも書いています。あくまでもインデントするのはコメントタグであり、cssを実際に記述しているところではありません。

↓鋭意制作中↓

ダイエットエラミカ

私自身の実践と経験に基づくリバウンドしないダイエットについて詳しく解説しています。

筋肉量31.4kg

BMI21.9 筋肉型スリム

元の用紙はこちら

↑このように私自身の体組成結果をすべて公開しています。現時点で2年以上のデータ、体脂肪率1桁の結果は21ヶ月連続で達成中です。

詳しくは「ダイエットエラミカ」よりご覧ください。

Sponsor Link

シェアしてくれると嬉しいです