人生を英語で表した画像

ffffoundを眺めていたら目に留まったのでメモ。

life

学生から社会人へと移って行くところが一番動きがあっておもしろい。あとは、WORKの多さに目がいきますw

FFFFOUND! | i will set the world on fire

関連するエントリー
ギター風のカッコいいカギ


Webデザイナーと開発者向けのチートシートまとめ

34 cheat sheets for web designers and developers | Web and designers」で、Webデザイナーと開発者向けのチートシートがまとめられていました。

いくつかピックアップしてみると、


【jQueryのチートシート】

jQueryチートシート


【PHPのチートシート】
trueとfalseの判定で迷う時に便利ですね。

PHPチートシート


【CSSのチートシート】
プロパティの確認に。

CSSチートシート


【Webセーフカラーのチートシート】
セーフカラーの一覧が見れます。

Webセーフカラーチートシート


【実態参照文字チートシート】
Dreamweaverがない時に役立ちそうです。マウスオーバーでコピー可!

実態参照文字チートシート


他にも、Photoshop、Illustrator、Fireworks、DreamweaverといったWeb制作でおなじみのツールに加え、Wordpressやhtaccessまで、まさに至れり尽くせり。

pdfをダウンロードできるものが多いので、手元に置いておけばいざという時に役立ちそうです。


34 cheat sheets for web designers and developers | Web and designers


関連するエントリー
pxとemの相関図


Webデザインのリンク集まとめ

Webデザインの参考サイトを探すには、Webデザインのリンク集を利用すると便利です。

今日は、個人的によく見るWebデザインのリンク集をまとめてみました。


あんじょうできてはる

あんじょうできてはる


ズロック

ズロック


ikesai.com

ikesai.com


DesignLinkDatabase

DesignLinkDatabase


ここからは海外サイトが中心のリンク集。

CSSclip

CSSclip


BestWebGallery

BestWebGallery


CSS Mania

CSS Mania


DesignBombs

DesignBombs


creattica

creattica


We Love WP

We Love WP



こういったリンク集は、RSSを登録して眺めるだけでも楽しいですね。おすすめのサイトがあれば教えてください!


関連するエントリー
クールな404ページデザイン
タイポグラフィーを効果的に使ったサイト
色使いが美しいサイト 9
クールなデザインのWebサイト7つ

全日本バーベイタム選手権でメディアモンスターを育てよう!

「全日本バーベイタム選手権」が面白かった!」で知ったのですが、かなりおもしろい!

メディアモンスター

全日本バーベイタム選手権」にある「PLAY」をクリックすると、おもむろに難読漢字が10問出題され、その回答結果によりメディアモンスターが作成されるという仕組み。作成されたメディアモンスターは他のモンスターと対戦する事ができ、どんどんレベルアップしていくようです。

「Verbatim」というブランドの宣伝目的で作られたコンテンツのようですが、一目で興味をそそられるし何より遊び要素がおもしろい。こういった見せ方はすごいですね。


ブログパーツもあります。



しばらく遊んでみようと思いますw

DreamweaverのテンプレートでCSSシグネチャを行う方法

ページ毎にスタイルを切り替えたい場合には、bodyタグにidやclassを振るCSSシグネチャが便利です。
今回、Dreamweaverのテンプレートを使ってCSSシグネチャを行う機会があったので、その方法をメモ。


まずは普通にテンプレートを作成し、bodyに適当なIDを振っておきます。

<body id="default">

そして、bodyタグにカーソルを合わせた状態で「修正」→「テンプレート」→「属性を編集可能にする」をクリック。


Dreamweaverキャプチャ


「編集可能なタグ属性」のダイアログが表示されるので、属性を編集可能にするにチェックをつけ、タイプはテキストを選択してOK。ラベルと初期設定は最初に記述していたbodyタグのIDが入ります。


Dreamweaverキャプチャ


下図のようにbodyのidが変更され、テンプレートパラメータが追記されます。


Dreamweaverキャプチャ


これでCSSシグネチャを行う準備は完了。
このテンプレートから新規にページを作成すると、bodyタグは編集不可能になりますが、テンプレートパラメータが編集可能の状態でページが作成されます。


Dreamweaverキャプチャ


テンプレートパラメータのvalueを任意の値(bodyに設定したいid名)に変更します。このままページを保存してもidは変更されないので、「修正」→「テンプレート」→「現在のページの更新」をクリック。


Dreamweaverキャプチャ


bodyのidが任意の値に更新されていればOK。これでページ毎にスタイルを切り替えることが可能になります。


Dreamweaverキャプチャ



ただ、テンプレートをネストして作成すると、親のテンプレートでは編集可能な属性が子のテンプレートでは編集不可になるので注意が必要。これについては調べてみましたがよくわからず、今回はひとまず置いておきますw


Dreamweaverを使ってはいるものの、まだまだ試した事のない機能がたくさんあるなー。。


関連するエントリー
CSSシグネチャを初めて知った