0気づいたら夏季休業から一ヶ月過ぎてました、、、こんにちは。お休み中は二週間ポルトガルとスペインへ行っていました。後日時間を見つけて旅行中の記事はアップしようと思ってます(予定)。30代半ばにして体力の衰えを実感した夏でした・・・。そんな使い物にならない時にHTMLメールのお仕事が入ってきました。制作実積にも載せてますが、一応作成経験があるので楽勝〜と思ってたら「レスポンシブで」という余計な一言まで!wHTMLメールはHTMLと名前がついてるくせにHTMLページとは別モノですね。メーラーが<head>内の記述を読まない為インラインCSSしか反応しないという・・・。スマホでのgmailだとインラインCSSすら無視するとかいうし!そのため、HTMLメールのコーディングはテーブルレイアウトが基本。いまや制作現場では「過去の負の遺産」的扱いのテーブルレイアウトですが、こんなところで重宝されてたとは・・・!今の20代のWEBデザイナーやコーダーさんはテーブルレイアウトを学校で教わらないらしいので、いじれない子がいるとききます(実際私の後輩でもいました)。css3だのSASSだの言われててもテーブルレイアウトも経験していてこそのWEBデザイナーかな、と個人的には思いますwそんな年寄り的なつぶやきは置いといて(今回は年齢を感じさせる文面が多いな^^;)レスポンシブHTMLメールですよ。納期まで時間がなかったので、素敵なテンプレートを利用させていただきました!antwortこういう便利なものがある世の中に感謝・・・wこのantwortの強みは「あらゆるデバイスのメーラーで実証済み」ということ。おお、時間ないからそれは助かる・・・wと、まんまとのっかったわけです。お客様としては画像を大きく見せたい、あとスマホで読みやすい文字サイズで(でもPCでの体裁もきれいにしたい)、というのが要望だったので、画像サイズはさすがにいじりました。テスト配信前のURLでのチェックでもきちんとレスポンシブになってて、お客様からの反応も上々。いざテスト配信してみたら・・・あれ?インラインCSSがPCメーラーでもきいてない、、スマホでメディアクエリが効いてない。アンドロイドだとテキスト拡大もできない。??!!!慌てて他の大手会社からのHTMLメールを検証してみると、以下の点が判明しました●メーラーはメディアクエリを認識しない●スマホでのHTMLメールは横に回転しない(サイズ固定)●スマホHTMLメールでテキストはi-Phoneだと拡大可能、アンドロイドは拡大不可そして、そこから思い知ったこと。テーブルレイアウト最強しかしantwortさんよ、、ほぼ全てのデバイスで一体何を確認していたんだい?これはデザインテンプレとしては便利ですが、やはりそこが限界かな。メーラーがメディアクエリ認識するようになればいいのにね。コメントをキャンセルメールアドレスが公開されることはありません。*サイト次回のコメントで使用するためブラウザーに自分の名前、メールアドレス、サイトを保存する。中の人カイカデザインキャッチコピーを『今依頼できるデザイナー・平日フリーランス』(パクリ疑惑)にしたいフリーランスデザイナー。当ブログではまっとうな制作者がつまづきそうもない部分でつまづいている実体験を、もともと持ち合わせてない恥もプライドもかなぐり捨ててさらしております。