ブログテンプレート「天の川」のsideとentryの背景を修正しました。

文字が見えにくく即修正が必要だと思ったので。

同時に白（不透明度80%）と黒（不透明度50%）とで迷っていました。どちらもアップロードしましたけど(-.-;)

※デフォルトはentry01とside01です。ちなみにentry02とside02に変えた場合、文字色は明るい色に変える必要があります。

ブログテンプレート「お月見」が完成！

ヘッダー背景はスクロールされません。2次元のお月様を半ば無理やり見せるかたちになっています。

背景をスクロールさせるには下記をご参照下さい。

デフォルトのCSSソースにはこう記されていますので、background内にある'fixed'を削除すれば、ヘッダー背景もスクロールされます。

（参考までに）

デザイン→オリジナルデザイン→スタイルシートの入力欄内→#wrapper内のbackgroundに'fixed'が記されています。

ちなみに・・

background-attachment: fixed;は、背景を固定する、という意味です。これは単体でのソースになります。backgroundのプロパティで一括指定した方が早いので、今は/*～*/で括って打ち消しています。

background内の'fixed'を消し背景がスクロールされる様になったけど、もう一度「固定にしたい」という方は、background内に'fixed'を入れるか、/*と*/を消すか、により背景が固定になります。

どうにも色味の相性が良くないので、ブログテンプレート「お月見」は仕切りなおし（配色設定が）が必要です。

特にメインカラムとナビゲーションの部分が、全く一致しません。明るい色と明るい色じゃ相反しあって見えないのは必至。今度は暗い色にしてみます。ま、一度それぞれの背景の不透明度を落としてみるのも悪くありません。

タイトルが「お月見」なので2次元ですが月を見てください！ってことで、背景を固定にする予定でしたが、ナビゲーション（side）に<div>をもう一つ入れないと角丸が見えないという問題があります。角丸のボックスを採用しているテンプレートを見たんですが、ほぼJPEGで作られていました。こちらは透明度を出したいのでPNGで作っています。どちらも画像を入れる<div>の階層は同じですが、もう一つ足りないっていうのが最大の問題です。

ヘッダーとフッターは特に言う事はありません。

ヘッダーは画像だし、背景も画像の闇夜に合わせて設定しています。フッターはぶっちゃけボーダーだけだし。

解決策は、

1. プラグインにもう一つ入れるように頼んでみる。文字は入れきれないけど、CSSに以下の設定を施せます。

.clearFix:after{
 content: "."; /* コメント文はドット */
 display: block; /* 画面表示はブロック化 */
 height: 0; /* 高さ0px */
 clear: both; /* 回り込み両方に解除 */
 visibility: hidden; /* 画面表示は隠す */
}
.clearFix{
 min-height: 1px; /* 最低でも高さは1px */
}

2. 角丸に見えるけど実際は角の部分に背景と同じ色を見せている方法。長方形の背景の上に一部角丸のオブジェクトを乗せているといった具合。

3. 面倒だから角丸は無しにして長方形で制作。

ブログテンプレート「SEA GAL」をサーバへアップロード済み。

まあ別に良いかな、と。Webデザイン的には面白い配置だと思ったのでアップロード！但し、アップロードしても't80'のフォルダの画像を使ったテンプレートが制作されない限り、管理画面でこのテンプレートのサムネイルは表示されません。

't80'のテンプレ作成お早めに・・

てか、一応フォルダ名とCSSソース変えれば、シーガルのサムネイルも見れるようになるんだよな(-.-)前のものが制作されてないと、次のものはサムネイルが見れないっていう事になっています。

【シーガルの由来】

エースコンバットの部隊名で「シーガル隊」ってのがあったので、掛け合わせて使ってます。そのまま読んだらシーギャル・・・まあ、それでもいいけどね。でもシーガルの本当のスペルと意味は知らない。

SEAGALのテンプレート名を「ビーチ」に変更しました。
[2011.10.19.WED 08:34]

続きを読む...

最近は開始ログを残さなくなってます・・。

ブログテンプレート「sea_gal」完成・・・したけど、他の方に見せると「ちょっとなあ・・」的なことを述べてたので、サーバにはまだアップロードしてません。モバイル（携帯）の方はOKだと思うけど。

▼header部分

▼footer部分

ちょっと変わってるけどブログテンプレート「天の川」の応用です。

header画像を固定にして、footer背景はスクロールできるように設定しました。

ブログテンプレート「天の川」が完成！・・また開始ログ残すの忘れた(゜Д゜;)



3カラムです。季節ブログ初。タウンネットブログのテンプレートとしては2つ目です。「夕暮れコテージ」が先ですね。

ちなみに夕暮れコテージのソースをパクったら、個別ページとアーカイブページの右カラム部分が欠けてました(゜Д゜;)あり？・・・まあ直しときましたけど。

ブログテンプレート「梅雨のアジサイ」が完成！

こいのぼりの背景パクリました。背景はスクロールさせない設定にしています。

background-attachment:fixed;

私の設定だとだいたい一括設定になっているので、'fixed'を'scroll'に変える。又は'fixed'を削除すれば背景がスクロールできるようになります。

・・てかその前に開始のログを残すの忘れえてました(ﾟдﾟ;)

このテンプレートからヘッダー画像の画質がちょっとだけ良くなってるような気がする。EPSにしてIllustratorで作業という工程を止め、Photoshopだけで制作しました。ついでに画像解像度を変えることはせず、全部Web用に保存。Web用に保存をすることで自動的に72ppiになると今日、教わりました。なのでこのヘッダー画像は、実際には3～4倍ぐらいのサイズです。

これからPhotoshopでの作業が増えると思いますが、機能が豊富なのでやりがいがあります。

ブログテンプレート「こいのぼり」が完成！

背景を空の色に統一しけど何か変かな？

変に寒色だらけなのでちょっとグラデーションでも作ってみる。

・・・

出来ました。

これでアップロード完了です。

やっぱグラにして正解。

ブログテンプレート「こいのぼり」のWebデザイン開始！

もう開始しちゃってるけどね。配色とイメージは組み込み済み。あとはmarginとpaddingの調整だけです。

ブログテンプレート「雛祭り」の背景変更しました！こちらはモバイル版です。

携帯の文字はミニマムにしているので、背景の色が濃すぎると、かえって読みにくかったので不透明度50%の白を上から被せました。新たにデザインを作る必要はありません。Photoshopで上にレイヤーを作って被せています。

これやるのと、やらないとでは断然違います。

前回 /design/t73/hina_back01.jpg

現在 /design/t73/hina_back01_m.jpg

追記（2011.09.09）：

上の画像ではモバイルだと見えにくいので、少し修正して縁取った背景を作りました。

記事で公開するためだけに作られています。まあ、作業の手間はかからないのですぐ出来上がりました。