そのまま使えるとは限らない
- 作者: オフィスヒマワリ
- 出版社/メーカー: インプレス
- 発売日: 2004/09
- メディア: 単行本
- この商品を含むブログ (13件) を見る
- 画像を使用するテーマでは、１〜８個の画像をあらかじめサーバーにアップしておかなければならない。
- サイドバーなどに表示するコンテンツ（モジュール）の全てに対応していないテーマが多く、デザインが崩れる場合がある。
特に最初の部分が困るところで、この本を買おうという人が皆サーバーに関する知識を持っているかというとかなり疑問なわけで、いきなりそんなことを前提にするのはどうかと思う。とりあえず、自分の場合ははてなの過去日記を利用するという手を使ったけど、使用する画像が多いとそれなりに手間もかかるのでお手軽とはいかない。
二つめの点に関しては、写真つきカレンダーや月別アーカイブ（いわゆる「calendarモジュール」）を使おうとすると色々不具合が出ることがあった。まあ、「詳細デザイン設定→テーマ選択」で『Hatena』を指定する*1テーマがあり、それを設定し忘れているという場合もあるのだが。コンテンツに凝らずにあくまで日記のツールとしてブログを使うという人だとそれほど困らないかも。
本の概要としては以下の通り。
- 「Movable Type」、「はてなダイアリー」、「ココログ＆ブログ人」それぞれに対応した９７種のテーマ用のヘッダ、フッタ、スタイルシートのテキスト、各テーマに使う画像、注意書きが収められたCD−ROMが１枚。
- 全テーマの見本がカラーで。ココログ＆ブログ人は白黒だけど、テーマ自体は他のとまったく同じなので問題はない。
- 各ブログへのテーマの導入ガイダンス。サーバーへのアップについても触れられているが、あくまで簡単に。
- CSS（スタイルシート）の簡単な説明。
自分のようにHTMLやCSSの知識のない人間には意外に最後の項が勉強にはなった。まあ、「marginとかpaddingとは余白のことだったのか」というレベルだからこその感想であって、本格的に学ぶのであれば専門の参考書を見るべきだろうけど。
というわけでこれに載っていた「Design 060」*2のテーマを入れてみた。
……のだが、
- 基本的なフォントの大きさが小さくて（x-small）見難かったので、font-sizeをnormalに変更。
- 行間がつまっていてこれも読みにくい原因なので、line-heightを200％にする指定を書き加える。
- サイドバーの項目の行間はつまっていた方がいいので、div.sidebarのline-heightを110％に。
- 本文の文字の色が薄い（#666666）ので、「black」に。
以上の変更を施した。正確には以下の通り（変更点のみ）。
body {
color : black;
font-size : normal;
line-height : 200%;
}
div.sidebar {
line-height: 110%;
}
他に、「はてなの本」や「HTMLハンドブック」も参考にした。はてなダイアリーの構造を知るには『はてなダイアリーガイド「CSSセレクタ」』もかなり役に立った。
確かにちょっと覚えればいい部分はあるし、ページ全体が一つの指定で劇的に変わるのでCSSって面白いけど、先は長いかな。
（追記：後日、以下の変更を追加。）
body {
font-size : 1em;
line:height : 120%;
}
div.main {
line-height: 110%;
margin-left: 15%;
}
div.hatena-body {
width: 800px;
}
div.sidebar {
width:135px;
margin: 10px;
}
