メール署名ジェネレーター
プロフェッショナルなHTMLメール署名を作成します。GmailまたはOutlookにコピー&ペーストします。
あなたの情報
プレビュー
Gmailに追加するには?
「署名をコピー」をクリックし、Gmailで設定 → 全般 → 署名に移動します。署名エリアをクリックして貼り付けます(Ctrl+V / Cmd+V)。Gmailはフォーマットを保持します。
Outlookに追加するには?
「署名をコピー」をクリックし、Outlookで設定 → メール → 作成と返信に移動します。署名エディターをクリックして貼り付けます。デスクトップアプリの場合: ファイル → オプション → メール → 署名 → エディターに貼り付け。
HTMLメールがデザインするのに奇妙な場所である理由
ウェブサイトのCSSとflexboxの世界で署名を作成し、それがメール内で崩れるのを見たことがあるなら、中心的な問題に出会ったことになります: 単一の「メールレンダリングエンジン」は存在しません。すべての主要なメールクライアントはHTMLを表示するために異なるコードを使用し、何が機能するかのルールは現代のウェブから数十年遅れています。Gmailは要素のstyle属性の外にあるほとんどのCSSを取り除き、Apple MailはWebKitを使用するため (かなりモダンです) 、そしてOutlook for WindowsはOutlook 2007以降、Microsoft WordのHTMLエンジンを使ってHTMLメールをレンダリングしてきました。これはflexbox、grid、現代のセレクタ、ウェブフォント、ほとんどのCSSアニメーションが単純に動作しないことを意味します。caniemail.comの互換性スコアボードはこれらすべてを追跡しており、考えさせられる内容です。
実用的な結果: HTMLメール署名は最低共通分母に対して設計されます。このジェネレータが出力するコードはインラインスタイルとテーブルベースのレイアウトを使用しており、Outlookデスクトップ、Outlook 365 web、Gmail、Apple Mail、Yahoo、iCloud、そして様々なモバイルクライアントを通過しても崩れない唯一の組み合わせです。
モダンな署名に含まれるべきもの
「正しい」署名は1つだけではありませんが、一貫して場所を獲得する要素があります:
- 名前。他の部分よりわずかに大きく太字で。受信者が最初に見るべきものです。
- 役職と会社名。二次的な行、明るい色。両方が短い場合は1行にまとめます。
- 電話番号。
tel:リンクで囲み、モバイルでタップすると電話がかかるようにします。 - メールアドレス。
mailto:リンクで囲みます。主に完全性のため。受信者はすでにあなたのアドレスを知っています。 - ウェブサイト。クリック可能、多くの場合ブランドのアクセントカラーで。
- ロゴまたは写真。通常60から100ピクセル四方、または150×40のバナー。それより大きくしないでください。大きな画像は送信するすべてのメールを肥大化させます。
- ソーシャルアイコン。24から32ピクセル、最大で2つか3つ。LinkedIn、X、GitHub、時々Instagram。視聴者が使うものに合わせます。
オプション、2020年以降ますます一般的: 代名詞 (he/him、she/her、they/them) を役職と同じ行に。
省略すべきもの
- 感動的な引用文。 受信者は研究調査でこれらを一貫して非専門的だと感じています。企業署名の後にガンジーを置きたい人は少ないです。
- 「iPhoneから送信」スタイルの自動追加。 受信者はモバイルメールの存在を理解しています。この行は何も追加しません。
- 複数のフォント。 1つに留めましょう。HTMLメールでフォントを混ぜることは、Outlookに間違ったフォントを代用するよう求めることです。
- 50 KBを超える重いロゴ。 送信するすべてのメールがその重さを運びます。大きな署名は会話のスレッドを素早く肥大化させます。
- 重要な位置のアニメーションGIF。 Outlook 2007から2019はアニメーションGIFを最初のフレームだけとしてレンダリングします。それを念頭に設計してください。
- 背景画像。 Outlookデスクトップは悪名高くバグの多い背景画像サポートを持っています。代わりに単色塗りつぶしを使用してください。
- スキルやサービスのリスト。 署名は広告板ではありません。視聴者がもっと知る必要があれば、プロフィールページにリンクしてください。
なぜテーブルとインラインスタイルなのか?
2つの互換性の現実がこれを唯一の安全な選択にしています:
- OutlookデスクトップはMicrosoft Wordを使ってHTMLをレンダリングします。 WordのHTMLエンジンは
display: flex、display: grid、現代の配置、ほとんどの疑似クラス、または数個のシステムフォント以外のウェブフォントを理解しません。明示的な幅とインラインパディングを持つテーブルこそ、Wordが確実にレイアウトできるものです。 - GmailはCSSを積極的に取り除きます。
<style>ブロックや外部スタイルシートに存在するCSS、メールの返信で引用されたものでさえ、それらのルールは消えます。個々の要素のstyle="..."属性内のCSSは生き残ります。
構造のためのテーブルレイアウト、視覚的ルールのためのインラインスタイルという組み合わせは、Outlook、Gmail、Apple Mail、そして様々なOutlook webバリアントで同じように見える署名を生み出します。このツールの出力はそのパターンに従います。
どこにどう貼り付けるか
- Gmail (web): 歯車をクリック、すべての設定を表示、全般、署名までスクロール、新規作成、エディタをクリックして貼り付け。Gmailはインラインスタイルを保持します。新しいメール / 返信のデフォルトとして設定し、変更を保存します。
- Outlook 365 / Outlook on the Web: 設定 (歯車アイコン) 、メール、作成と返信、メール署名、エディタをクリックして貼り付け。保存。
- Outlookデスクトップ (Windows) : ファイル、オプション、メール、署名、新規作成、名前を付け、エディタに貼り付け、保存。複数ある場合はデフォルトアカウントに割り当てます。
- Outlook for Mac: Outlook、環境設定、署名、+をクリック、貼り付け。
- Apple Mail: メール、設定、署名、レンダリングされた署名をドラッグ (または編集、貼り付けで貼り付け) 。フォーマットが失われた場合は「常にデフォルトのメッセージフォントに合わせる」のチェックを外して再度貼り付けます。
- iOSメール / Outlook iOS: モバイルクライアントは扱いにくく、デスクトップで下書きに貼り付け、レンダリングされた下書きからコピーし、それからiOSの署名設定に貼り付けます。モバイルでの直接HTML貼り付けはほとんどフォーマットを保持しません。
画像ホスティングの選択肢
署名に画像を含める2つの方法、それぞれにトレードオフがあります:
- ホストされた画像URL。
<img src>が公開アクセス可能なHTTPS URLを指します。受信者のメールクライアントはメッセージを開いたときに画像を取得し、多くの場合「画像を表示」プロンプトで許可を求めます。安価ですが、すべての受信者がサーバーリクエストをトリガーし、署名画像に乗ったトラッキングピクセルは開封率分析が機能する元々の方法の1つです。 - Base64インライン画像。画像は
data:image/...;base64,...URIとしてHTMLに直接埋め込まれます。転送時もきれいに生き残り、外部取得もありませんが、画像のエンコードされたサイズ分すべてのメールを肥大化させ、Outlook 2007から2019のデスクトップでは取り除かれたり警告されたりします。
企業署名の信頼できる選択肢: 控えめなサイズ (30 KB未満) のホストされたHTTPS画像、alt属性が埋められており、画像がブロックされたときに読みやすいテキストに劣化します。
コンプライアンスと法的要件
いくつかの法域では、ビジネスメール署名に特定の情報を法的に要求しています:
- 英国、Companies Act 2006は有限会社にメールを含む業務上のやり取りにおいて、登録された会社名、登録事務所の住所、登録番号、登録地を含めることを要求しています。個人事業主は免除されます。
- ドイツ、Telemediengesetz (TMG) は同様のImpressum要件を持っています: 会社の正式名称と形態、登録住所、連絡先情報、登記裁判所と登録番号、該当する場合はVAT ID。
- EUより広く、GDPRは署名に特に連絡先情報を要求していませんが、データ管理者に到達する明確な方法はより広いコンプライアンスの一部であり、署名はそれを置くのに自然な場所です。
- 規制業界、金融サービス、法律事務所、ヘルスケアなどは、特定の免責事項 (機密性の通知、FCAスタイルの法的開示、HIPAA関連の警告) をしばしば要求します。あなたの業界の要件を確認してください。
よくある間違い
- ウェブサイトツールでデザインしてメールにエクスポートする。 現代のCSSはOutlookデスクトップでは生き残りません。最初からメールの制約のために構築してください。
- 重い装飾画像。 送信するすべてのメール (そして誰かが行うすべての返信) がその重さを運びます。署名の画像の合計重量は30 KB未満を目指してください。
- 画像の
altテキストを省略する。 画像がブロックされている場合 (外部送信者に対するOutlookデスクトップのデフォルト) 、空のaltはレイアウトを崩壊させます。常に説明的なaltテキストを設定してください。 - すべての連絡先情報を画像に入れる。 受信者が画像をブロックすると、何も見えません。重要な情報 (名前、役職、電話番号) はHTMLテキストでなければなりません。
- 長いURLを全文表示する。 短いリンクで包むか、
https://www.linkedin.com/in/yourname-12345の代わりにアンカーテキスト (「LinkedIn」) を使用してください。 - 引用、スローガン、感動的な行。 受信者はこれらを非専門的だと感じることが広く報告されています。
- デバイス間で異なる署名。 メールを送信するすべてのデバイスで同じ署名を設定してください。デスクトップとモバイルから返信するスレッドで受信者は不一致に気づきます。
よくある質問
Outlookで私の署名がGmailと違って見えるのはなぜですか?
レンダリングエンジンが異なります。OutlookデスクトップはMicrosoft WordのHTMLエンジンを使用し、多くのCSSプロパティをWebKitベースのApple MailやGmail webとOutlook 365 webが使用するエンジンとは異なる方法でレンダリングします。このツールが生成する署名は、それらすべてで許容できるように構築されています。決して同一ではありませんが、常に認識可能な同じ署名です。
アニメーションGIFを含められますか?
はい、しかしOutlook 2007から2019のデスクトップはアニメーションGIFを最初のフレームだけとしてレンダリングします。最初のフレームを単独で成り立つように設計してください。アニメーションが意味を伝えるためにシーケンスに依存する場合、視聴者の半分を失うことになります。Gmail、Apple Mail、Outlook 365 webはGIFを通常通り再生します。
私のデータはどこかにアップロードされますか?
いいえ。署名は完全にあなたのブラウザ内で構築されます。あなたの名前、役職、連絡先情報、ソーシャルURLは、フォームからプレビュー、クリップボードへと進み、サーバーには行かず、分析エンドポイントにも行かず、マーケティングリストにも行きません。多くの署名ビルダーサイトはまさにこの連絡先データを収集することで収益化していますが、これはそうしません。
自分の写真を含めるべきですか?
オプションです。写真は署名をより個人的で温かく感じさせますが、画像の重量を追加し、多くの企業環境で「画像を表示」プロンプトをトリガーします。小さな (60から80ピクセル) ヘッドショットはうまくいく傾向があります。バナーサイズの写真はそうではありません。あなたの役割が主にB2C、営業、カスタマーサクセス、リクルーティングの場合、写真は役立ちます。B2Bの強い文脈では、名前と役職で十分です。
一部の企業が使用する法的免責事項とは何ですか?
規制業界 (金融、法律、ヘルスケア) で一般的: 「このメールおよび添付ファイルは機密であり、受取人専用です。誤ってこのメールを受け取った場合は、送信者に通知して削除してください。」法的に強制力があるかどうかは弁護士の間で議論されていますが、多くの業界で標準的な慣行です。英国の企業は、Companies Act 2006に従い、業務上のやり取りに登録名、登録事務所、登録番号、登録地を含めることを法的に必要とされます。
返信ごとに異なる署名を持つことはできますか?
ほとんどの主要なクライアント (Gmail、Outlook、Apple Mail) では、複数の署名を作成し、どれが新しいメッセージのデフォルトとして使われるか、どれが (多くの場合より短いバージョンが) 返信と転送に使われるかを選択できます。このツールで両方を構築し、クライアントの設定でそれぞれをスロットに割り当ててください。