JeffreyFrancesco.org

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

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

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

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

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

Continue reading

前回書いた通り、zenback を入れてると Lightbox 2 が permalink で動作しなかった訳ですよ。

で、理由はおそらく Lightbox 2 に必要な prototype.js と、zenback が読み込む jQuery の衝突だろう…という結論。

色々調べて prototype.js と jQuery の衝突を回避する方法があるのは分かりましたが、zenback のスクリプトは提供元の方でコーディングされてますので、コチラが手を加えるのは不可能。あるのかもしれませんが、おそらく私の手には負えません。涙

という訳で、Lightbox 2 の利用は諦め、同様の機能を持つ代替スクリプトを探す事に。もしかして同じ jQuery を利用する jQuery lightBox plugin であれば動作するかも? という甘い期待の元、ダウンロードして試してみる事に。

でも、これも調べてみるとどうやら一筋縄では行かなくて、今度はサイトの方で読み込む jQuery と、zenback が読み込む jQuery が衝突するらしい。回避する方法としては「zenback が読む jQuery より後に自前の jQuery を読み込ませる」らしいのですが、そのようにやってもやっぱり動作しない。うむー困った。汗

しかし、試行錯誤の結果、何とか動作させる事に成功いたしましたので、ココにご報告いたします。ついでに、jQuery + lightBox plugin ではグループセットを作ることが難しい（スクリプトに手を加える必要がある）という情報が多かったのですが、その辺りを回避というか、場合によっては工夫すれば、スクリプト自体に手を加えなくてもグループセット（もどき）は作れるよ、という方法がありますので、その辺りの解説も。

つか、そもそもこの組み合わせで他のところは特に手を加えなくても問題なく動いてるのかどうなのか、その辺は全く不明なのですよ…ネットを調べ回ってもその辺の情報が全く出てこないんですよね。だから解決に手間取った訳でもあるのですが。まあ余談はさておき続きをどうぞ。

Continue reading

入れてみたのでテストエントリ。

Movable Type でおなじみのシックスアパート社さんが、zenback という新サービスを開始されております。どのようなものかというのは、以下 http://zenback.jp/ より引用。

zenbackは、ブログ記事のテンプレートにスクリプトコードを埋め込むことで利用できます。ブログの記事の下や横に、

• その記事に関係する自分のブログ記事
• その記事に関係する他のzenbackユーザーのブログ記事
• その記事についての最新のTwitterのつぶやき
• その記事についてのはてなブックマーク
• その記事の最新のアクセス元（リファラ）

を表示します。

発表とほぼ同時にベータテストの申し込みをしていたのですが、この度利用準備が整ったという事で、早速導入してみました。

サービスが利用できるブログの条件も、基本的には以下の二つだけ。

1. 個別記事表示用テンプレートの HTML をカスタマイズできて
2. テンプレートに JavaScript のコードを貼ることができる

まあウチは blosxom などという（今や誰も選択肢として考えないような…汗）ブログツールを使っておりますが、かなり自由度は高いツールなので当然上の二つはクリアできてるし大丈夫。若干工夫が必要ですけど、その辺りも含めて簡単に設置方法の説明を。

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. 広告(ぉ

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

サイトの作成および運営方針を少し見直してみることにしました。

Weblog の permalink URI フォーマットを変更

今まで permalink は http://jeffreyfrancesco.org/weblog/yyyymmddhhmm という「年月日+エントリ作成時間」な ID になるようファイル名を調整してたのですが、これだと作成時間が決まるまでファイル名を決められないとか、meta-creation_date タグで指定したタイムスタンプとファイル名を合わせないとなんか微妙に気持ち悪いだとか(笑) そういう部分の調整が次第に面倒くさくなりまして。

そこで、今後（というより、このエントリから）は「年月日+01から始まる連番」な ID による permalink に変更いたしました。同じ日付で複数エントリをする場合は一つずつ連番が増えていくと…私は一日に何度もエントリ書く事がまずないので、最後の連番すら不要な気がしないでもないですが。でも深夜寝る前と起きた後の夕方とか、つい日付が変わったつもりで書こうとして気が付いたら2つめだった…てことがないとも限らないので、念のため。

Information のライヴ情報更新を月単位から各ライヴ単位に

今までの「○月のライヴ情報」の形式は、更新タイミングが悩みの種でして。あまり早すぎると追加があるたびに更新が必要になるし、かといって遅すぎると告知としては期間が不十分になる場合も。それにこの形式だと、月初に必ず更新しないといけない…というプレッシャーもあり(笑)

という訳で、既に今回の Music Cafe のライヴ情報より変更してますが、ライヴ・イベントの詳細が決定次第、情報をアップするようにしていきます。permalink に関しても「ライヴ開催年月日」をベースとしたものに変更します。

同じく Information 「オンガクノタネ」更新情報のアップを終了

これはもう単純に面倒くさいだけ(笑) 収録時に何か面白い出来事が起こったような時には Weblog の方にネタをアップするかもしれませんが、基本こういった単純な更新情報は Twitter アカウントで流す方向に集約していきますので、お好みでフォローいただければと思います。

こんなところです。あ、もちろん今までにアップしたエントリの permalink には一切変更は加えてませんので、旧エントリにもお気軽にリンク貼って下さいまし。

てか、これでまた更新止まったら次は言い訳できんよね…(汗)

というより最近もう、何か書くといえば Twitter ばっかりです。

ココを定期的に見てる方が何人いるか分かりませんが（まあ0に近いでしょう…）万一そういう方がいらっしゃいましたら、ワタクシのアカウントをフォローしていただくとがよろしいかもしれません。いえ別に大していい事がある訳ではありません、でもとりあえず生きている事だけは分かると思います(笑) という訳で晒す。

http://twitter.com/JForg

こちらも更新を復活させたい気持ちはありますが、正直 Twitter の手軽さに慣れてしまうと面倒くさい(笑) ある程度楽出来るようにしてるとはいえマークアップも必要だし…とは言いつつも、あんまりその辺考えずに書けるはずである mixi 日記すら更新してないので、単にやる気ないかネタ切れだろと言われてしまえば、返す言葉がありません。すまん謝る。

とはいえ、マークアップだとかアプリ立ち上げが面倒なのがやる気を削ぐというのは確かにあると思うのですよ…ほんと、一からサイトを WordPress などで構築し直したい衝動に駆られますが、そうなるとまた Markdown 記法で文章を書く方法も考え直さんといかんしなあ。ていうかその前に構築し直す時間があるなら何か書けよっていう話になりますね。すまん謝る。

謝ってばかりの久々エントリ。