Harukiya Archives

--/--/--

http://sug.blog2.fc2.com/?overture" target="_new

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

2005/11/29

http://sug.blog2.fc2.com/blog-entry-339.html

私がフランチャイズとするパーラーOhkuraに”CR未来少年コナン”が導入され、ムチャはまっているわけだが。

rana

2005/11/27

http://sug.blog2.fc2.com/blog-entry-338.html

師走に突入するでごわす(つかみ)(自己採点では、やや、すべっている)

前々から愚痴ってるように、12月は本業が忙しいので更新が滞ります。11日の日曜出勤も決まったー(泣。できることは今のうちにということで、テンプレ wreathe用のスクリプトを考えました。といっても汎用なので誰にでも使えるようになってます(しかも、なんでもたたむよ、の切り貼りです)。

主題は”長いリスト問題について”(副題は全部見えるより、ちょっと見えるからいいんじゃん)。元アイディアというか関連記事はこちら

> ダウンロードと取り説

追記の表示風な動作をリスト<ul>,<ol>でやろうという試み。MTで似た仕様があったような(自信なし)

FC2blog創世記の頃からやってる人はアーカイブリストも長くなっているだろうし、カテゴリリストも分類は多いけどよく書くのは数カテゴリだけだって人(この場合、管理画面でよく書くカテゴリを上方に集める作業が必要)にオススメです。ただ、リンクリストでやると、非表示にされた人との人間関係にひびが入るかもしれn(以下略

更新履歴


2005/11/27

http://sug.blog2.fc2.com/blog-entry-337.html

ご利用ありがとうございます。メニュー→トラックバック頭出しのリンク切れを修正しました(2005-11-27 1時頃)。お手数ですがあらためてDLするか、以下の該当部分を書き換えてください。

  1.             <h3>Recent Trackbacks</h3>
  2.  
  3.             <ul id="recent_trackbacks">
  4. <!--rtrackback-->
  5.                 <li><a href="<%rtrackback_link>#trackback_no<%rtrackback_no>" title="<%rtrackback_title>"><%rtrackback_blog_name><br /><%rtrackback_etitle></a></li>
  6. <!--/rtrackback-->
  7.             </ul>

文字入れ前のトップ画像をアップしておきます。こちらよりダウンロードしてお使いください。

> sc_wreath_plain.jpg (JPEG, 800x280 16.2Kb)


2005/11/24

http://sug.blog2.fc2.com/blog-entry-336.html

ご利用ありがとうございます。テンプレート wreatheには、いくつかギミックがあります。その設定の仕方の説明をします。

HTML編集欄を開き以下の部分(最初のあたり)を編集してください。

  1.     <link rel="stylesheet" type="text/css" href="<%css_link>" media="all" title="default" />
  2.     <link rel="alternate" type="application/rss+xml" href="<%url>?xml" title="RSS" />
  3.  
  4.     <style type="text/css">
  5.     #recent_comments li[class="comment_by<%author_name>"] span:after,
  6.     #coms li[class="comment_by<%author_name>"] span:after {
  7.     content: "@管理人";
  8.     }
  9.     </style>
  10.  
  11. <!--permanent_area-->
  12.     <title><%sub_title> - <%blog_name></title>
  13.  
  14.     <script type="text/javascript">
  15.     var re = new RegExp(/(<!--category--><%category_name>|<!--/category-->dammy)/ig);
  16.     </script>
  17.     <script type="text/javascript" src="http://blog-imgs-27.fc2.com/s/u/g/sug/wreathe.js"></script>
  18.  
  19. </head>

コメント投稿者名に敬称をつける

Recent Comments一覧とコメント欄それぞれの投稿者名を、お客さんとauthorに分ける仕組です。詳しくはこちら

<%author_name>とコメントに使うHNが異なる場合は、この部分を修正。デフォルトでは、すべての人の名前の後に”さん”が(この設定はCSS欄の中にあります)、<%author_name>には”@管理人”が追加されます。なにもつけない場合はcontent: "";のようにします。

エントリからキーワードを抽出して検索に渡すリンクをつくる

個別記事を開いた時だけ記事の最後にキーワードを書き出すjavascriptです。詳しくはこちら。デフォルトではカテゴリ名がキーになっていますが、好きな言葉に変えられます。例えば書評ブログなら

var re = new RegExp(/(推理|サスペンス|ノンフィクション|コミック)/ig);

のように修正し、記事を書くときに意識してキーを含めるようにします。この機能が必要ない場合は<script type="text/javascript">~</script>までを削除してください。

前者はCSS2、後者はjavascriptの仕組です。すべての人に見えるわけではありませんが、なくてもいいけど、あればちょっと便利ということで。


2005/11/23

http://sug.blog2.fc2.com/blog-entry-335.html

思い返せばテンプレコンのあった6月頃から「テンプラーになるぞ、テンプラーになるぞ」と吹きまくって約半年、ついに、このよき日を迎えましたー ヽ(´ー`)ノ

テンプレ名はwreathe(〈葉・花・小枝などを〉輪に作る,花輪にする; 〈花輪を〉作る。【WREATH の動詞形】の意味)です。クリスマス・リースにかけてますが、テンプレを輪にみたてて、これをベースに葉(CSS)花(グラフィック)小枝(スクリプトの小技)などをアフターフォローしていきたいと思います(来年な)

多謝


2005/11/21

http://sug.blog2.fc2.com/blog-entry-334.html

そういうわけで、CHOU-FLEURさんとこへリンクを取りに行ったら、メイドさんがいたわけだが。

ダメポの中でIEがmin-width(max-width)とmin-height(max-height)に対応してさえいれば…。と呟いておられるので、このページをご紹介。某製作板じゃ有名なのでご存知かも。

expression()プロパティ(IE独自拡張)をつかって擬似的にmin-width(max-width)させようという試み。当然のことながら、IE6(からv5まで)を使い、さらにスクリプトオンで観覧しないと効果はわかりません。

簡単にいうとexpression()ってのはCSSの中でjavascriptのいくつかの関数が使えるという、かなり微妙でアレなMS仕様なのだが、これについてはネタがあるのでいつか書く。今回はSvend Tofte氏のソースコード読んで、なるほどと思った所など。

<html>
<style>
p {
border:1px solid red;
width:expression( 
    document.body.clientWidth > (500/12) * 
    parseInt(document.body.currentStyle.fontSize)?
        "30em":
        "auto" );
}
</style>
<body>
<p>
[alot of text]
</p>

<p>の幅は<body>の幅が、500/12* 現設定のフォントサイズ(の数値)を超えたら30emで固定、それ以下だったらリキッドレイアウトしなさい、という命令になる。条件で分岐するところがスクリプト。

さて、500/12(500割る12)とは何だろう?こういうのを数学では”定数”といい、常に変化しないデータのこと。ならば、500/12≒41.6なので”41.6* 現設定のフォントサイズ”でもいいのではないかと思いますよね?ステップも短くなるし。

この謎はひとつひとつの単位を考えていくと解けます。document.body.clientWidth<body>の内側の長さで単位はpxで返り値は整数、document.body.currentStyle.fontSize(IE独自拡張)は<body>のフォントサイズを、文字列で返すプロパティ。後者にはCSSで特に指定がない場合、IEのデフォルトのフォントサイズが入る。そのデフォルトというのはOSの画面の設定で決まる。(これはIE6がOSとシームレスだからなのだろうけど、IE単体で変更できた方が便利な気も。脱線)で、XVGA(最もシェアの多いスクリーンサイズ)でのOSデフォルトの文字サイズは12ptに設定されている(はず)つまりdocument.body.currentStyle.fontSizeからは”12pt”という値が返る可能性が高い。

やっと出てきたね12。つまり、この12というのは、「ハイシェアなスクリーンサイズ、かつデフォルト設定」という、IE使いの観覧者の最も多いであろうと思われる1文字のサイズなのだ。単位合わせをして12ptは16px相当だから 500/16=31.25 と約31文字(半角なら62文字)の長さを指す定数ということになる。

Svend Tofte氏は読みやすい文字列の長さは30字ほど、それは多く人には500px幅が当てはまると示しているのですね。”41.6* 現設定のフォントサイズ”としたのでは、後にソースを見た人には意味が解りにくい。式を展開しておくことによって、考えを伝わりやすくしたのです。こういう書き方を見習いたいと思いました。


2005/11/20

http://sug.blog2.fc2.com/blog-entry-333.html

通常、淡麗(発砲酒)とか氷結(ウオッカハイ)とか、クラシックラガー(リッチな時)なので、こんなエンゲルアルコール度係数(なんだそれは)の高い酒、呑んだことない。なんか変な酔い方で、早くも1年を振り返ってる感じのダラダラメモ。


2005/11/19

http://sug.blog2.fc2.com/blog-entry-332.html

仕事のお客さんのお通夜に出席。その翌日、知り合いにお子が誕生と、今週はハイコントラストなできごとがあった。そこで生と死について(ライトに)考えてみる。

人はなぜ生きるのか?”については、極たまーに(嫌なことがあった時などに)考えたりするわけだが、今まで「これ」といった解答には至っていない。たぶん似た問いの”何のために生きるのか?”や”人生の目的は?”などに答えられる人なら、あるいは解っているのかもしれない。ま、強いていえばある言葉が思い浮かぶのだが、後味がよくないので割愛しておく。では、”人はどう生きるのか?”について。

これは、ずばり”楽”がキーだと思うんですよね。より楽に生きる。楽しく生きる、楽しんで生きるも同じこと。(やっぱり音楽って偉大な発明だと思うよ。脱線)今ちょっとした苦労をしていたとしても、それは先の楽につながるからやっている。まれに、どうしてもバッドエンドなシナリオばかりを選んでしまう人もいるけど、それは結果であって目的はハッピーエンド(楽しみたい)なわけです。

社会人なら、仕事は大変な苦行だぜぃと言われるでしょうが(と思わない幸せな人もいる。その人はすでに楽しんでいるわけだし)、それでお金を得て飢えずに済んだり(自給自足ならより困難だ)、趣味につぎ込むためと思えば、結局は、楽する・楽しむためってことになりませぬか?同様に、学生は未来で楽に生きられるように勉強しとく、と。

で、なぜ”苦”よりも”楽”の方へと向かうのかというと、それは自分の時間が限られているからでしょう。どう過ごしていても、いつかは死んじゃう。ならば、やっぱり楽した・楽しんだモン勝ちだからね。短絡的?(人間の進化の方向が”死なないように”だったとしたら、動かず、変化せず、自意識を表さず(どれもエネルギーの変換を行わない)の、無生物となるだろう。いや、思いつきで書いている。断らずとも常に思いつき95%だ)

それで、楽キーでどんな良いことがあるかというと、ある作業で楽しようと思えば、そこに工夫や発明が生まれる。また、ある状況を楽しめば、それは強烈に記憶され後に思い出すだけで擬似ハッピーな時が得られる。死んじゃえば記憶もナニも無いだろうと思われるかもしれないが、その辺はDNAというチップに刻み込まれるので心配無用。記憶本体はデータ量が大きすぎるので、キーや条件だけが記録される。しかも常時更新(思いつきとおりこしてデムパ)。そのチップ(まさに集積回路)は次の誰かへと継がれてゆく。第六感とか一目惚れとかはこの説で解明できるのだ。ホントか?

最近ちょっと良いことがあった。ハッピーエンドにはならないだろうけど、今の状況を楽しんでいる。それがトリガになって過去の記憶も甦ってくる。”生”とはログを蓄積し再生する行為なのです。


2005/11/15

http://sug.blog2.fc2.com/blog-entry-331.html

中島みゆきの”あした”を聴いた。

どこかへ遠出するにも、始終渋滞の都心へ行くのにも自分で運転する。昔から他人の運転する乗り物が苦手で、運転免許を得てからタクシーや電車には数えられるほどしか乗っていない。猜疑心が強く、ひとの運転技術が信用できないという、やや神経症の部分もあるかとは思う。ジェットコースターなどなら平気で乗れるし、怖さを感じたこともない。

もう十数年も前になるが、当時つきあっていた彼女は白いカロ2に乗っていた。カローラの末弟で”私をスキーに連れてって”という映画の主人公の愛車がこれと同じ型だった。彼女の選択がマニュアルギアでターボというのがちょっと意外で、でも小柄な彼女にその小さな車はよく似合っていた。最初のうちは僕の車でデートすることがほとんどだったが、いつしか車を出すのは交代にしよう、というルールができていた。若かったので経済的な理由が大きかったように思う。

そうなると、自分の車は自分で運転するのが普通の展開で、カロ2でデートする時は彼女がドライバーになり、僕は必然、苦手な”他人の運転”する車に乗ることになる。うれしいようなそうでないような複雑な心境だった。つきあって一緒にいる時間が長くなると、地の部分というか本質が少しずつわかってくる。彼女は人前ではおとなしくて目立たないタイプに見えたが、その芯はけっこう強く行動派でもあった。

彼女はスピード狂だった。いやこの言い方には語弊がある。けして乱暴や無茶な運転だったわけではない。ただ、普段の彼女にはない思い切りの良さやリズムが感じられた。「ドライブするのが好きなの」と彼女自身も言っていた。少し目が悪くて、運転する時にだけメガネをかけていたのも新鮮な印象だった。その時までそのことを隠し通していたのがほほえましい。「似合うからずっとかけていればいいのに」との意見は却下された。似合うというのが嘘だと思ったのか、ただ嫌いなだけだったのかは今となってはわからない。あるいは好きなドライブをするための崇高な儀式だったのかもしれない。

夏の夜、土砂降りの関越道を他の車の数割増しのスピードですべるように走るカロ2。雨音に消されがちな、低いラジオDJのおしゃべりが流れる車中で、いつしか僕は、人の運転も悪くないと思い始めていた。自分は守られているという感覚に。愛する人にゆだねる命のありように。「このまま死んでも悔いはない」ちょっとおどけた調子で言うと、「そうね」と彼女は小さく呟いた。メガネの奥の目は笑ってはいなかった。


2005/11/13

http://sug.blog2.fc2.com/blog-entry-330.html

あの頃のように…のraraさんがFC2ブログのコメント投稿欄のパスワードについて「FC2ブロガーのみんな、オラに知恵をわけてくれ!」と書かれています。先日の一宿一飯の恩義を返すのはここだ!とナケナシの灰色の脳細胞を活性化させてみたのだけどHTMLでの解にはたどり着けませんでした。

例えばパスワードの欄が埋まってない時に送信が実行されると自動的にpassという文字列が補完されて送信されるJavaScriptなどならば出来そうな気がしますが、できればJavaScriptは用いずに何とかしたいものです。

おっしゃるようにjavascriptなら、このような仕様でもできないことはないですが、諸悪の根源が

コメント投稿欄にはパスワード、という欄があるのだが、パスワードを入力しなくても投稿はできる。

これだとして、パスワードとその他必須項目の入力チェックをするスクリプトを書いてみました。何かのヒントになれば良いのですが。

> ダウンロードと取り説

この手のスクリプトはネットを探せばいくらでもありそうな予感(一応オリジナルです。FC2の変数を織り込み済みなので設置も楽かと)。ローカル情報:深月@FC2さんがナニしてくれるかもですよ。

スクリプトは所望でないようですがダークの子はダーク、僕にはこれしかありません(ちなみにピアノもない)同様な悩みを抱えている方への三角飛び的恩返しでも自己欺瞞にひたれます。使ってみたいという方がいらっしゃいましたら、こちらのページでサポートします。

更新履歴


2005/11/13

http://sug.blog2.fc2.com/blog-entry-329.html

また何もしないで日曜が終ってゆく。秋の日は つるべ落としで もらい水

先日daniel氏にいただいたコメントFC2blogも2年目に入った訳ですが、(中略)3年、5年、10年と続くものであるならば、この?問題は意外と重要になって来ると思いますね。について考えたことなど。


2005/11/10

http://sug.blog2.fc2.com/blog-entry-328.html

santacollectors.com

WEBサーフしていたら、いい雰囲気のサイトにたどり着きました。眺めてるだけでなごむよ。

Link us to your site!とあるので、バナーを貼り個人的に応援します。(一度コレ書いてみたかったんだよね)


緩慢な更新といいつつ飛ばしぎみなのは、うちの業界(ズージャの人みたく逆さに言おうと思ったけど、やおやはやおや)12月に入るとめさ忙しくなるのです。毎年、月後半は休みなし。クリスマス辺りは疲労もピークで、他の事などする余裕もない(その方が幸せとゆう話は個人の事情)そんなわけで、ひとあし早くこういう気分を味わっているのです。


2005/11/10

http://sug.blog2.fc2.com/blog-entry-327.html

「・・・どんなに恐ろしいスクリプトを持っても、・・・たくさんのかわいそうな<span>を操っても、・・・FC2の仕様からは離れては生きられないのよ!」

「ラテェルは滅びぬ。何度でも甦るさ。ラテェルの力こそ、人類の夢だからだ!

> 水平アーカイブリスト

(x)html

  1.     <ul id="archive">
  2.     <!--archive-->
  3.         <li class="<%archive_year>" title="<%archive_year>年 <%archive_month>月 <%archive_count>件"><a href="<%archive_link>"><span><%archive_year>年 </span><%archive_month>月</a></li>
  4.     <!--/archive-->
  5.     </ul>

css

  1. /* IE用 */
  2. #archive li {
  3. display: inline;
  4. padding-right: 1em;
  5. }
  6. /* モダンブラウザ用 */
  7. #archive a > span {
  8. display: none;
  9. }
  10. #archive > li {
  11. width: auto;
  12. float: left;
  13. margin: .2em;
  14. padding-right: 0;
  15. padding-left: .3em;
  16. }
  17. #archive li[title~="12\6708 "] {
  18. clear: both;
  19. float: left;
  20. }
  21. #archive li[title~="12\6708 "]:before,
  22. #archive li[title]:first-child:before {
  23. content: attr(class)"\5e74 \20 | ";
  24. }
  25. #archive li:after {
  26. content: " | ";
  27. }
  28. #archive:after {
  29. content: ".";
  30. font-size: 1px;
  31. height: 1px;
  32. display: block;
  33. clear: both;
  34. visibility: hidden;
  35. }

2005/11/09

http://sug.blog2.fc2.com/blog-entry-326.html

最近こんな感じのタイトルが流行っているらしい(つかみ)。さて、企画も一段落したので、緩慢な更新テンプレ(以下、緩更テン)を仕上げてゆくのである。

FC2のテンプレHTMLにおいてブロック変数の中身には、繰り返し出力が終るまでユーザは干渉できない。例えば常にエントリ表示の1件目と2件目に別々のclassNameをつけたいなーとか、5件目の前に一言CMを入れたいと考えても不可能だし(ダークならできるかも)、そもそも更新すると記事の順位は変わってしまうので不定なのだ。そこでHTMLではムリだけどCSSの隣接セレクタ(CSS2を正しく解釈するブラウザ向けです)を使うとそれに近いことや面白いことができるよって話。

方法はCMのすぐ後!チャンネルはそのまま!

CM:最近の記事、特定のブラウザで観覧している人を置き去りにしている気がするが、騙されたと思って一度使ってみるが良い→Get Firefox

はしょってますが、以下はトップページのイメージのHTMLです。

  1. <body>
  2.  <h1><%blog_name></h1>
  3.  <div id="all"<!--index_area--> class="index"<!--/index_area-->>
  4.   <!--topentry-->
  5.   <div class="entry">
  6.    <h2><%topentry_title></h2>
  7.    <h3><%topentry_year>年<%topentry_month>月<%topentry_day>日</h3>
  8.    <%topentry_body>
  9.    <p class="state">post <%topentry_hour>:<%topentry_minute>:<%topentry_second>
  10.    category <a href="<%topentry_category_link>"><%topentry_category></a>
  11.    comment (<%topentry_comment_num>)</p>
  12.   </div>
  13.   <!--/topentry-->
  14.  </div>
  15. </body>

これで管理画面での表示設定の回数だけ<div class="entry"></div>が繰り返されるのは周知の通り。隣接セレクタを使いdiv.indexの中のdiv.entryを順に足していけば、X番目のエントリだけに適用させるスタイルを指定できるのです。とりあえず5件表示(理論的にはいくつでも可能)なら以下のようなCSSの枠組みを作る

  1. div.index div.entry {
  2. /* すべてのエントリに適用するスタイル(含むIE6以前) */
  3. }
  4. div.index > div.entry + div.entry {
  5. /* 2番目のエントリに適用するスタイル */
  6. }
  7. div.index > div.entry + div.entry + div.entry {
  8. /* 3番目のエントリに適用するスタイル */
  9. }
  10. div.index > div.entry + div.entry + div.entry + div.entry {
  11. /* 4番目のエントリに適用するスタイル */
  12. }
  13. div.index > div.entry + div.entry + div.entry + div.entry + div.entry {
  14. /* 5番目のエントリに適用するスタイル */
  15. }

最初の1件のみbackground-imageで目立たせたり、毎日写真をアップしているようなブログなら、1件目の絵は大きく2・3件目は小さく4・5目はtitle属性だけを書き出すなんてことができる。長文系でページが長くなってしまう場合などに、新着1件は全表示し、残り4件はoverflowを使って擬似的に概要風に見せるスタイルなんかも作れます。また、指定エントリの前後にcontentプロパティで文字や画像を挿入することも可能です。

  1. div.index > div.entry + div.entry + div.entry:before {
  2. content: "次の記事は3件目です。";
  3. }

というわけで、耳呈さんの ポエツ | poets をマネてみました(生まれてきてスミマセン)。エピーゴネンとかカッコいい名前でなくパクリ屋とお呼びください。

関連記事


2005/11/08

http://sug.blog2.fc2.com/blog-entry-325.html

simple_code_haru

細かな調整などしてみましたが、キリがなさそうなので現状で完成とします。こういうのはテンションを保つのが難しいと感じました。一気に全部やる、というのは意外と正解かも。普段なら考えないようなことで試行錯誤したり、かなりネタに走ったこともでき、楽しい時間でした。企画・ソース提供のR'styleさんに多謝です。

日頃から言い続けているように、個人の趣味サイトは「CSSでの見映えは好きにやっていい」と思っています。個人でも規模によりますが。確かに崩れや豆字は読みにくい。でも、興味ある内容ならブラウザや設定を変えCSSを切ってでも読む人は読みます。(ワシだけ?)そういう読者以外も求め想定する時、デザインへのイバラの道が始まるのでしょう。

では、反省点など。すべての敗因は最初に画像作りから始めたこと。横幅固定(でなくてもいいのだけど、固定すれば圧倒的に楽かと)で進めるつもりだったので、ヘッダ画像に#logsと#navsの枠線を適当に描き込んでしまった。テキスト流し込んでみたら、左右のバランス悪すぎ。やっぱり、レイアウト→画像と作成順序を守るか、きちんと計算して描くのが早道です(って修正しなかったので時間はかからなかったけど)。カラーセンスというか、その手の引き出しが全然無いと思い知った。クリスマスで赤と緑は、あまりにもありがち。

CSS部はかなり変です。デフォルトのスタイルを作り、simple_code用に上書きし、スタイル依存の過去ログ用にさらに上書き。シンプルなXHTMLに相反して冗長の極み。例のスクリプトをCSSで消せるのか?への挑戦、Image ReplacementネタはIE6(以前)ではひとつも変わらないし、苦しまぎれにCSS3まで導入したのでoperaも一部不可です。この要素を数えて特定する方法隣接セレクタについては以前にもちょっと触れたけど、今後へ発展しそうです。


2005/11/06

http://sug.blog2.fc2.com/blog-entry-324.html

すっかり忘れてた。これからの季節そういうカスタムをする人が多いでしょうから、少しでも役立つ情報を書けたら良いなと思います。などと丁寧語まで駆使して予告したのに。

なんか、こう、飾りつけしたいな、と思いたったときに手っ取り早いのは絵や写真だけど、いきなりじゃあ、うまく描けないしカメラはないし(だけど僕にはピアノもないし)そんな時、フリーフォントが役にたちますよ、奥さん。

今回使わせていただいたフォントです。このScriptというのは手書体の種類のことね。それ以外にもKR Christmas 2001などのシンボルフォントは、クリップアートそのもの。Help/FAQに詳しいライセンスがあるので読んでから使いませう。

もうひとつは、裏で呟いてたIEBlog : Call to action: The demise of CSS hacks and broken pagesで、IE7のためにCss Hackはやめて条件付コメントにしてね(たぶんそう書いてあるのだと思う。自信なし)とIE作ってる人が言っているので、CSSを徐々に綺麗にしていこうかな、なんて思ったって話。まだ見ぬ恋人のために部屋を掃除するような感覚か(永遠に来ねぇよ)。


2005/11/06

http://sug.blog2.fc2.com/blog-entry-323.html

半日かけてCSSを書いてみました(すごい最近なデジャビュ)。ぼちぼち画像のパーツでも作っとくか、などと始めたら止まらなくなった。小出しにエントリするはずだったのに・・・

CSS で装飾してください。参加作品で、テーマはクリスマスっぽく。テンプレ(なのか?)名はsimple_code_haru 。9割方できたので、実際に使いながら修正していきます。企画のルールと改変箇所は以下の通り。

あなたもR'styleさんのXHTMLに挑戦してみませんか?

css Zen Gardenのように、唯一のHTMLにCSSのワザだけで何ができるか。これは面白いアイディアだし、FC2ブログ(の一部の濃いユーザ)向きだと以前より思っていました。でも、先立つHTMLがなかった。R'styleさんのXHTMLはシンプルですばらしいものです。若干軽量化と述べているように、ムリな要素の入れ子や必要のないclassNameは最初から排除してあります。(うちの約半分のサイズだった(-。-)ボソ)

たとえば、コメントやトラックバック部分のHTMLはシンプルの極致です。それでもCSSを使うさいにそれぞれの要素を特定できるように計算されている。必要なものは全部そろっているのだ。どういう飾りつけをするか?までも先読みされているような気分。

とはいえ、お祭り(だよね?)なので踊らにゃ損々。なりきってやってみるのである。css Zen Garden 風なコード使いとは(この場合のコードとは、エーマイナーとかジーセブンって方ね)

かなり偏見です。画像未使用の作品もあるし、ストロングスタイルなデザインもたくさんあります。前出のリンク先(トップページでないのはわざと)など、一時ブラウザのホームにしていたこともあるほどのマイフェバリットな作品。

全然話が進まないわけだが。僕の中ではcss Zen Garden 風といったらImage Replacementなのだ。いつかやってみたいと思っていたのである。(つづく)(かもしれない。というか本家(ここだが)の仕上げもやってないのに。)


2005/11/03

http://sug.blog2.fc2.com/blog-entry-322.html

daniel氏経由でR'styleさんのCSS で装飾してください。という企画を知りました。

R'style が考えた、若干軽量 XHTML を、チョットした条件の下、CSS だけでステキなテンプレートに仕上げてください。

css Zen Garden 風な、同じXHTMLでどんな見映えを作れるかという、面白い企画です。タグを増やしてはいけない、他の部分でタグを削れば、その同数タグの追加は可など、シバリがあるところが燃えそう。

以前、Project.Rが発足したときに、プロジェクトXHTMLができたら、こっそりCSSを書きます。と宣言(にしちゃ、こっそりだが)しているので、参加させていただきます(自分のところさえ中途半端なのに!)。普段background-imgなど、ほとんど指定しないので(そこまでいかずに疲れてしまう)ここぞとばかり使ってみたい。前にちょっと書いたクリスマス風な飾りつけを目指してみます。これからの季節そういうカスタムをする人が多いでしょうから、少しでも役立つ情報を書けたら良いなと思います。でもまあ、うちのことだから、変な方向へ行くのは必須。


2005/11/03

http://sug.blog2.fc2.com/blog-entry-321.html

半日かけてリニュしました。いつもと同じ?そんなあなたはF5・F5・F5・・・うそです。あまり変わってません、外見は。しかし、中身は別物。いままで散々引きずってきた<h1>に対する想いを遂げることができたのだ(以下、我が闘争の軌跡)

どのページでも表示される記事単体の構造(本文は概要の場合もある)は同じ、常にタイトルは<h1>。興味ある方はソースを見てください。SEOとか意識しているわけではない(ならもっとマトモなタイトルつけるって)けど、CSSで(よーするに有視界戦で)むりやり位置を変えるよりよほど健康的だろう。健全な精神は健全なHTMLに宿る・・・といいのだけれど、それはまた別の話。

ナビゲーションを整理統合したので使いにくくなるかもしれない。その辺は使いながら直していきます。不備やアイディアがあったら教えてください。


2005/11/01

http://sug.blog2.fc2.com/blog-entry-320.html

月も変わったことだし、もちっとテンポアップしないと年内にリニューアルが終らない予感がしてきた。状況の変化や実験したいこともいくつかあるので、テンプレいじりをさあ、始めよう(ナイフ、ランプ、鞄につめこんでー)

現状テンプレにも、目的は一応あります(た。過去形)

非常にあいまいだが、一言でいえば高い柔軟性を求めたということになる。いちおう、前者がHTML後者がCSSに関する目標とした。イメージする時にはごっちゃになっているわけで、両者は多少とも影響しあってる。CSSを書きつつHTMLを修正したり(そんなことではイカンのだろうけど。ま、アマだし)それなりに満足した出来ではあった・・・毎日更新していた頃は(遠い目)。表示スペースを有効に使うことは、裏返せば、”ギチギチに詰まったレイアウト”になってしまう。これは緩慢な更新には向かない。また、HTML文章はナビゲーションから書き始めているが、この順序が適当かどうかもやや疑問である。

例えば、1週間で7件の記事がアップされるブログがあったとして、週末まとめ読み派(自分がそうです)からすると、管理者設定が7件(以上)表示になっていればトップページに訪れるだけで満足いく結果が得られる(RSSリーダーやライブブックマーク使えって話もあるが)週2回更新のブログで10件表示になっていたとすると、トップページの内容がすべて入れ替わるのに1ヶ月ほどかかることになる。これは無駄なトラフィックを発生させるだろうし、構造いかんによっては表示がもたついた印象になる。

ブログの設定を変えてみて、件数が少ないからこそ生きるコンセプトやデザインもあるだろうな、と考えている。だいたい、テンプレ作りはこの時間が一番長く楽しい作業だ、アイディアさえ出れば。


< 10月 | 12月 > | 表紙へ戻る | 探す | 案内


2007年 11月 2007年 10月 2007年 09月 2007年 08月 2007年 07月 2007年 06月 2007年 05月 2007年 04月 2007年 03月 2007年 02月 2007年 01月 2006年 12月 2006年 11月 2006年 10月 2006年 09月 2006年 08月 2006年 07月 2006年 06月 2006年 05月 2006年 04月 2006年 03月 2006年 02月 2006年 01月 2005年 12月 2005年 11月 2005年 10月 2005年 09月 2005年 08月 2005年 07月 2005年 06月 2005年 05月 2005年 04月 2005年 03月 2005年 02月 2005年 01月 2004年 12月 


上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。