Gmailに届いたHTMLメールのソースを確認(コピー)する方法

HTMLメールを配信したいけどソースがうまく書けない。
このHTMLメールの見せ方いいな!参考にしたいな!
でも、ソースの確認の方法がわからない。

そんな方向けの記事です。

今回は、Gmailで届いたHTMLメールのソースを確認する方法をご紹介します。

1.まず、Gmailからhtmlメールを開く

今回は、私がよくお世話になっている「スクー」のhtmlメールを使ってご紹介します。

少し脱線しますが、「スクー」はIT系を中心とした明日から仕事に使えるスキルが身につく学習動画を提供しているサイトになります。
定期的に、htmlメールを配信しております。

2.「メッセージのソースを表示」を選択

Gmailに届いたHTMLメールのソースを確認(コピー)する方法
返信ボタンの右側にある矢印を選択すると、下から4行目くらいに「メッセージのソースを表示」が表示されているのでクリックしてください。

するとこんな感じのソースが表示されます♪

Gmailに届いたHTMLメールのソースを確認(コピー)する方法

スクロールしていくと、「head」タグや「body」タグが見つかるのでコピーしましょう。

でも、あれれ???
文字化けしてる・・・・
メールの文字コードの設定を変えることで文字化けが直り読めるよう。

もし、文字化けを直したい場合は、以下のサイトを利用しましょう。

[ad#co-4]

3.メールの文字化けを直すならエンコードマニアックスを選択

エンコードマニアックスは、文字コードの設定を変更することができます。

Gmailに届いたHTMLメールのソースを確認(コピー)する方法

エンコードマニアックスで文字コード変更方法

gmail-htmlmail3
1.サイトに右上にあるテキストボックスに変換したいソースを貼り付け。

2.文字コードを選択。今回は、「SJIS」にしたらうまくいきました。うまくいかなかった場合は、他の文字コードを選択して試してみてください。

3.緑のボタン「エンコード/デコード」を選択

4.デコード結果の下に変換の結果が表示されます。今回は、「Quoted Printable」のところでうまく日本語が表示されて変換がうまくいっていました。

まとめ

いかがだったでしょうか?
うまく「ソースの確認」できたでしょうか?

HTMLメールは、まだまだインライン要素で書かなきゃいけなかったり何かと不都合が多いから作るの大変ですよね。
なので、他の方が配信しているHTMLメールを参考にしてよりよいHTMLメール作成してみてください。
まるまるコピーは、やめて自分なりにカスタマイズして配信してくださいね。