ビルダー 不要なタグの生成を止めたい

Dreamweaverを使用してWEBサイトを作っています。
依頼人が更新作業をしているのですが
相手はホームページビルダーを使用しています。

CSSでいろいろ指示をしているテンプレートを作り、
テキスト部分を打ち変えるだけで更新できるようにしているのですが
ビルダーでテキストを打つと不必要なタグがやたらと入ります。
たまにフォント指定がバラバラだったりして、明朝とゴシックが混じったような文章になってたりします。
これは相手の操作に問題があると思うのですが(^-^;

ソース画面にして、テキスト部分に直接打ち込んで下さいとお願いしているのですが
どうしても見やすさから、通常の作業場面（？）でテキストを打ってしまうようです。

「表示がおかしくなったから見てくれ」と頼まれ見ると
すごい指定タグの量でびっくりします。

HTMLソースの自動整形やエラー修正のチェックを外したり、
その他いろいろ困る設定は外す事ができたのですが、
このフォントタグの細かな生成には参っています。

こんな感じです↓
<span lang=EN-US style='font-size:11.0pt;color:red'></span>○○テキスト部分○○<span
lang=EN-US style='font-size:11.0pt;color:red'></span><BR>
<span lang=EN-US style='font-size:11.0pt;color:red'></span>○○テキスト部分2○○<span
lang=EN-US style='font-size:11.0pt;color:red'></span><BR>

…不要な指示がなぜ入っているのでしょう？？

また、文章が終わって何もない所に↓
<span lang=EN-US style='font-size:10.0pt'></span></p>
<p class=MsoNormal><span style='font-size:10.0pt;font-family:"ＭＳ 明朝","serif";
mso-ascii-font-family:Century;mso-hansi-font-family:Century'></span></p>
<span lang=EN-US style='font-size:10.0pt'></span><span
lang=EN-US style='font-size:10.0pt'></span>
…と、これがたくさん残っています。（なぜでしょう？？）

改行タグの前の<SPAN lang=EN-US><o:p></o:p></SPAN>も困ります。

いろいろ書いてしまいましたが、設定でこれらのタグが入らないようにする方法はないでしょうか？
また、相手の操作次第(ソース画面で直接打ち込む以外）でなおる方法はあるでしょうか？

よろしくお願い致します。

No.2 ベストアンサー 回答者： panto-maim 回答日時： 2011/05/12 20:18

ホームページビルダーのバージョンはいくつでしょうか？

ホームページビルダーは、最新になればなるほど余計な機能が付いております。

私が使っているビルダー（古いバージョン）では、
ホームページビルダー以外で作成したページを編集することがよくあるのですが、
CSSテンプレートを使っているページを編集したりしても、
文字入力のない部分が<span lang=EN-US style='font-size:10.0pt'></span>のようになったりしません。
「ホームページNinja」シリーズや「ホームページZERO」のような
HTML自動生成するタイプのアプリケーションソフトだと上記のようになることはあります。
（それでも、「ホームページNinja」・「ホームページZERO」で作成したままのソースになり、
ホームページビルダーではそれをそのまま再現しているだけです。）

私がやっていることは、以下の通りです。
（※注意：新しいバージョンだと、このようにやっても上手くいかないかもしれません。）

「HTMLソースを自動整形する」をOFF
編集スタイルは、スタンダードかエディターズ（かんたんスタイルだと、設定に関わらず自動整形されるため）
「DOCTYPEを出力する」をOFF（ONにするなら、事前に宣言文を設定欄に入力しておく）
標準モードで作成する（どこでも配置モードは使わない）
スタイリッシュエフェクトは使わない
ページ編集画面で直接文字入力する（MSword形式で入力したり、wordなどを経由しない）
CSSテンプレートで細かく指定している場合は、入力する際のカーソルの位置に注意する
（ページ編集画面では、どこからどこまでが<p>～</p>とか<span>～</span>なのかわかりづらいため。
例えば、通常の文章を入力したいのに、前後のタグの要素の中にその文章が入ることがあります。）

位置がわかりづらい時は、HTMLソース画面で編集してもらうほうが本当は入力者にとっては楽なんです。
HTMLソース画面では、コメント部分・タグ部分・属性部分とテキスト部分で色分けすることができます。
いじってはいけない部分（タグや属性など）に色を付け、それ以外の部分で文字編集してもらうようにすると、
HTMLタグに不慣れな人でもわかりやすいです。


>改行タグの前の<SPAN lang=EN-US><o:p></o:p></SPAN>も困ります。

<o:p></o:p>を見て、MSwordでのホームページ作成・編集を思い出しました。
ホームページビルダーだと、MSwordで入力した文章をコピーして、ページ編集画面にて貼り付けると、
<span>～</span>やら<o:p></o:p>やら、余計なタグがぞろぞろ付いてきます。
ホームページビルダーだけで編集するのであれば、<o:p></o:p>が入るのは今まで見たことがありません。
一度、具体的にどのように編集しているのか確認してみてください。

この回答へのお礼

丁寧な回答ありがとうございます！
返事が遅くなって申し訳ありませんでした。

どんなやり方をしているのか、実際見てきました。
ビルダーのバージョンはわかりませんが、新しいと思います。
依頼人のやり方は
ワードで作成した文章をコピーし、ページ編集画面でペースト。
その後、出てきた赤いエラーのマーク？を適当に消していたそうです(-_-;;

コピーしてペーストした時点で、質問時に記したようなタグが挿入されていました。
これを繰り返し、その後文章を消したりして、余白に変なタグが残ったのかもしれないと思いました。

ワードの文章をコピーし、ソース編集画面にペーストすると、変なタグは付かずにコピーでき、
コピー後の操作（改行したり追加したり削除したり）は、
ページ編集画面でしても不要なタグは生成されていないので
ワードからページ編集画面への直接コピペが原因だったようです。

依頼人も理解してくれて、これからはソース画面にペーストしてくれるそうです。

私の方でも、アドバイスいただいたように
HTMLタグに不慣れな人でもわかりやすいように、見せ方を考えたいと思います。

ありがとうございました！

お礼日時：2011/05/17 15:36

No.1 回答者： mp20palpunte 回答日時： 2011/05/12 11:43

ソフトウェアには大して詳しくないので、根本的な解決方法は答えられないのですが……

自分はwebデザイナーなどでなく、むしろその依頼人さんのようなポジションで、サイトの更新などを行っていました。

Dreamweaverは、いじりながらある程度のプレビューが見れるので、使える環境のときはDreamweaverを使っていました（少し前のことなので、古いバージョンですが）。

そのときの経験から、デザインビューのウィンドウで更新をかけると、いわゆる不要タグが入りやすいと感じました。
例えば、テーブルの大きさを、デザインビュー側でドラッグして広げるなどの行為をするとです。
そこで、更新はコードビュー側で行うようにしたところ、不要タグは入らなくなりました。

これはおそらく、デザインビューでの変更は簡単に微調整できる半面、ソフトウェア内部でその行為に対するさまざまな処理を肩代わりできるようにするために必要なことだと思うので、それをなくすことはできないのではないでしょうか。

ですから、対処としては、依頼人さんが変にレイアウトを触らないよう、ソース自体を明確にしてあげるなどすると良いと思います。

<option value="1">1月</option>
<option value="2">2月</option>
<option value="3">3月</option>
こういう箇所があったとします。
この程度であればいいですが、もう少し複雑になると不慣れな人は何がどうなって、どこを変更すればいいかわからなくなります。
そうすると、デザインビュー側ではサイトで閲覧できる部分だけが表示されているので、そちらを触りたくなってしまいます。
すると、長文であれば続けて入力すれば範囲内で自動で折り返してくれるのに、自分でエンターを押して改行してしまったりして、<br>が入ればまだいいものの、<p>が入ってさらに まで……
なんてことになってしまいます。

なので、コードと触るテキスト部分を明確に分けてしまうのです。

<option value="1">

1月

</option>

わかる人には冗長で、ムズムズするかもしれませんが、このくらいハッキリと分かれていれば、「あ、1月のところを変えればテキストが変わるな」と気づくことができます。
また、前後に空行を入れることで、コードの変なところを触る危険を減らすこともできます。

小さなことですし、これで解決できるわけではありませんが、こうやって徐々に依頼人さんにコード側での更新を習慣づけていくことができれば、そのうちスムーズに更新作業が進むようになるかもしれません。

この回答へのお礼

丁寧な回答ありがとうございます！
返事が遅くなり申し訳ありません。

依頼人の更新作業のやり方を見せてもらいました。
結果、原因はワードで作った文章をコピーし、ページ編集画面へペーストすることで
不要なタグがたくさん生まれていたようです。
ワードの文章が明朝だったら、明朝のフォント指定が入っていました。
その後、出てきた赤いエラーのマーク？を適当に消していたそうで(-_-;;
その繰り返しで、余白に変なタグが残ったのかもしれないと思いました。

ワードの文章をコピーし、ソース編集画面にペーストすると、変なタグは付かずにコピーでき、
コピー後の操作（改行したり追加したり削除したり）は、
ページ編集画面でしても不要なタグは生成されていないので
ワードからページ編集画面への直接コピペが原因だったようです。

依頼人も理解してくれて、これからはソース画面にペーストしてくれるそうです。
（前は面倒だと嫌がられていましたが^-^;)
依頼人が更新しやすいように作ったつもりではいましたが
アドバイスいただいたように、コード部分とペースト領域をはっきり分けて
依頼人がもっと作業しやすいように、私の方でも気をつけたいと思います。

ありがとうございました！

お礼日時：2011/05/17 15:46