HTML_logo
今回は実践編ということで、前回やったことを実践してみましょう。
 
■サイトはメモ帳からでもつくれる
実はメモ帳にHTMLを書き込んで保存形式を変えるとちゃんとしたwebページにすることもできます。
それを公開するにはレンタルサーバーが必要ですが、今回はページを表示させるだけです。

■実際にやってみよう
まずはメモ帳を開きましょう。
そして前回やった土台をまず書きます。
<heml>
<head>
</head>
<body>
</body>
</html>
これが基礎中の基礎中の土台になります。
本当は文字コードやCSSを指定してあげなきゃいけないのですが、今回は省きます。

■保存形式を変更する
メモ帳をひとまず保存してHTML形式に変えます。
メモ帳のファイル→名前を付けて保存→txtをすべてのファイルに変えます。
そして適当にファイル名を今回は練習.htmlで保存してください。
○○.htmlで保存するとこれから書いたコードが反映されるようになります。

■タイトルを書いてみよう
土台のhead部分にタイトルを入れます。
<heml>
<head>
<title>練習</title>
</head>
<body>
</body>
</html>
このコードを書き込みブラウザにドラッグアンドドロップします。
そうするとページ名が{練習}になってるはずです。
これをまず確認しましょう。
次に行きます。

■見出しを書いてみよう
次に書くのはbody部分です。
見出しは基本的に文字が大きいのでh1というタグを使います。
文字の大きさを変えるときにh1、h2、h3、h4というタグを使います。
h1が見出しの大きさ、h2が中見出し、h3は本文、h4が小文字です。
タイトル部分を書くには以下のとおりです。
<heml>
<head>
<title>練習</title>
</head>
<body>
<h1>練習ページ</h1>
<title>
</body>
</html>
ページに大きい文字が出てくるはずです。
出てこない!とかわからない!という方は具体的にどこらへんかコメントください。

■基本はだいたいこんな感じ。
こんな感じにwebページを作っていくことができます。
ちゃんとしたサイトを作るにはそれなりの労力と知識が必要なので頑張りましょう。
 headタグはページ中には反映されず、必要な情報などを書き込みます。
bodyタグは実際にページの中身になります。
これを押さえておきましょう。

今回はメモ帳を使うという練習程度の記事になります。
次回は色をつけたりヘッダー、メイン、サイドバーなどのパーツを作っていきます。
↓ブログランキング参加してます!バナークリックお願いします!↓