注意:htmlやjsやcssの記述ルールはネットで「html 初心者 コーティング」とかで調べたら出てくると思うのでここでは説明しません。
注意:使うOSはWndowsですのでMacの方でもわかるように書くよう努力はしますが、一部通用しない部分があるかもしれません。
*1 拡張子:ファイルの種類を明示的に記すためのファイルの記述子(詳しくは「拡張子とは」で調べてください)
今回は、htmlファイル作りまで説明します。
最初に、ファイルを作成しましょう。
拡張子*1を先にhtmlに変えてしまうと、ファイルを開くプログラムを変更しなければならないので今回はtxtのままで編集して、htmlに変えて開きます。(エディターを使えばややこしいのはスキップできます。)
ファイルを追加する画面で、テキストファイルが追加できるのを選択して好きな名前に変更してください。

次に、表示する内容をそのテキストファイルに書き込みます。
簡単に文字をそのまま書いてもそれが表示されるので何か好きなのを書いてみてください。(そのままダブルクリックすると設定されているプログラムで開くと思います。)

そして、拡張子を変更します。
初期設定では拡張子が表示されないためで拡張子を表示させます。
「表示」->「表示」->「ファイル名拡張子」でできると思います。

最後に、初期設定で何らかのブラウザのアイコンが表示され、それで開くようになっていると思いますので、そのファイルをダブルクリックしてみてください。

(たぶん、テキストファイルのままブラウザで表示されても同じ表示にはなると思われます。)
完成です。以下によくある疑問を載せておりますので読んでください。
part2以降も書いていこうと思っておりますので、ぜひ読んでもらえると嬉しいです。
よくある疑問...
Q. 「.txt」とか「.html」の拡張子はどうやって出すの?
A. ここにあります。
Q. 「sample.html」にしたのにテキストファイルと認識されるのはなぜ?
A. 拡張子を表示してみると「sample.html.txt」となっていると思われます。
拡張子の表示方法はここにあります。
ありがとうございます
誤った情報が含まれている可能性があります。
これは2025年08月17日に最終編集されています。
広告は使っているプラットフォームの仕様ですのでご了承ください。
追記:この方法を試して少しでも面白いと感じてもらえれば幸いです。

