すべてのページにメールフォームを設置する

このサイトは、ほぼすべてのページの下部分にメールフォームが設置されています。そして送信されたメールには、どのページのメールフォームから送信されたかわかるようになっています(わからないこともあります)。その記述の仕方を何種類か挙げてみようと思います。

無料かつナスカ・イースター・アルテミスで利用できるサービスを紹介したいと思います。

フォームの記述などについて下記のサイトを参考にさせていただきました。

方法

メールフォームからメールを確実に送信するにはデコード(解読)を行う必要があります。その方法は以下の3つのうちのいずれかになると考えます。

1番目と2番目の方法はwebスペースによっては行えないので説明を割愛します(こうしたサービスをお使いの方もフォームの記述方法の参考にはなるかもしれません)。例えばこのサイトのあるナスカはCGI・PHPが不可のうえデコードサービスも提供されていません。こうしたサイトでも設置できるのが3番目のレンタルデコードサービスです。

無料のレンタルデコードサービスは何社か行っていますが、その種類は以下の2つに分けられます。

2番目のhtmlに記述して使う方法だとより多くの記述方法があります。下に挙げる例だと1〜7から選べます。それに対して1番目のメールフォームにリンクして使う方法だと利用範囲が限られます。下に挙げる例のうち4と5と7しか選べません。

タダものではない!で紹介されているデコードサービスを例にとって分類してみます。

デコードサービス性能比較
サービス名機能の種類メールアドレス記入の有無
Alto Worldhtmlに記述メールアドレス記入
FC2フォームメールレンタル リンクID
FormManhtmlに記述リンク両方可ID
Future Spiritshtmlに記述ID
iCShtmlに記述メールアドレス記入
Laguzhtmlに記述メールアドレス記入
MagicFormCGIを使用ID
カンタンフォームメールリンクID
トクトク・レンタルフォームリンクID
フォームズリンクID

※メールアドレスを記入する形式だとspam(迷惑メール)が増える危険があります。またメールアドレスを公開したくないという考えからメールフォームを設置したい人には本末転倒です。どうしてもメールアドレスを記入する形式を使用しなければならない場合は、MyNoteBook内の@を使わずにメールアドレスを記述するを利用するなどするとspamを減らせるかもしれません。詳しくはAll About Japan[ホームページ作成]:@を使わずメールアドレスを記述を参照してください。

今回はこのサイトでも使っているFuture SpiritsFORM MAILERを例にして説明します。複数ページでの使用を許可されているので(フォームメーラーFAQ)安心して共通メールフォームとして使えます。


サンプル

サンプルを以下のように記述します。記述の説明は各ページのソースを参照してください。

0.記述例サンプル

1.htmlに記述する

2.SSIを使う

3.外部JavaScriptに記述する

3a.本文に記述

3b.ヘッダに記述

4.iframe(object)で呼び出す

5.frameで呼び出す

6.JavaScriptとiframe(object)を組み合わせる

方法4方法5では別サーバで動作するメールフォームへの対応が十分でないため、新しくウインドウを開く形式を追加します。

7.新しくウインドウを開く

付録.web拍手登録版を加工・改造・実験・検証


現在、このサイトでは6のJavaScriptとiframe(object)を組み合わせる方法4のiframe(object)を用いる方法を採用しています。

iframe(object)が有効である多くのブラウザ(Internet Explorer3以降/Netscape6以降)でiframe(object)の記述(JavaScript有効時・無効時)が反映され、Netscape6未満やテキストブラウザではメールフォームへのリンクが表示されます。

問題点

現時点で判明している問題点がいくつかあります。

JavaScript関連

1.外部JavaScriptでメールフォームを記述する場合(上の例だと方法3a方法3b方法6)、Internet Explorer 4.5(Macintosh版:JavaScript有効)でdocment.titleの記述以外のメールフォーム全体が文字化けします。

Internet Explorer 4.5 for Macintoshのスクリーンショット

解決方法:JavaScript外部ファイルの文字コードをUnicodeにすると文字化けしなくなります(参考:マイクロソフト サポート技術情報415319 - [M_IE45] JavaScript で出力した日本語文字列が不正All About Japan[JavaScript]:jsファイルでメンテナンスを楽にする[1] jsファイルの使い方)。が、他のブラウザでは様々な問題が起こるのでブラウザ分岐JavaScriptを利用する必要があります。

2.iCab 2.9.7(Macintosh版、JavaScript有効)でdocment.titleの記述が文字化けします。

iCab 2.9.7のスクリーンショット

解決方法:文字化けした箇所のみコピーしてMailKanjiFixerで修復変換すれば読めるようになります。

幸いなことに上に挙げた2つのブラウザは使用される割合がとても低いため、対策を取らなくても大きな影響はないと言えます。

入力内容の確認画面でタグが有効になってしまう

送信前に入力内容の確認をする設定にしているとき、テキストエリアにhtmlタグを記述するとその記述が反映されてしまい、場合によっては送信できなくなります。例えば、<iframe>という文字列を送信しようとするとMozilla1.3.1では送信ボタンが消失して送信できません。

解決方法は、テキストエリア内の文字列が送信される前に<&lt;に、>&gt;に置き換えて送信するといいのではないかと考えます。が、今の私の知識では難しい問題です。アドバイスをいただいてJavaScriptによって実現しました。メールフォームの記述をご参照ください。

また、入力内容の確認を表示しないというのも解決方法の一つになりそうです。

textarea内での改行が送信されたメールに反映されない

これが一番困った問題です。何十行もの文章を送信しても1行で送られてきてしまいます。どうやら改行は半角スペースに置き換えられてしまうようなのです。原因も解決方法も分かりません。 どうやらMacintoshでの改行コードの問題のようです。Future Spirits:フォームメーラーに問い合わせたところ仕様だそうです。改善策として、JavaScriptによって入力内容の確認画面で改行が反映されると同時に、受信したメールでも<br >と記述された箇所で改行されたと確認することができるようにしました。メールフォームの記述をご参照ください。

ナスカ無料ホームページ無料オンラインストレージ