メルマガ配信の基本文章構造

11月に入って1週間過ぎていきますが…

あと1ヶ月半ぐらいで2024年が終わります！

1年のカレンダーを見ると、2024年のカウントダウンを数えてしまう習慣化になってしまいました…

年末に向けて大忙しのシーズンが始まりますね。

どっかのお店もクリスマスシーズンが始まっているところも見かけるようになりました。

年末にバタバタにならないように余裕のあるスケジュールを組み立ててくださいね。

話を取り戻して…

メルマガ配信の基本文章構造

久々のメルマガ配信時に、HTML構造の中身を忘れたりしていました…

～ここまで冒頭のコピペ～

メルマガ配信時の文章構造はどうしてたかなと思い出しながら…

確かに、HTML4の文章構造しか使えなかった気がしたので、一か八かをかけて、HTML Living Standardを使って文章構造をしてみました。

結果、エラー…

真っ白になったり、文字化けになったり…

メールソフトを立ち上げたんやけど、文字化け…

とりあえず、過去の「HTML4」の時代に合わせて文章構造にするしかありませんでした。

忘備録としてここに記載しておきます。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
	<head>
		<title>タイトル</title>
		<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
		<meta name="description" content="ここに要約を記入"/>
		<meta name="robots" content="noindex"/>
		<meta name="keywords" content="ここにキーワードを記入" />
		<meta http-equiv="Content-Type" content="text/html; charset=iso-2022-jp">
		<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no" />
		<meta name="format-detection" content="telephone=no">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

		<style type="text/css">
			*{
				line-height: 1;
				margin: 0;
				padding: 0;
			}

			body{
				background:#FFFFFF;
				color:#333333;
				margin:0;
				padding:0;
			}

			img{
				line-height:0;
				vertical-align:bottom;
			}

			table{
				margin:0 auto;
				padding:0;
				width:600px;
			}

			@media screen and (max-width:480px) {
				table{width:100%;}
			}
		</style>
	</head>

	<body>
		<font color="#333333" size="3" face="フォント指定">
			<table border="0" cellpadding="0" cellspacing="0" style="margin:auto;padding:0;">
				<!-- ここの内容にメルマガ配信のコンテンツを作成 -->
			</table>
		</font>
	</body>
</html>

こんな感じですね。

あとは、メルマガ配信時に冒頭のプリヘッダーテキストが必要だそうだ。

プリヘッダーテキストについてはまた説明しますね。

今日はここまで。

ではまた！