MacbookAirのhtmlの表示

Question

テキストエディットでhtmlタグを入力し保存した後、拡張子をhtmlに変更しました。
ですがそのhtml書類をダブルクリックで表示しても、タグの間に打った文字ではなく、わけのわからない文字が並んでいます。
何がいけないのでしょうか？

つまり、やりたいことは、htmlタグで打ち込んだものを実際にどのように表示されるのかを確認をしたいのです。

当方、パソコンの知識は全くないので上記の方法は根本的に間違っているかもしれませんが
どなたかご教授お願いします。

HALTWO · Accepted Answer

先ず Text Edit で html Tag を入力しなくても、普通に文字を入力した後「ファイル」Menu の「別名で保存」を選んで保存する際に Option で「Web ページ (.html)」にして保存すれば自動的に html Tag が付加された Data になります。

これを Double Click すると Safari で開かれますが、開いた Page で「表示」Menu の「ソースを表示」を選択すると別 Window に html code が付加された Data が表示される筈です。

つまり「Text Edit で html Tag を入力して保存した File の拡張子を .html にする」という手法がそもそも間違っているのです。

何の Option も選ばずに保存すれば rtf 型式で保存されますので、拡張子を .html に書き換えても Data は rtf 型式のままです。

「わけのわからない文字」とは『{\rtf1\ansi\ansicpg932\cocoartf103』のような文字でしょうか？

最初に \rtf1 とあるように、これは rtf Data 型式の宣言文です。

Text Edit で html Code を入力されるのであれば、先ず Text Edit の「フォーマット」Menu で「標準テキストにする」を選んでから別名で保存してください。

保存された File の拡張子は .rtf ではなく .txt になる筈です。

この拡張子 (.txt) を .html に書き換えれば html File になります。(html File の Data 型式は ASCII Text 型式ですので .txt をそのまま .html に書き換えても問題ありません)

さて、これを Double Click すると……

縺ゅ＞縺�∴縺……

「わけのわからない文字」とはこれのことですか？

そうなのであれば Safari の「表示」Menu にある「テキストエンコーディング」で「UTF-8」を選んでください。

Safari は何の指定もない Data であれば Shift JIS Code で Data が表記されているものとして読み込みますが、Text Edit は Default では UTF-8 (Unicode) で Data を保存する筈です。

勿論、Text Edit が .txt 型式で保存する際に文字 Code を Shit-JIS にして保存すれば Double Click して開いた Safari の Page は問題なく文字を表示している筈です。

因みに上記の「わけのわからない文字」は Unicode (UTF-8) で「あいうえお……」と記入したものです(^_^;)。

html Code の文字型式は Shift-JIS でも UTF-8 でも構わないのですが、<head>文に
<meta content="text/html; charset=Shift_JIS" http-equiv="Content-Type">
或いは
<meta content="text/html; charset=UTF-8" http-equiv="Content-Type">
と入れてください。

そうすれば Safari であろうと別の Browser であろうと Shift-JIS でも UTF-8 でも自動的に文字 Code を合わせて、正しく表示するようになります。

現在は UTF-8 が主流で Text Edit も UTF-8 を標準としていますが、Mac は長らく Shift-JIS を標準としてきた歴史から Safari も Shift-JIS を標準としており、UTF-8 が主流になる前の Web Page 用文字 Code は ISO-2022JP が推奨されていたことからも <head> 文に文字 Code を指定しておかないと異なる OS や異なる時代の PC では文字化けすることになります。

素敵な Mac Life を(^_^)/

chieffish · Answer

10.9ですがテキストエディットに別名保存はあります。
option+ファイルメニュー

リッチテキストで別名保存を選ぶとWebページ(.html)
も出ます。

でもhtmlタグの練習には適していないかも。

HALTWO · Answer

A No.2 HALTWO です。

A No.3 toast5 さん、補足有り難う御座います。

toast5 さんの御指摘通り、私の OSX Version は OSX10.6.8 Snow Leopard ですので OSX10.7 LIon 以降の Text Edit とは違いましたね……失礼しました(汗)。

どうやら Lion 以降では下図のような出力 Format の選択もなくなっているようですね。

ASCII TEXT Format での出力ができないようであれば他の Text Editer を用いられた方が良いと思います。

Text Editer は縦書き原稿用紙に対応しているものや Programming Code 編集に向いているものなど多種多様なものが PDS (Public Dimain Software) にあり、HTML Code の修正程度ならば Freeware で十二分に対応できます。

私は、普段は KompoZer で文書入力を行い、もう 10 年以上も、自分が作成する文書は全て HTML 型式で保存しているのですが、HTML Code の修正には Freeware Version の Mi という Text Editer を愛用していて、OSX 標準の Text Editer は Download Software の解説書等を Double Click で開いて読むのにしか使っていません(^_^;)。

原稿用紙対応を要する友人は iText を愛用していたと記憶しますが、他にも優秀な Text Editer がたくさんありますので、御質問者さんの Feeling に合う Text Editer を御使いになると良いでしょう。

素敵な Mac LIfe を(^_^)/

toast5 · Answer

いつもながらHALTWOさんの解説は有益で勉強になるのですが、少し補足します。

私の調査によるとHALTWOさんは１年前にOS10.6.8をお使いでしたが、今はいかがでしょうか。ウチの10.8.5のテキストエディットには「別名で保存」というメニューがありません。そのへんの事情は「mac バージョン オートセーブ 別名で保存」でググってください。

自動的に html Tag が付加される機能、というのも（あるのかも知れませんが）今のところ私には発見できていません。それ以外はすべて、お二方の回答通りです。

ki073 · Answer

テキストエディットはリッチテキストも編集できますので、そちらになっている可能性もあります。
拡張子を.rtfにしてテキストエディットで開いたらどうなりますか？

テキストエディットではなく、CotEditorやmiなどを使う方がトラブルが少ないと思います。
タグのカラーリングもしてくれます。

CotEditorは
http://coteditor.github.io
OSX10.7およびそれ以前は
http://sourceforge.jp/projects/coteditor/
にあります。

MacbookAirのhtmlの表示

先ず Text Edit で html Tag を入力しなくても、普通に文字を入力した後「ファイル」Menu の「別名で保存」を選んで保存する際に Option で「Web ページ (.html)」にして保存すれば自動的に html Tag が付加された Data になります。

10.9ですがテキストエディットに別名保存はあります。

A No.2 HALTWO です。

いつもながらHALTWOさんの解説は有益で勉強になるのですが、少し補足します。

テキストエディットはリッチテキストも編集できますので、そちらになっている可能性もあります。

関連するカテゴリからQ&Aを探す

デイリーランキングこのカテゴリの人気デイリーQ&Aランキング

マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング