Device 向けページ作成の肝

Dev.OperaMaking Small Devices Look Great という記事が公開されている。1 ページ目の Quick Tips(要点)だけ、勝手に訳しておく。

コードを書く

  1. 簡潔で効率的なマークアップを心掛ける
  2. フレームは避ける
  3. ポップアップは避ける
  4. 独占的商用規格は避け、代替手段を用意する
  5. 画像には height と width を指定する
  6. 画像には代替テキストを用いる
  7. JavaScript や動きのある効果には代替手段を用意する

テスト

  1. デスクトップ版 Opera のスモール・スクリーン表示でチェックする
  2. 画像をオフにしても伝わるか
  3. JavaScript をオフにして使えるか
  4. マウスなしで使えるか

小さな画面でのデザイン

  1. 文書の順番に配慮する
  2. 小さな画面でも最大の可読性を確保する
  3. 小さな画面に適した画像だけを用い、他は隠す
  4. 色、フォントの大きさ、配置に心を配る

一度やってみたかった Digg.com への submit。3 人が dugg ってくれた。
http://digg.com/design/Making_Small_Devices_Look_Great