サイトのテーマカラーや、グラデーションの使い方で悩んでいたりする方！
ぜひこちらのサイトを参考に使ってみてください。

決めた色がコード付きで、グラデーション表示されます。

口で言ってもよくわからないと思うんで、見てみてくださいw

0to255

Freelancer Website Collection

個人的にどんなサイトをもっているのか気になったり、料金設定とか気になったり・・・。
そんなところであればいいなーって思ってたんです。

ググってもないんで、自分で集めればいっか。って事で構想と制作あわせて2日で創りました。

突貫なんで、表示のおかしいところとかあると思います。

そんなときは教えてくれればありがたいです・・・。

フリーランスの人たちはもちろん、Webに興味あるひと、今後フリーランスでやっていきたい人。またはフリーランスを探している企業など。。。

ここからつながりがあるとうれしいですね。

もうちょい実験的にスクリプトとかCSS3をいれていこうと思っています。

まだ掲載数は少ないですが、がんばって更新しますので今後とも宜しくお願いします。

Freelancer Website Collection

• FWA
  有名なサイト。面白いサイトが多いです。
• FLASH MANIA
  こちらもFWAのようなサイトが多いです。写真やイメージを大きく使鵜場合には参考になるかも。
• CSS Beauty
  名前の通りのサイト。コーダーの私には一番お世話になっています。
• straightline bookmark
  日本ではおなじみになっているかと思います。更新頻度も多いので参考になるかと思います。
• Smashing Magazine
  デザイン以外にも色々な情報あります。毎日見てもいいかと。おすすめです。

みなさん。
毎日の更新おつかれさまです。

「IE6 No More」

いいことです。
個人的にIE6で制約が増えてやりたいことが面倒になったり、ハックを入れたりするのがイヤなのでIE6はなくなってほしーなーって思ってます。

でも、そうなるとそうなったで大変だともおもってます。
だって、IE6がなくなればCSS3での制作も増えてくると思います。
新しい技術を取得するのも必須となってくるでしょう。

そうなると既に取得している人とこれからって人との差が明確にでてくるでしょう。

煮詰まり感のあるCSSでのコーディングも楽しくなること間違いなし！！！！！！

早く:nth-childとか使いたい。

やっとこさインストールしました。

これで、制作に没頭できます。
今までフリーのソフトだったりつかっていたのでいろいろと不便がありました。

FTPソフトはやっぱりトランスミットがいいのかしら。。。
今はFirefoxのアドオンのFireFTPを使っているんです。

それより使い勝手はいいか。。

しかし、そんなときだからこそ試してほしい事があります。

「ハックを使わないでコーディング」

これを是非ためしてほしいのです。
簡単なところだと、floatをかけた要素にmarginをかけると一部のバージョンのIEではmarginを倍にとってしまうバグがあります。
そんなときにハックをつかって回避していると思います。
そういう部分をpaddingを適用させハックを使わないようにするなど回避方法は色々とあると思います。

そういった部分でハックを極力減らしてコーディングをする事を意識してほしいと思っています。

そういう事を意識する事によってもっとコーディングの技術があがっていくと思います。

やばい、偉そうな事いいすぎた・・・。
すいません、自分はまだまだペーペーなので自分がそういう事を意識して煮詰まったCSSのコーディングを楽しんでいきたいと考えていました。

そんな火曜日の夜。

「ie6-upgrade-warning」

IE6でアクセスすると下の画像のようなポップアップ画面がでます。

古いブラウザをいつまでも使っているんじゃない！！！！
って事です。

条件分岐コメントを使ってスクリプトを読み込んでいるのでIE6にしか読み込まれません。

<!--[if lte IE 6]>
<script src="js/ie6/warning.js"></script>
<script>window.onload=function(){e("js/ie6/")}</script>
<![endif]-->

このコードを読み込ませればIE6にWarning！！

IE6嫌いな人はいれちゃいましょう（笑）

コチラが元の大きい画像です。
Web Trend Map 4 – Final Beta

ユーザー数、利用者数がおおいと高いビルで表示されています。
色でサービスを分けてどのようにつながっているのかがわかります。

路線図に見立てているのが面白い発想ですよね。

素敵です。そっこう画像を保存しました。

参考にさせていただいたサイト
DesignWorks – 2009年のWEBのトレンドを路線図に落とし込んだ「Web Trend Map 4 – Final Beta」

本家画像
Flickr Photo Download: Web Trend Map 4 Final Beta」

CSSソース

input[type="text"],
textarea {
	border:2px solid #e8e8e8;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}

これで角丸なtextareaが出来上がります。

見づらいですが、綺麗な角丸が簡単に生成できます。

おまけですが、自分が今どの項目を選択しているのかわかりやすくする為にしてあげます。

CSSソース

input[type="text"]:focus,
textarea:focus,
input[type="text"]:hover,
textarea:hover {
	border:2px solid #3399FF;
}

こんな感じです。
:focusは選択している時にボーダーの色を変えています。
:hoverはマウスオーバーしたときですね。

選択をするとボーダーの色が変わります。

簡単にフォームをデザインする事ができるので活用してみてください。

詳しくは、「Adobe Edge: Flash Catalyst：PhotoshopデザインがそのままFlexアプリのViewへと変わる！」でご覧下さい。

Flash Catalystはデザイナーの為のツールで、MXMLやActionScriptの知識がなくても静的なアートワークからFlexアプリケーションのView部分を作成できる画期的なツールです。

ちなみに、Web Designing (ウェブデザイニング) 2009年 03月号 [雑誌]にも掲載されています。

これはすごく期待せざるを得ない！！！！