とりあえず設定したいCSSの基本設定

最近この手の記事をよく見かけるので、僕もそれにのっかります。。
もちろんデザインによってはこの通りではありませんが、自分のメモ代わりに、ということもかねて。

まず何より先に。

@charset "SHIFT_JIS";
@charset "UTF-8";
@charset "EUC-JP";

HTML側で使用しているエンコードに合わせて選択。
これは絶対１行目に記述してください。
しかし、なんでSHIFT_JISだけ「_（アンダーバー）」なんでしょうね？

全体の設定

* {
margin: 0;
padding: 0;
border-style: none;
}

margin、paddingを０に。
ボーダーも消してしまいましょう。

bodyの設定

body {
text-align: center;
font: normal normal 0.75em/1.4 "ヒラギノ角ゴ Pro W3", メイリオ, "Hiragino Kakugo Pro W3", Meiryo, Osaka, "MS Pゴシック", Arial, Helvetica, Geneva, sans-serif;
color: #333;
}

デザインにもよりますが、こんな感じの設定が多いです。
フォント設定はショートハンドにしてしまってますが、これは今使っているCSSEditというMacソフトがこのような設定になっているため。

font-sizeは標準的なブラウザーであればデフォルトで16pxに設定されているものが多いので、0.75emとすることで12pxになります。
font-sizeをpxの絶対値指定する人も多いようですが、IEでは文字の大きさを変更できなくなるというバグ（仕様？）があるため、できる限り相対値にしましょう。

line-heightは比較的読みやすいと言われている1.4に。

fonto-familyがやたらと登録されていますが、この程度でもOKだと思う。

font-family: Arial, Helvetica, Geneva, sans-serif;

ただ一部ブラウザーで文字化けするとクライアントに報告された経験から上記のように設定しています。

floatのクリア設定

.clearfix:after {
content:".";
height: 0px;
clear: both;
display: block;
visibility: hidden;

}

.clearfix {
zoom: 1;
}

有名なclearfixを使わせてもらっています。
これを使うおかげでboxの最後に

<br style="clear:both;">

のような設定をする必要がなくなりました。

あとは必要に応じて

#wrapper
{
margin: 0 auto;
width: ***px;
vertical-align: top;
}

を使ったり。

@charsetの次の行ぐらいからコメントタグを使って
/*
タイトル：案件名
制作日時：＊＊年＊＊月＊＊日
改訂日時：＊＊年＊＊月＊＊日＊＊時＊＊分／＊＊を変更
*/
のようにCSSのメモ書きを残しています。

全ての案件でこの設定が使えるわけではないですが、あくまでメモ書き・参考程度に。。

覚え書き

IE5.0、IE5.5の共存について

MultipleIEの利用
http://tredosoft.com/Multiple_IE
スタンドアローン版を個別に入れる
http://browsers.evolt.org/

上記IEインストール後にエラーが発生する場合は
http://www.microsoft.com/downloads/details.aspx?FamilyID=6DEE32AB-B618-4FB3-9A45-CDD08162E167&displaylang=en
よりッチをダウンロードし、そのまま実行せずに、解凍ソフトで解凍後、
wininet.dllをIE5とIE5.5のあるフォルダにコピーする。

スモールビジネスを貫く。

アンカテ(Uncategorizable Blog) - 「スモールビジネスの国」と「強者と弱者の国」

僕自身もSOHOと呼ばれるワークスタイルなので、この記事を単興味深くよませてもらいました。

• ベンチャーのように大金を集めない
• バブリーに稼ぐのではなくて、小さいことを武器にして小回りをきかせて稼ぐ
• 経営者(創業者)のアイディアと情熱と信念による経営
• 成長指向ではない

このあたりはまさしく自分たちのことかなぁ、と思えたり。
というか、自分の好きなようにやっているだけな気もしますが。。。

大手でディレクション経験をした身としては、上昇志向ばかりで、自分の足下が見えてない人が多すぎ。
大昔の燃費ばかり悪くて、小回りのきかないアメ車のように。
経営者は身の保身とお金のことしか見えていない。
だからといって計算はしていない。
結局そのツケをクライアントが支払っている気がするんですよね。

1. 競合相手を下回れ(同種の製品の中で単純で使いやすいものにチャンスがある)
2. 自分が使うようなサービス(製品)を作れ
3. 自己資金で行け
4. 必要な機能を網羅したリストを作って、半分だけ実装せよ
5. 会議は捨てろ

理想的ですね。
しかし現実といえば、

1. とにかく少しでも多くの機能を実装して（クライアントから）お金を！
2. そのサービス誰が使うの？
3. 資金はクライアントがだすもの。
4. 必要な機能は網羅できていないけど、意味なくそれ以上の機能を実装する。
5. 無駄な会議ばかり。

どうにかならないもんですかね。

コンパクトなものが好きな自分としては、身の程にあったスモールビジネスが一番です。
もちろんクライアントとの信頼があってのものですけど。

睡眠時間

FPN-睡眠時間を短くする１４のコツ＜前編＞

ここのとこ夜眠れない日々が続きます。
とくに忙しいというわけでもなく、単純に眠れない。
結局眠りにつくのは明け方、日が昇り初めてから。
そのまま２～３時間ほど眠り、起きる。

当然寝不足気味になるので、自宅で仕事をしているのをいいことに、隙あれば横になって目をつむったり、実際に寝てしまうことも。。。

そのせいか極端に寝不足でつらい、ということはなく、むしろ頭の回転はよくなってるんじゃないかと思えるぐらい。

眠りにつく前、ベッドやソファに横になりながらClieとにらみ合って、今できることを考えたり、次にやること、そのうちやらなくちゃいけないような雑用も含めて整理する。

その後しばらく休んでまた仕事を続ける。

眠いのを我慢してだらだら仕事を続けるよりも、ほんの少しでも横になって休むことで、十分睡眠不足は解消できるし、仕事の効率化にもつながる。

会社にいるとできないんですけどねぇ、これ。。。

ブラウザを使って情報収集を効率化。

ITmedia Biz.ID：情報収集を効率化！　ブラウザをカスタマイズしよう

この記事にあるようにブラウザを使って様々な情報を効率よく収集できる。
今回の投稿もblog this!を使ってブックマーク代わりに投稿しているもの。
面倒なんだけど、ただだらだらとブックマークに放り込むよりは、一度客観視できる方が記憶に残りやすい。

でもネタはほとんど同じようなものな気がするけど。。。

最近のいろいろ。

今日からこっちのblogメインで書こうかな。
mixiはそれはそれでいいのだけど、ちょっと面倒に思えてきた。。。

とりあえずMAMPではCGIがちゃんと動かない事も。。。
物によっては動くのでCGIが原因なのかなぁ。

PHPは問題ないので、いまのとこさほど不便は感じないのですが。

ThinkPadにubuntu linuxってのを入れてみた。
アップデートしたらアプリが起動しない。。。
パスが変わってしまったのか？

最近の開発環境

たいした事してないですが、ほとんどMac OSX上で完結しています。

Studio 8
Eclipse + PHPEclipse
JeditX

これでほとんどの作業がiBookで完結しています。

近頃のStuido 8はfireworksとFlashメインなのでDreamweaverは必要ない気もしますが、
相変わらずせこせことhtmlでの作業もあるので、
大量にページ制作する場合はやはりDreamwevaerは便利ですね。

あぁ、出来る限りNucleusなどのシステム導入で対応していますが。

コンパクトな環境

基本的になんでもかんでもコンパクトにまとめたいです。
現在某大手の制作会社でディレクターもどきな仕事をしつつ、
SOHOとしても仕事の受注を受けております。
というより、こちらが本業なんですが。

で、その制作環境は
（ハード）
・iMac G5 20inch
・iBook G4 12inch
（開発環境）
・VPC 7.0　Win2k / XP / 98
・MAMP

あとは制作ソフトいろいろなわけですが、基本的にiBookだけでことたりてます。
よくこの話をすると驚かれる訳ですが、webの制作程度ではそんなに大きなPCは必要ないです。
好きなときに好きなところで仕事ができる方が幸せなので、
iBookを昨年末に購入して以来稼働率が高く、他にもWin機はありますが未稼働です。
リース代が無駄になってますが。。。

ibook１台もって好きな環境で仕事ができるようになるのが理想ですねぇ。