その10〜リンク色と文字の大きさ〜

おはようございます。
「グラス」のほうで、どたばたしてましたら
「MTやってみません?お勉強になりますよ」って
うれしいお誘いをいただいたんですけども、
行ってきたら、全面、英語だったので。。。(しおしお)
サーバーがどうとかって。。??わからんですもん。
もう、だめなんですよお〜。頭が。。
コンピューターも英語も、勉強しなくては。。(笑)


さて。
色なんですが。文字の。
色サンプルばかりながめてても、実際入れてみると
ぜんぜん合わなかったりで、いろいろ試してます。
今は、こんな具合。。
これがいいかどうか、わかんないくらい。。たぶん。。
前のオレンジの方がよかった??
ほんとは、横カレンダーの色に全部してしまいたいけど、
ちょっと、冠婚葬祭のイメージになってしまったので(笑)やめ。
なかなか「これだあ〜!」にはいきあたりません。
まだまだ、模索中。。

それで、文字の大きさ。
サイドバーのタイトル部分。
びおびおのFirefoxでは、本文のタイトルと同じ大きさでも
気にならなかったのですが、
お師匠さんから「Winでの見た目」を教えてくださって、
それで、Mac+IEなど確認したら、なんとなく
サイドバーのタイトルが「大きすぎ」と思いました。

なので、本文内のタイトル<h3>と切り離して、
<h4>をつくり、ちょっと小さめに指定しました。
いろんなブラウザで見るのって、また違う目で確認できて
気づくことができますね。大事だ。これ。

こんな感じです。
まだまだ、やることがあります。

その9〜リンク色とsideの整理〜

旅にでたものの、帰ってきました(笑)
「おお!」という出会いは、探そうとしてもダメです。
「出会い」はご縁ですから〜。(と感覚人間)

それで、自分のblogを眺めてて、
リンク色はオレンジでも、いいんじゃないかな〜と
思えてきました。(ブルーとそんなに合わなくもない?)

なので、他のブラウザでもFirefoxで見えてるのと同じくするため
●リンク色を指定。
[CSS]
  A:link {color:#FF6600}
  A:visited{color:#FFCC99}
  A:active {color:#}
  A:hover {color:#FFCC99}
 行ったところとこれから行くぞという時は、
 薄いオレンジにしました。


●左サイドバーのインフォ部分を整えました。
 文字も小さくしました。
[html]
  <p class="pay">
  <img src="<%image>"title="<author_name>"></p>
  <p class="info"> <!--インフォ-->
  <%author_name>のblog<br>
  <br>
  <%introduction2><br>
  </p>
    →<div>だったけど、段落上下を改行つきに
     したかったため、<p>に変えてみた。
    →位置を揃えたかったので、class指定。
[CSS]
  .pay{text-align:center;}  ←インフォ画像を真ん中

  .info{padding-left:5px;}  ←下のコメント部分

  この下にあった、FC2のクレジットは下に移動。

●右サイド一番上にあった「Links!」を
 びおびおのblogバナーに変えてみたとです。
 バナーは作っといて、ファイルアップロードに入れとくです。
[html]
 まず<!--link-->内のこの部分をはずす。
  <li><a href="<%link_url>" alt="<%link_name>">
  <%link_name></a></li>
 
 それで、このように入れる。
  <h3>びおびお'blog</h3>
  <div class=link-banner>
  <img src="http://blog1.fc2.com/y/yu-e/file/
  20050124161047.jpg" alt="一からばなー" border="0">
  <br>
  <a href="http://be-dama.seesaa.net/" target="_blank">
  <img src="http://blog1.fc2.com/y/yu-e/file/
20050124161750.jpg" alt="ぐらすばなー" border="0">
  </a>
  <br>
   (略)
  </div>  →1個目の「一から」バナーはリンクさせず、
         2個目のバナーからリンクさせます。

 それで、試してみたのが。。
 jpgの後ろ「alt=画像が表示終わるまでにでてくる「文字」」を
 「title」にすると、だいたいのブラウザでそれが出てくる。。と
 いうのを、聞いていたので、変えてみる。
 FC2は表示が早いので、出てるかよくわからないけども
 Firefoxで画像やリンクの上にカーソルを置いとくと
 黄色い小窓がでますよね。それにalt=titleで書かれたものが
 出ると気がついたので、びおはサイトアドレスを書きました。
 どうぞ、きてやってくださいまし。。

こんな感じかな。。

さっき、スレッドテーマのところをみてて
「WRC」っていうのがあったのですよ。
いまから行って、みてこよう〜っと。(嬉)

その8〜文字の色〜

うぬぬ。これが一番、むづかしいところじゃないだろうか。。
背景が白地なので、文字が黒というのは、なんとなく
「目が痛い」気がする。。
(eMacの画面の大きさにいまだ慣れなくて、せいいっぱい
 腕をのばして、遠くから見ようとしている、びおびお)

そう思って、すこしグレーっぽいほうがいいかなと
文字の色を変えてみました。

[CSS] color:#666;

う〜ん。見にくいですか? 前の黒がいいかなあ。。

Seesaaの「入力フォーム問題」で、ドタバタしてた時に
他のブラウザを開いたついでに「一から」もみてみよう!と。
Firefoxでみてると、オレンジ。
safariその他でみると、ブルーになっていて、
リンクの色指定をしていないことに、気がつきました。(遅)

「グラス」でのリンクの色は、元のテンプレートのオレンジを
そのまま使っていたので、「リンクはオレンジ色」という
固定観念ができていて、今回はじめてチャレンジしました。
が。。ギブアップです。
ブルー系かグリーン系であわせようと思ったんですが、
ブルーだと「寒々」しく感じられ、グリーンだとその色が
blogのメインカラーみたいに感じられ、どうにも。。
いっそのこと、グレーで強弱つけてみよう!と思いましたが、
「のっぺり」して、だめでした。

色を決める基準って、どんなのだろう。。

というわけで、リンクのタグをいったんはずし、オレンジ色に。
それで、びおびおは参考にさせていただく「blogさま探し」を
してまいります。
いつ、帰ってくるかなあ〜。(笑)

*そだ。
  contentを400px、leftとreightを170pxに変更しました。
 カレンダー部分とcenterを微妙に間隔をあけました。
 (わかんないですね。へへ)
次のページ