HTMLコーディングTIPSブログ－ぜんぶのせ－

http://journal.mycom.co.jp/news/2008/11/06/046/
GIF、PNG、JPEGの使い分けについて。
割とわかりやすいんぢゃないかな。

http://journal.mycom.co.jp/news/2008/12/19/007/index.html
透過PNGについてリンクを辿ればいろいろ。
↓がよさげ？
DD_belatedPNG
http://www.dillerdesign.com/experiment/DD_belatedPNG/

http://journal.mycom.co.jp/news/2008/12/19/005/index.html
1サイトにスタイルシートを複数用意しておいて、
ユーザーに選ばせる方法がIE8によってとられるようになるかも。

http://journal.mycom.co.jp/news/2008/12/05/033/index.html
CSS3で今のコーディングが楽になっても、HTML5でいろいろ出来ることが増えちゃったら、今のコーディングは大分変わってマークアップエンジニアに必要なスキルは増えちゃうのかな。

http://builder.japan.zdnet.com/news/story/0,3800079086,20385937,00.htm?ref=rss
ウチでやってる分には世間で騒がれているほど、IE6対応ってむずかしいと感じないよね。崩れにくい方法で最初から組んでおけばいいだけ。

http://www.100shiki.com/archives/2008/12/pxempxtoem.html
pxとemを変換。計算不得意なら重宝かな。

http://gihyo.jp/design/column/01/standard/2009/view01
マークアップによる意味づけがもっと重要視されて、アクセシビリティにもどんどん注目が集まるようになっていくのかな。

http://www.yomotsu.net/lab/css/tips_print-icon
印刷で背景をどうしても出さないと駄目になったら使えるかも。
重くなりそうだけど・・・。

CSS 3のセレクタ「:nth-child()」の問題を回避する方法と応用例

div.section:nth-chid(odd) h2 {background:#CF6;}

＜div class=”section”＞
＜h2＞見出し＜/h2＞
＜p＞本文本文本文本文本文本文本文＜/p＞
＜/div＞

＜div class=”section”＞
＜h2＞見出し＜/h2＞
＜p＞本文本文本文本文本文本文本文＜/p＞
＜/div＞

＜div class=”section”＞
＜h2＞見出し＜/h2＞
＜p＞本文本文本文本文本文本文本文＜/p＞
＜/div＞
こんな感じじゃ駄目なんだろか。
こっちのが使い勝手いいような。

フォームのズレだって許せない！　リセットCSSをアップデート

こんなの作っとかないとなあと思いつつ、後回しになってたので、時間があるときに参考にする用にメモ

以下で発見。入れとくと便利そう。

重くならないかどうかはちょっと気がかりだが、、、
フォルダの容量をエクスプローラで表示する

追記(08.11.28)：なんか凄い重くなった気がして消しちゃった。

クライアントにメールで説明する機会があったので、こっちにも載せておく。

■牧野工房はIE8は、まだ対応外だが、
web標準に出来るだけ厳密に準拠しており、
IE8やこれから先出てくるであろう、
web標準に準拠した後続のブラウザでは崩れないはず。

※IE8は独自拡張を廃しweb標準準拠することを目指している。

■もしIE8の完成度が低く、崩れが目立つ場合は、
下記のモードを(2)に設定すれば解消する。

■IE8のレンダリングモードについて
(1)IE8の新しい標準準拠モード
(2)IE7のモード
(3)古いモード
を切り替えることができ、現在は(1)を
デフォルトとする方向で進んでいるよう。

IE8で大きく崩れるようなサイトは、
CSSを厳密にかかずにIE6などに合わせて、
「なんとなく表示はされてるからいいか」といった感じで
制作されたサイトが多い。

その場合は、上記のモードを(3)に設定するとよい。

【ページ単位で設定する方法】

＜meta http-equiv="X-UA-Compatible" content="IE=emulateIE7" /＞

を追記

【サイト全体で設定する方法】
サーバーのHTTPヘッダの設定に
X-UA-Compatible: IE=emulateIE7
を追記

IE対抗の独自ブラウザ開発を検討していた–アドビ技術責任者が語る

だってさ。
アドビならwebkitかな。

ブラウザ増えるのはいいことだよね。
ブラウザなんて多種多様に選択肢あった方がいいに決まってる。

・・・レンタリングエンジンが一緒であれば。

ブラウザはシェアが多いので20%とか、いっぱいあっていいから、 ブラウザエンジンを1本にして欲しいよね。

webkitが頑張ればいいよ。

＜発生条件＞
ローカルルートフォルダをネットワークのパスに指定されている場合
（ネットワーク上のドライブにローカルサイトを作成している場合）
＜対策＞
「ネットワークドライブの割り当て」をして、「L:」などから始まるのパスの形でローカルルートフォルダを指定する。

例えば、
A列にずらーっと1000行くらい異なるファイル名が記述されていて、頭にドメインを追記したい場合など。
「index.html」とか「corp/index.html」とか入っているセルがあったとして、それが何百もあると。
で、全部のセルにhttp://example.com/を追記して、「http://example.com/index.html」とかにしたい場合。

1. 新たにB列を作ってそこには全行に入れたい値（http://example.com/）を入れる。
2. 新たにC列を作ってそこには関数で「B列&A列」と入れる。→C列には「http://example.com/index.html」と表示される。
3. C列をコピーしてA列に「形式を選択して貼り付け→値」

display:table;とdisplay:table-cell;でやるのを書いた気がするが、こっちのがよさげ。

＜div＞
＜p＞＜input type=”button”＞＜/p＞
＜p＞＜input type=”button”＞＜/p＞
＜/div＞

div {
text-align:center;
}

p {
display:inline-block;
display:-moz-inline-box;
}
/* IE6 Only */
* html p {
display: inline;
zoom: 1;
}
/* IE7 Only */
*:first-child + html p {
display: inline;
zoom: 1;
}

牧野工房ではFireworksでは主に画像を書き出すだけですが、
Fireworksはスライスをそのままテーブルコーディングとして書き出す事が出来ます。
上部メニュー
▼ファイル
・書き出し

から開いたダイアログから
・ファイル名
・書き出し
・html
・スライス
を設定します。

この中で「・書き出し」を「HTMLとイメージ」と設定することによってテーブルコーディングとして書き出せます。
その場合の設定は色々あるので・・続く

ちゃんと理解していなかったので；

絶対パス
・http://～の記述（主に外部リンクで使用。この場合はターゲット_blankにしよう）
例＜ａ　ｈｒｅｆ＝”http://example.com/” ｔａｒｇｅｔ＝”_blank”＞
・ドメインを省略した記述(/から始まる)
例＜ａ　ｈｒｅｆ＝”/shop/index.html”＞

相対パス
・同じフォルダ内の場合はそのパス名だけでいい。
例＜ａ　ｈｒｅｆ＝”sitemap.html”＞
・違う階層の場合は一階層上に戻るたびに../をパス名の前に記述する。あとはそこからのパスを記述。
例＜ａ　ｈｒｅｆ＝”../../shop/map/sapporo.html”＞

ブラウザの右上にある [ Launch PicLens ] のアイコンをクリック。
もしくは検索結果画像の上にマウスオーバーすると表示される矢印をクリックするとスクロールする画面に切り替わります。
あとはカーソルでスクロールをコントロールします。
お目当ての画像を探すのに便利です。
ずっとスクロールしてると気持ち悪くなりますので注意です。