ひろこさんへ

適用には送らせてもらったスタイルシートを適用してもらえればいいと思いますが、一応ながら数点のお知らせを

  1. ヘッダは太いタイプ細いタイプの両方に対応しています。好きな方を選んでみてください
  2. hanautaのところにちょっと装飾を加えたものも作ってみたので、こちらも好みの方を使ってみてください。

今、ここの右に2種類並んでいると思うのですが、スタイルシートをそのまま適用した場合が上のタイプ。HTMLはこうなっていると思います。

<div class="hatena-module">
  <div class="hatena-moduletitle">hanauta</div>
  <div class="hatena-modulebody">


<a href="http://hanauta.cdoll.jp/">
<img alt="hanauta web へ" src="http://f.hatena.ne.jp/images/fotolife/h/hiloco/20070324/20070324223759.jpg">
</a>
<br>

<div align="left">
vol.4、インタビューはイケテツ!
</div>
<a href="http://hanauta.cdoll.jp/">
<img alt="hanauta" src="http://f.hatena.ne.jp/images/fotolife/h/hiloco/20061114/20061114231145.gif">
</a>


 </div>
</div>

下のパターンが好みでしたらこんな記述にしてみてください。

<div id="hanauta">
  <div class="hatena-modulebody">

  <a href="http://hanauta.cdoll.jp/"><img alt="hanauta web へ" src="http://f.hatena.ne.jp/images/fotolife/h/hiloco/20070324/20070324223759.jpg"></a>
  <p>vol.4、インタビューはイケテツ!</p>

 </div>
</div>

不具合とか、ご要望とか、不明点があればお気軽に声を掛けてくださいねー。
よれではよろしく。

(id:YOAKE)

design_note2006-09-25

夜明けっぽい色を使って。という依頼だったように思います。他にポップてのもあった気がするんですけど、まあ、まあ。な。それはいいんじゃないでしょうか。とりあえず夜明けをってことでトップのグラデを作ったんだけど、あれは割と見事であった。オレ以外の人がどう受け止めるかとかはよくわかりませんけど、自分としてはパンチのある画面に仕上がったと思ってます。
せっかくなので忘れないうちに作り方をメモしておくと、夜明けっぽい画像を拾ってきて、横幅1ピクセルで切り取ったものを保存。それをCSSにてリピート貼り付けしてるだけです。でもこれってわりと使えると思う。森の写真を縦幅1ピクセルで切り取って、縦にリピートさせたりするとそういう色味のボーダーを作成したりできるので、キレイな色に仕上げるにはてっとり早くてズルイ手法だと思います。
構造として考えたところは、読ませる文章の方なので1カラムということと、あとはシンプルにってことを心がけてみました。とりあえず角丸に逃げてる感はありますけど、適度な角丸具合は探したつもりではあります。とりあえずそんな感じ。全体的にはけっこう丁寧に作れたと思うので、自分としては良かったんでないかと思ってます。

続きを読む

(id:hiloco)

design_note2006-09-20

以前使ってたデザインが使いたいという要望からだったのだけど、すでのそのCSSはどこへあるのか分からない。というかそもそも作ったものについて保存しておこうという意識がほとんどないのですけど。とりあえず配置とか色とかバランスはほぼ決まってたので、仕事がめっちゃ早かったです。んで、作ってみたのはいいけれど、今の自分はそれを作成したあの時よりは少しはCSSに慣れたのもあって、ちょこちょこと画像を入れてみたりしました。という訳で、わりと気軽で気持ち良く作業できたような気がしました。あと、提供先でいくらか評価されてたのがとても嬉しかったです。
とりあえず記録用に、一番こだわったところはメイン文章の外の斜めボーダー&グラデーションにしたところ。ということで。

続きを読む

(id:hateda_sonic)

design_note2006-08-13

ハニフェスに引き続き、ハポフェスのCSSのご依頼を承りましたん。

まとめ

とりあえず、白基調でいきましょう。ってことだけを守りつつ、白過ぎるんかなー?うち、白浮きしてへん?だいじょうぶ?なんて思いながらの作業を。最近、自分の中では黄緑が大流行なので、ポイントにはそれを使用することにしました。参加者をアンテナで捕捉して、それをサイドバーに表示させるってことだったので、スター軍団だぜ!みたいなノリでリスト形式の頭に★マークを付けました。アンテナの★とあわせてエントリのアンカーも作成しまして、2.0よりは1.0だろうよ。っていう田中さんの意見を大無視して下部に反射っぽく作ってしまいました。やってみたかったん、ごめんなさい。何か変わったことしたかといえば、編集ボタンをいじくったことです。書き込みを行う参加者だけに見えるところなので、不必要なんすけど、なんとなく面白いかなぁ?と思って。多人数編集ならではって感じでした。

続きを読む

レゴみたいなん

タイトル文字をレゴブロックみたいなんで作って、あとは黒の1pxの線でシンプルに。大人のレゴ遊びみたいな。うまく取り入れてるでしょ、わたし。 みたいな。おしゃれでしょ、わたし。みたいな。
逆に、やたらにブロック散らかしまくってゴチャゴチャしたのもアリかもしれん。子供部屋みたいでしょ、きゃぴきゃぴかわいいでしょ、みたいな。あれ?もしかしてベッキー?みたいな。

(id:mu-gi)

design_note2006-06-09

紺色と白を基本にして作成してみました。かなりのんびりと作業を進めていったからかもしれないんだけど、勢いみたいなのが全然なくなってしまった。勢いでウヤムヤにしてしまうところをキッチリやれたので良かった部分と、どこをどうやってもしっくりこない、あげくの果てには最初から全く違う形で作り直そうか?という心理が働いてきたので、結局、それが良かったのか悪かったのかよくわかりませんでした。でも最初は「これはかっこいい作品になるぜ!」っていう気持ちは間違いなくあった。
あと、作り始める前にやはりテーマとか最終的なイメージを持っておくことは大切だと思った。それを意識しながら組立てを行うことで、意味のしっかりしたCSSの組立てが出来ると思う。次回からは、手を付ける前に熟考して、実施の手を動かす作業を最小限に抑えるような形でやっていきたいと思いました。

続きを読む