JeffreyFrancesco.org

しました、ハイ。見れば分かりますかそうですか。

背景画像とかやっぱりなんか合わんというか、ごちゃっとし過ぎな感がしたので、さくっと削除。ついでにサイトのロゴもさくっと削除。作り直そうとも思ったけれど面倒くさいのでテキスト。なんでフォントが Palatino なのかは問わないように。

3カラムレイアウトも止めました…で、3カラムっぽく見える1カラムというか、左右の余白を多めに取った1カラムの余白にエントリ情報や広告を配置する、みたいな感じにしてます。エントリ情報部分を左にピタッとくっつけたかったのでセンタリングもやめっと。

配色も今までのはほぼ完全にモノトーンの濃淡でしたけど、やっぱりこれじゃあリンクなどが分かり辛いよなあ…という反省の元、白地に暖色系のグレーというか、微妙にブラウン・ベージュ寄りのカラーを基調にしてみた…つもり（色を言葉で表現するのは難しいものだ）アクセントにダークレッド、リンク色も一般的な青色（通常よりはダーク目ですが）に変更。あと ins にだけやや薄めの黄色を使ってみた…インラインレベルの時は文字背景色に、ブロックレベルの時はブロックの周りのボーダーに。紙の書類で蛍光ペンでラインを引いたり周りを囲ったりしますよね…そんなイメージです。笑

という訳で全体的に余白部分も大きく広げましたので、レイアウト・配色と合わせて以前より読みやすくなったんではないかなあと思います。やっぱり私はこれくらい、すっきりシンプル目な方が好みなのだなあ、とか再確認。

Continue reading

CSS てのは弄り始めたらなかなか止まらないもので(汗)先日から立て続けに色々なところを細々と変更しておるのでございます。

いちおう前例に倣って(?)先日までからの変更点を箇条書き。

• さりげなく背景右側に Organ の画像を置いてみた。ウチにある XK-3 を撮影して加工したもの。
• 背景画像が見えつつテキストが読みづらくならぬ程度に opacity プロパティ使ってサイドバーをほんの少し透過。
• Firefox でもメニューのタブが角丸になるように -moz-border-radius プロパティを入れた。
• ページの一番上に戻るリンクの場所とデザインを調整。
• 他いろんなところの margin, padding を微調整。

そんなところ…だと思います(笑)細かくメモ取ってなかったから、ところどころ忘れてる気がしますが。

ご覧になって分かる通り opacity とか border-radius とか CSS3 的なプロパティを使っておりますので、Windows の IE では意図した通りに表示されませんが、知った事ではなく(笑)とはいっても一応 Parallels Desktop 上の Windows7 + IE8 で確認は取っておりまして、見たところとりあえず閲覧に支障を与えるような崩れ等は発生してなかったし、問題ないでしょうその辺。

でも実は IE8 について、一つどうしても謎なことがあったのでございます。それは…次回に続く。単純に私が IE8 の設定の変なところを弄ってしまってた事による勘違いでした…よって次回に続くはありません。汗

勢いで立て続けに変更。まあ半分くらいは既に出来上がってたものを本 CSS に書き足すだけなので簡単でしたが。

ちう訳で、以下箇条書き。

• Header と Footer にバックグラウンド画像（パターン）を敷いた。
• Header 下の Navigation をタブっぽくしてみた。-webkit-border-radius とか初めて使った。
• あとはその部分の color 調整を細々と。

ていうか明日は27日の発表会のリハで大阪行きなので、早く寝なくては…

暇を持て余していたので色々変えた。以下、箇条書き。

• ふと思い立って Google AdSence を縦長バナー（160×600のもの）にしてみた。
• そのままではサイドバーがものすごく長くなってしまうので、レイアウトを3段組に変えた。
• エントリ ID がページによって全然違うものを吐いてたので(汗)プラグインの該当部分を修正した。
• 自分の Twitter アカウントへのリンクを付けた。アイコンは貰ってきたやつだが、どこからか忘れた…
• サイドバーのラベル部分のフレーズをちょっと考えて書き直した。
• フォントサイズを一回り大きくした。

以上。それだけ…

…いたしましたので、エントリ更新も6月5日のイベントの練習もそっちのけ（ダメやんか…）で色々な作業を地道に細々とやっております。主に CSS を見直したり画像を加工したり、あと画像を加工したり画像を加工したり画像を(ry

まあ、おかげで Photoshop の機能をかなり覚えましたが、夜に画像加工をし始めたはいいが集中しすぎて、気がつけば外が明るくなってた…という日々が続いたせいで、生活のリズムがかなり狂ってます。そこは何とかしないといけませんな。

ローカルでの作業はまだまだ続いておりますが、とりあえず現状から手っ取り早く変更できる部分だけは変更しておこうってコトで、固定幅レイアウトの廃止（今までは横幅800px固定）とグローバルナヴィゲーション下にあったバナーっぽい画像を削除しましたです。body の class 名を変更するだけなので作業時間3分も掛かってないですが。こういうところは vicuna 様々(w

ここから先の作業（大胆にデザインを変更するなど）は普通にイチからデザインしていくのとそう大差ないかな? などと感じておりますが、それでも元々のテンプレの文書構造がきちんと組んであるおかげで、大半の変更は CSS の書き換えだけで済むような感じです。まあ下にある項目を上に持っていくとかは明らかに文書構造自体の変更だから、テンプレ書き換えた方が良いし早いのでそうしますけど。

一応今後の予定表。別に興味はないでしょうが書きたいんで書く。文句がある場合は6月5日に直接高浜の会場でのみ受け付けます(w

1. シングルカラムっぽいデザイン（最近よくあるメインコンテンツ下にアーカイヴのナヴィゲーションとかが何列かで並んでるやつ）
2. ヘッダとフッタに背景画像（これもよくあるグラデーションがかかっててウィンドウ幅いっぱいに広がってるやつ）
3. メインコンテンツ部分にも背景画像（あんまり自己主張しないやつを background-attachment: fixed; で）
4. メニュー部分の項目の見直し（一部項目の位置変更と、項目自体の追加や見直し）
5. 広告(ぉ

以上の辺りボチボチと変更していきますです、はい。あ…いや、練習もちゃんとします…よ?