CSS Nite in Ginza, Vol.21参加レポート

先日CSS Nite in Ginza, Vol.21に参加しましたのでレポートを掲載します。今回のテーマは携帯サイトです。

携帯サイトのコーディング事情?基本編 – 宮永 邦彦氏(アイデアマンズ株式会社)

  • キャリア別 CSSのサポート度合い
    Y!ケータイ > EZweb >>>>> iモード
  • iモードのCSS
    style属性に直接書く書式のみサポート
  • Y!ケータイとEZwebのCSSサポートの比較
    EZwebは・・・
    • font-weight:bold; 不可
    • border-style solid以外不可
    • width 不可
  • 太字表示は機種依存する → フォントに依存するデザインはNG
  • テスト環境はFirefox + User Agent Switcher、実機チェックは8機種くらいでしている
  • 写真: 携帯サイトのコーディング事情?基本編 (1)
  • 写真: 携帯サイトのコーディング事情?基本編 (2)

携帯用サービスにおける実装とデザインの現実 – 原 一浩氏、寺田 学氏、尾花 衣美氏(空飛ぶ株式会社)

アクビィ制作チームによる、アクビィの実制作に基づくプレゼンテーションでした。

  • 開発環境はDreamweaver CS3
  • テスト環境
    • iモード外字キット i絵文字を使って絵文字を表示
    • Firefox + User Agent Switcher
    • Firefox + Web Developerでウィンドウサイズを制限
    • PCで見ると「手元でカチカチやる感じ」がないのでNintendo DSでもテスト
  • 画像よりも絵文字を使う(ファイルサイズ・リクエストファイル数の削減)
  • ファーストビュー → QVGAを基準に
  • 機種により液晶のガンマ値・明るさが違う
    sRGB色空間を使うと、色の違いはあまり出ない
  • ユーザーのUser Agent判定をPHPで実装
  • PCからのアクセスをIPアドレス制限ではじく
  • 文字コードはShift_JISだが、内部ではUTF-8
  • Cookieは実質使えないので、GETパラメータを使ってセッションを引き回している
  • アクセス解析にはAWStatsGoogle Analyticsを利用
  • 写真: 携帯用サービスにおける実装とデザインの現実 (1)
  • 写真: 携帯用サービスにおける実装とデザインの現実 (2)

Continue reading

Unicodeでのバックスラッシュと¥の違い

とても恥ずかしいのですが、今さらバックスラッシュと¥の違いを身をもって体験しました。MacIE対策でバックスラッシュハックを使おうとして、ハマってしまったのです。

調べてみると、色々なことが分かりました。

  • Mac環境のUTF-8では、バックスラッシュは¥とは違う扱いになる。
  • Unicodeで書く場合、Windows環境だと¥はバックスラッシュに変換されるが、Mac環境では変換されず、¥は¥マークとして扱われる。
  • Osakaフォントなどで表示していると、¥もバックスラッシュも同じ「¥」表示になるため、見分けがつかない。(「Courier」フォントなどで表示すると見分けがつく)
  • Mac環境でバックスラッシュを入力するには、日本語入力の状態で「Option + ¥」。

Mac環境でバックスラッシュだと思って¥を入力しておくと、バックスラッシュハックなんかが効かなくなります。UTF-8でサイトを作っている時は要注意ですね。。

ちなみにHTML文書で¥を表示させたい場合は実態参照で¥です。

参考
UTF-8のバックスラッシュは¥ではない (kakitomeru note)
バックスラッシュ問題@MacOSX@KADOYAN.com
Dreamweaver8ハマりどころ 06.09.01 – Memo:hbworks
円記号 – Wikipedia
バックスラッシュ – Wikipedia
日本語環境でのUnicodeの諸問題 | Unicode – Wikipedia

2008年もよろしくお願いいたします

あけましておめでとうございます。Like@Lunaticを本年もどうぞよろしくお願いいたします。
いきなりではありますが、私の本年の抱負を表明させていただきます。

  1. 習得言語を増やす(もちろんここでいう"言語"とは"コンピューター言語"です)
  2. 作業環境の改善、最適化、そして作業の高速化
  3. 新しい作業環境への適応

当サイトで取り上げても良さそうなものは以上の3点となります。これをより具体的に書きますと、

  1. (X)HTML+CSSのコーディングレベルを上げると同時に、次期バージョン(CSS3など)を視野に入れてみる
  2. JavaScriptのコーディングレベルを上げる
  3. PHPを一から勉強
  4. XMLをぼちぼちやるかも
  5. WindowsからMacへのメイン制作環境の移行
  6. Vimを使いこなせるようになる

・・・といったところです。

ほかにもActionScriptや、Adobe AIR、Silverlightなど、興味のあるテクノロジーはたくさんあります。……が、もともと私はあまり器用な性格でありませんから、できることからコツコツとやろうと思います。改善や学習の過程で何かご提供できそうなネタや、書き留めておきたいネタがある場合は記事として投稿してまいります。

今までにここでは特に公表はしておりませんでしたが、昨年からMdNスクール・オブ・デザインにて講師を勤めさせていただいております。講師としての業務が板につくよう、こちらでも努力してまいります。

本年もどうぞよろしくお付き合いください。