2006 -09-18 ( Mon )

More

画像置換リンクが効かない

まず、最近すっかり普及した感のあるtext-indentを利用した画像置換。
これを使用したキュウケイシツの追記リンクは、見た目は忠実に再現されているのですが、肝心のフォーカス・クリックができませんでした。
（こんなところに画像置換を使う自分もどうかと思いますが…まあ趣味のブログなので＾＾；）

みりばーるさんが、画像非表示に対応した画像置換を提案されてます。
レイアウト的な制限はありますが、こちらの方法なら、PSP=NetFrontでもリンクが有効になるかもしれません。

てんぽ：ちょっとマシな画像置換

微妙な左右マージン指定をしたレイアウトの不具合

今のブログの本文枠は以下のようにスタイルを指定していますが、左側の一部が切れてしまって読めませんでした。

#container {
	margin-left: auto;
	margin-right: 12%;
	width: 560px;
	padding: 1px 0;
	position: relative;
	background-color: transparent;
	border-left: 1px solid #333;
	border-right: 1px solid #333;
}

左へのずれ幅は、たぶんmargin-rightで指定されている「12%」ではないかと思います。本文枠の幅が560pxで固定になっているのではみ出したのだと思いますが、何故か方向キーでスクロールすることもできません。

PCモニタとの解像度の違い

携帯を含め、最近のモバイル機器の解像度は、PCと比べてとても高くなっています。つまり、画面の1ピクセル＝粒一個の大きさが小さいのです。
ということは、PCで小さめに表示される「small≒82%」をCSSで指定していると、モバイル環境ではとても小さくなってしまうのです。実際、私のブログはかなりの豆字になっていて、文字サイズを「大」にすることでどうにか読めました。

モニタ輝度の問題

モニタなどのバックライトの明るさなどを「輝度」といいますが、PSPはこれがかなり低いようです。
白背景では問題ありませんが、黒背景のデザインだとかなり文字が読みにくい。文字にアンチエイリアスがかかっているのでなおさらです。
（て言うか、今どきメジャーな表示環境で基本フォントにアンチエイリアスがかかってないなんてWindowsくらいじゃねェか）

---

以上のことを考えに入れた場合、タウン情報・ゲーム攻略サイトなどモバイル対応を考慮する必要がある場合は、やはり可読性に影響があるCSS装飾をできるだけ避ける方向でデザインした方がいいようです。

「ん〜、でもみんなPSPでネットは全然してないと思うよ」
とhydroさんに突っ込まれました（´∀｀；
まあでも、携帯フルブラウザでの通信料がつなぎ放題の対象になったら考慮する必要が出てくるなあ。

参考記事

CFDN：Nintendo DS UA String
（ニンテンドーDSのブラウザはOperaモバイルがベースです）

ウェビンブログ：media=”handheld”という視点
（handheldはPSPもDSも対象になるのだろうか）