MEMO 4 ME

XHTML1.1になった時に、使えなくなるタグがあります。
その中の1つとして、ページ内リンクで使われるname属性があります。

name属性が廃止になった時には、id属性を使いページ内リンクをするようになりますが、
特定バージョンのIEなどで認識をしてくれなかったのですが、
ここ最近使われるブラウザ（IE6〜IE8,firefox3,Safari）では、id属性のみ指定で動作します。

注意しないといけないのは、id属性がCSSなどと被ると動きません。

個人的には、今まで記載していた＜a name="test"＞＜/a＞と書いていた1行を＜h1 id="test"＞などと記載できるので、1行減るのがうれしい。

今まで何回か記載していたYUIのfonts.cssを使ってみました。
どうしてもパーセント指定をするのが面倒と思っていましたが、何とか重い腰を上げて、チャレンジしました。

ひとことで言うと、「何でもっと早く使わなかったんだろう。」です。

ピクセル指定の場合よりも細かい指定が少なく、実に効率がいいと思います。
またパーセンテージ指定なので、IEのバグで、font-familyを指定している場合に、ピクセル指定で11px以上小さく表示することが出来ないことについても考えないでいいので非常に楽です。

今後これを自分のデフォルトにしよう。

テスト用アーカイブ版Flash Player
http://www.adobe.com/jp/support/kb/ts/228/ts_228683_ja-jp.html

いつも探すのにURL不明になるのでメモ

CSSでtableのように上下中央にすることは出来ないと思ったが、
下記のようにすれば可能のようです。
http://www.yomotsu.net/wp/?p=387

サンプルをみて試してみたが、なかなかうまくいかず、よく考えてみるとそりゃ出来ないということが分かった。
あくまであってればだけど・・・。

HTMLのtableを考えると、tdタグで高さを指定できますが、
CSSで上下中央にする場合、この理論は出来ないようです。（自分理論）
じゃあどうやって、上下中央にするというと、
tableは、一言でいうと表を形成するタグなので、複数の要素が入ります。
なので、1つしかない場合は、どこの中央にも合わないってことになります。

今まで自分がやってたのは、
HTMLソース
＜div class="test"＞
　　＜p＞てすと＜/p＞
＜/div＞

CSSソース
div.test p {
　　background:url(bg.gif);
　　display: table-cell;
　　vertical-align: middle;
　　margin: 0;
}
/*for IE6 */
* html .test p {
　　display: inline;
　　zoom: 1;
}
/*for IE7 */
*:first-child+html .test p {
　　display: inline;
　　zoom: 1;
}

こんな感じのもので、divに背景画像を設定し、中央に合わせたいと思ってました。
しかしこれは出来ませんでした。
なぜならば、要素が1つしか無いため、既に中央にいることになっている。（合ってるかな・・・ｗ）

tableで書くと、↓「てすと」しかないので、中央も何もないことになる。
＜table＞
　　＜tr＞
　　　　＜td＞てすと＜/td＞
　　＜/tr＞
＜/table＞


同じような状況で中央にするには、
HTMLソース
＜div class="test"＞
　　＜p＞＜img src="spacer.gif" width="1" height="50" /＞＜/p＞
　　＜p＞てすと＜/p＞
＜/div＞

CSSソース
div.test{
　　background:url(bg.gif)
　　height:50px;
}

div.test p {
　　display: table-cell;
　　vertical-align: middle;
　　margin: 0;
}
/*for IE6 */
* html .test p {
　　display: inline;
　　zoom: 1;
}
/*for IE7 */
*:first-child+html .test p {
　　display: inline;
　　zoom: 1;
}
のようにする必要があります。

自分的には、謎が解けてよかった。

Live SearchがBingに変わり、Webmaster CenterのURLも変更されていました。

http://www.bing.com/webmaster

忘れる前にメモ

Live SearchからBingへになり、今までLive Searchにあったサイト登録のURLが使えなくなりました。

Bingサイト登録URLは、下記です。
http://www.bing.com/docs/submit.aspx?FORM=SURE

メモメモ

Microsoftが新しい検索エンジン「Bing」のプレビュー版を公開したようです。
http://www.bing.com/
調べてみたところ本来の公開予定は、明日（6/3）だったようですが、
本日アクセスできるようです。

特別なSEO対策方法とか出てくるのだろうか。

以前お伝えした、Yahoo Web Analyticsの日本版が一般公開されたようです。今後もコンバージョン機能など追加されていくとのこと。
Google Analyticsのようになっていくのかな。

Yahoo!アクセス解析

僕の管理しているサイトにも導入してみよう。

今さら感はありますが、半角英数を連続で入力した際、自動的に改行できない為、デザインが崩れてしまいます。
もしIEだけの対応であれば、

word-break: break-all

を使って改行することが出来ますが、他のブラウザでは出来ません。

ただいろいろなWebサイトを見ていると、大半のサイトが規定幅を超える半角英数の文字の羅列（URL）がある場合、表示上はみ出る箇所を表示しないようにしています。
対応方法は、簡単で、

.hoge{
　　width: 300px;
　　overflow: hidden;
}

これだけ。
今後これを標準として考えよう。

どうしても他のブラウザで改行したい場合は、jQueryを使えば、IE以外のブラウザでも対応が可能になります。
http://webtech-walker.com/archive/2008/11/02151611.html

これ使ったけどうまくいかなったけど、たぶん俺のやり方が悪いのかな・・・。
もう少し試してみよ

iPhoneやiPod Touchのデスクトップに表示されるアイコンを作成する機会があったので調べてみました。
「apple-touch-icon.png」というもので、簡単に作成が可能です。

1. 57x57pxの画像を用意
2. 表示したいHTMLのheadタグ内に下記を記載

＜link rel="apple-touch-icon" href="/apple-touch-icon.png" /＞

3. サーバのルートにUP

正方形で作成しても表示側で角丸になるので、自分で角丸にする必要はない。
まあfaviconと変わらないな。