HTMLで「hello world」を表示しよう【初心者向け・HTMLの勉強02】

html

こちらの記事はこれからHTMLを勉強したいという方向けの記事です。

今回は実際にHTMLファイルを作成してhello worldという文書を表示させます。

テキストエディタ

テキストを入力する時にはテキストエディタを使います。

パソコンに詳しくない人はテキストエディタと言われても分からないですよね。

テキストエディタはパソコンでテキストファイルを作成、編集、保存するためのソフトウェアです。

Windowsのメモ帳や、macOSのテキストエディットなどがOSやデスクトップ環境に最初から用意されているので今回はメモ帖を使い説明します。

HTMLファイルの作成

デスクトップで右クリック→新規作成→テキストドキュメントでファイルが作成できます。

テキストドキュメントが作成されたました。

つぎはファイル名を「index」拡張子を「.html」に変更します。

※テキストドキュメントは拡張子が.txtになっているので.htmlにするのを忘れないで下さい。

下記をコピー&ペースト

index.html

拡張子を変更すると警告が出ますが、「はい」を選択してください。

先ほどのテキストファイルがHTMLファイルになりました。

メモ帖でindex.htmlを開く

先ほどのHTMLファイルをメモ帖で開きます。

HTMLファイルを選択し、右クリック→プログラムから開く→別のプログラムを選択→メモ帖

メモ帖が表示されてない場合はその他のアプリをクリック

メモ帖が開けました。

メモ帖に文書を入力

HTMLファイルをメモ帖で開けましたので、「 hello world 」と入力します。

下記をコピー&ペースト

hello world

hello worldと入力できたら上書き保存します。

ファイル→上書き保存

※ショートカットキーは「Ctrl+S」です。

上書き保存ができたらHTMLファイルをブラウザで確認します。

このように「hello world」が表示されていれば成功です。

まとめ

今回はHTMLファイルの作成と「hello world 」を表示させるという内容でした。

HTMLファイルがどんなものなのか、作業をすることで少し分かっていただけたかと思います。

実際のWeb制作にはメモ帖ではなく、DreamweaverやSublime Textといったツールが使われます。

興味がある人はぜひ、調べてみてください。

タイトルとURLをコピーしました