HTMLスキル - 第1章 Lesson5

HTMLファイルを新規作成する方法

   

テクノロジーとクリエイティブのプロを目指す人のためのオンラインスクール
月額2500円で500以上のレッスンが受けられます

このスキルのデータをダウンロード: Windows Mac

Webページの土台を作る方法を見ていきましょう。



この動画で学べること

・フォルダの作成方法
・Webページの土台作り



ファイルを保存するフォルダを準備しよう

どのWebページでも必ず必要になる部分の作成方法をみていきましょう。
まずは、Webページのフォルダを作っていきます。
Macの方は、Finderのわかりやすいところで右クリックをし、「新規フォルダ」を選択してください。
Windowsの方はユーザーからフォルダに進み、ドキュメントまたはデスクトップの中にフォルダを作成してください。
フォルダ名は、今回は「webpage」にしておきましょう。
※文字化けを防ぐため、フォルダ名は必ず半角英数字にします。




Webページの土台を作成しよう

Webページに必ず必要な記述になる部分を作成しましょう。
Macの方はテキストエディット、Windowsの方はメモ帳を開いて新規ファイルを作成してください。
作成したファイルにこちらのソースを貼り付けます。



<html>
<head>
<meta charset="UTF-8">
<title>サイトのタイトル</title>
</head>
<body>
<h1>サイトのタイトル</h1>
<p>これはウェブページの土台を作るための練習ファイルです。</p>
</body>
</html>




こちらをHTMLファイルに書き出していきたいと思います。
メニューバーのファイルから保存に進みましょう。
保存のためのダイアログボックスが表示されました。
保存先は、先ほど作成したフォルダ、「webpage」にします。
ファイルの名前を今回は「base.html」にしてください。
※拡張子を必ず.htmlにしなければなりません。
テキストのエンコーディングをUnicode(UTF−8)に設定し、保存しましょう。
フォルダの中に「base.html」というファイルが作成されていれば、大丈夫です。