[最初の1歩]HTMLを書いてみる

ホームページが一体何で出来ているのか?をシンプルに書いたWEB講座です。クリエイターの最初の1歩もご体験頂けます。

ページが見れる仕組みは簡単

作った文書を他人が取り出せる場所に置くだけ。見たい人は検索で探したり、場所を示す「アドレス」を使って呼び出し、パソコンの中へ1時的に保存して閲覧します。

ページ作成体験をしましょう

その①:用意するもの。
メモ帳
メモ帳」を卒業しよう! 使い勝手抜群のテキストエディター3選 | エンジョイ!マガジン

▼メモ帳がすぐに見つからない場合はスタートボタンの横の検索窓に「メモ帳」と書いて呼び出してください。

▼メモ帳を開き以下のように書きます。

<html>
<head>
<title>私のです</title>
</head>
<h1>私のホームページ</h1>
私のホームページを作ってみました。
</html>

▲文字化けしなければコピーして貼り付けても大丈夫です。


始まりと終わり、つまり<○○>~</○○>となっている事に注意してくださいね。またスペルが間違っていても動作しません。

▼重要なのは保存形式。
ファイルから「名前を付けて保存」を選択します。

▼ファイル名は「任意の名前.html」ファイルの種類は「すべてのファイル」を指定

▼できましたか?

▼失敗例


拡張子(.html)に変換されなかったようです、でも大丈夫。

▼拡張子が見える方は直接修正してOK


▼警告が出ますが問題ありません。


▼拡張子が見えない人はプロパティから修正
※拡張子が見えない人は「表示しない」設定になっています。

▼アイコンを右クリックして「プロパティ」を選択。

▼ファイル名を書き換えます。


▼警告が出ますが問題ありません。

▼出来たファイルを開いてみてください。

▼貴方のホームページが出来上がりました。

▼これがホームページの基本です。

すべてのホームページがこの基本で動作しています。
▼実際のソース。実際のページは沢山のコードで出来ています。

大手企業ホームページのHTMLも見る事ができますよ。

▼見たい企業のページを開き、何もないところで右クリックして「ページのソースを表示」を選択します。

沢山のコードが組み込まれたソースを見る事ができます。

あとがき

最近はアプリやフリーのエンジンなどで作成する事が多いホームページですが、カレーをスパイスから作ってみたい人がいるように、手作りしてみたい人もあるのではないでしょうか。私はゼロから仕組みを知る事が合理化や新しいモノづくりへの発想を生むと考えています。

また何か思い付いたら書きます。お楽しみに。

  ASUS 公式オンラインストア「ASUS Store Online」