今回は、HTMLの基本構造について学んでいきます。
以下はHTML基本要素、ソースの外枠の部分です。必ず記述する部分になります。位置や並びの移動もありえませんのでなるべく早めに覚えて下さいね。
※わかりやすいように色をつけました。
<html>
<head>
<title> </title>
</head>
<body>
</body>
</html>
一番最初に記述されるのは<html>、一番最後に記述されるのは</html>です。これはHTML文書ですよ、という意味です。
<head>〜</head>は、ヘッダーです。タイトル<title>〜</title>など、HTML文書の情報が入ります。タイトルはブラウザのタイトルバー(一番上のバー)に表示されます。
<body>〜</body>は、HTML文書の内容です。ここに記述されたものが、今あなたが見ているこの画面に表示されます。
ホームページを作るとほとんどこの<body>〜</body>間の内容(ソース)が増えていきます。
このようにHTMLは、「タグ」(<>で囲んでいる部分)という命令の間に命令が入り、「入れ子」形式で記述されます。
そして、始まりのタグは必ずどこかで終わりのタグによって閉じられるんですね。
それでは、今回はここまでです。
2007年10月11日
2007年10月09日
ホームページ作成講座(入門編) その4
HTMLを体験してみよう!
今回は、実際に簡単なHTMLを記述してもらいます。
実際に作成することで、HTMLがどういうものなのか?わかるようになってきます。
今回は、Windowsを使用している人向けの内容になっています。Macユーザーの方はごめんなさい。
それでは、順を追って説明しますね。
1.自分のパソコン上で「メモ帳」を起動する。
以下の順でクリックして下さい。「メモ帳」が起動します。
↓↓↓
「スタート」ボタン→「すべてのプログラム」→「アクセサリ」
→「メモ帳」
2.「メモ帳」でHTMLを記述し保存する。
「メモ帳」で以下のように記述して下さい。
↓↓↓

3.2で作成したファイルに名前をつけて保存する。
以下の操作手順に従って下さい。
↓↓↓
・「ファイル」(メニューバー)→「名前を付けて保存」をクリック
・開いたダイアログボックス(窓)で以下の項目を入力する。
「保存する場所」→デスクトップ
「ファイル名」→sample01.html
「ファイルの種類」→すべてのファイル
・開いたダイアログボックス(窓)で「保存」ボタンをクリック
4.3で保存したのファイルをダブルクリックする。
以下のように表示されます。
↓↓↓

※うまく表示されない方は、こちらから簡単なHTMLの完成版を開いて保存して下さい。
↓↓↓
sample01.html
今回は、基本的なHTMLを記述してもらい、それをブラウザで表示する所までを行いました。
次回は、今回作成したHTMLの記述内容について説明します。
実際に作成することで、HTMLがどういうものなのか?わかるようになってきます。
今回は、Windowsを使用している人向けの内容になっています。Macユーザーの方はごめんなさい。
それでは、順を追って説明しますね。
1.自分のパソコン上で「メモ帳」を起動する。
以下の順でクリックして下さい。「メモ帳」が起動します。
↓↓↓
「スタート」ボタン→「すべてのプログラム」→「アクセサリ」
→「メモ帳」
2.「メモ帳」でHTMLを記述し保存する。
「メモ帳」で以下のように記述して下さい。
↓↓↓
3.2で作成したファイルに名前をつけて保存する。
以下の操作手順に従って下さい。
↓↓↓
・「ファイル」(メニューバー)→「名前を付けて保存」をクリック
・開いたダイアログボックス(窓)で以下の項目を入力する。
「保存する場所」→デスクトップ
「ファイル名」→sample01.html
「ファイルの種類」→すべてのファイル
・開いたダイアログボックス(窓)で「保存」ボタンをクリック
4.3で保存したのファイルをダブルクリックする。
以下のように表示されます。
↓↓↓
※うまく表示されない方は、こちらから簡単なHTMLの完成版を開いて保存して下さい。
↓↓↓
sample01.html
今回は、基本的なHTMLを記述してもらい、それをブラウザで表示する所までを行いました。
次回は、今回作成したHTMLの記述内容について説明します。
2007年10月08日
ホームページ作成講座(入門編) その3
HTMLを勉強しましょう。
今回は、「HTML」について学んでいきます。
1.HTMLとは?
HTMLは、HyperText Markup Language(ハイパーテキストマークアップランゲージ)の略語で、ホームページを作成するための言語です。ホームページの1つであるブログもHTMLで記述されています。
ホームページやブログを作るということは、HTMLを使って記述する言語を書くということです。
すでにブログを作成されている方は、HTMLを使って作成されましたか?ほとんどの方は、HTMLを意識しないで作成されていると思います。
最近のブログ作成サービスでは、HTMLを記述しなくても日記を書くくらいの簡単な操作でブログは作成できます。なぜならツールが自動でHTMLを作成してくれるからです。
ただ、ツールで作成したブログをカスタマイズ(ちょっとした変更)したい場合や、ホームページを1から作成する場合にはHTMLの知識が必要になりますので、基本的なことは学びましょう。
HTMLはテキスト文書、文字です。タグは<>で閉じられた文書の構造を伝える命令です。
タグには始まり<>と終わり</>があり、この始まりと終わりのタグに囲まれた部分に、タグの命令が適用されます。
ブラウザ(ホームページをを見るためのソフト)にIE(インターネットエクスプローラー)を使用されている方は、IEのメニューバーの「表示→ソース」をクリックしてみてください。なにやら文字の書かれたものが開きませんか?これがHTMLの正体です。
2.ブラウザとは?
上記ですでに紹介しましたが、ブラウザは、HTMLの正体を普段見ているホームページの形に変えて表示してくれるソフトです。
ブラウザには、IE(インターネットエクスプローラー)やNN(ネットスケープナビゲータ)、Firefox(ファイヤーフォックス)、Safari(サファリ)などいろんな種類のソフトがあります。Windowsでは、IE(インターネットエクスプローラー)が最も多く使われています。
今回は、「HTML」と「ブラウザ」について学びました。次回からは、HTMLについてもっと詳しく学んで行きたいと思います。
1.HTMLとは?
HTMLは、HyperText Markup Language(ハイパーテキストマークアップランゲージ)の略語で、ホームページを作成するための言語です。ホームページの1つであるブログもHTMLで記述されています。
ホームページやブログを作るということは、HTMLを使って記述する言語を書くということです。
すでにブログを作成されている方は、HTMLを使って作成されましたか?ほとんどの方は、HTMLを意識しないで作成されていると思います。
最近のブログ作成サービスでは、HTMLを記述しなくても日記を書くくらいの簡単な操作でブログは作成できます。なぜならツールが自動でHTMLを作成してくれるからです。
ただ、ツールで作成したブログをカスタマイズ(ちょっとした変更)したい場合や、ホームページを1から作成する場合にはHTMLの知識が必要になりますので、基本的なことは学びましょう。
HTMLはテキスト文書、文字です。タグは<>で閉じられた文書の構造を伝える命令です。
タグには始まり<>と終わり</>があり、この始まりと終わりのタグに囲まれた部分に、タグの命令が適用されます。
ブラウザ(ホームページをを見るためのソフト)にIE(インターネットエクスプローラー)を使用されている方は、IEのメニューバーの「表示→ソース」をクリックしてみてください。なにやら文字の書かれたものが開きませんか?これがHTMLの正体です。
2.ブラウザとは?
上記ですでに紹介しましたが、ブラウザは、HTMLの正体を普段見ているホームページの形に変えて表示してくれるソフトです。
ブラウザには、IE(インターネットエクスプローラー)やNN(ネットスケープナビゲータ)、Firefox(ファイヤーフォックス)、Safari(サファリ)などいろんな種類のソフトがあります。Windowsでは、IE(インターネットエクスプローラー)が最も多く使われています。
今回は、「HTML」と「ブラウザ」について学びました。次回からは、HTMLについてもっと詳しく学んで行きたいと思います。
2007年10月06日
ホームページ作成講座(入門編) その2
ブログで記事を作成しよう!
みなさん、もうブログは始めましたか?
ブログを始める時の初期設定は、各サービス(gooブログなど)毎に違ってくるのでここでは説明は省略しますね。各サービスのマニュアルに従って下さいね。
初期設定が終わった方は、早速記事を書いて見ましょう。ここで、記事を書く際の注意点をいくつか教えますね。
1.できるだけテーマを絞って記事を書く。
ブログを多くの人に見てもらいたい場合は、あらかじめ自分の興味のあるテーマを決めておいてから、そのテーマにそったブログにしましょう。
例えば、サッカーに興味がある場合、サッカーをテーマに絞り、作成する記事もサッカーに関したことを記事にしましょう。
なぜテーマを絞った方がよいか?
それはまた後々説明します。
2.ルール・決まりを守りましょう。
インターネットの世界に、「ネチケット」という言葉があります。これは、インターネットのエチケットの略で、インターネット上のルール・マナーのことです。
各ブログサービスに、禁止事項・ルールなどが掲載されているので、記事を作成する前に事前に必ず読んでおきましょう。
「ネチケット」について詳しく知りたい方は、以下のサイトを参考にして下さい。
↓↓↓
http://www.cgh.ed.jp/netiquette/
特に、本やCDなどの著作物を無断で掲載することは、著作法違反になるので注意して下さい。
それでは、今日はここまでです。
ブログを始める時の初期設定は、各サービス(gooブログなど)毎に違ってくるのでここでは説明は省略しますね。各サービスのマニュアルに従って下さいね。
初期設定が終わった方は、早速記事を書いて見ましょう。ここで、記事を書く際の注意点をいくつか教えますね。
1.できるだけテーマを絞って記事を書く。
ブログを多くの人に見てもらいたい場合は、あらかじめ自分の興味のあるテーマを決めておいてから、そのテーマにそったブログにしましょう。
例えば、サッカーに興味がある場合、サッカーをテーマに絞り、作成する記事もサッカーに関したことを記事にしましょう。
なぜテーマを絞った方がよいか?
それはまた後々説明します。
2.ルール・決まりを守りましょう。
インターネットの世界に、「ネチケット」という言葉があります。これは、インターネットのエチケットの略で、インターネット上のルール・マナーのことです。
各ブログサービスに、禁止事項・ルールなどが掲載されているので、記事を作成する前に事前に必ず読んでおきましょう。
「ネチケット」について詳しく知りたい方は、以下のサイトを参考にして下さい。
↓↓↓
http://www.cgh.ed.jp/netiquette/
特に、本やCDなどの著作物を無断で掲載することは、著作法違反になるので注意して下さい。
それでは、今日はここまでです。
2007年10月04日
ホームページ作成講座(入門編) その1
ブログを作成してみよう!
1.ブログとは?
ブログはweb+ログの略で、インターネット上にログ(記録)を簡単に残す事でホームページを作成することができるツールの事です。
以前からホームページを作成したかったけど、難しい事はよく分からないし…という方も、簡単に日記を書くようにホームページを作成することができます。
デザインもマウスで選択するだけ、文章もメモ帳に文章を入力する感覚で作成する事ができます。
2.ブログ作成サービスを選択しましょう!!
ブログを作成するには、プロバイダなどが提供するブログ作成サービスを利用します。どのサービスを利用するか決まっていない方は、以下に大手で無料で利用できるサービスを紹介しますので、参考にして下さい。
Seesaaブログ(管理人が使用しているブログサービスです)
http://blog.seesaa.jp/
Yahoo!ブログ
http://blogs.yahoo.co.jp/
gooブログ
http://blog.goo.ne.jp/
ココログ
http://www.shop0.biz/cocolog/
So-netブログ
http://blog.so-net.ne.jp/
livedoorブログ
http://blog.livedoor.com/
かわいいブログを作成するなら「ヤプログ」
http://www.yaplog.jp/
ドリコムブログ
http://blog.drecom.jp/
FC2ブログ
http://blog.fc2.com/
参考になりましたか?今日はここまでです。
ブログはweb+ログの略で、インターネット上にログ(記録)を簡単に残す事でホームページを作成することができるツールの事です。
以前からホームページを作成したかったけど、難しい事はよく分からないし…という方も、簡単に日記を書くようにホームページを作成することができます。
デザインもマウスで選択するだけ、文章もメモ帳に文章を入力する感覚で作成する事ができます。
2.ブログ作成サービスを選択しましょう!!
ブログを作成するには、プロバイダなどが提供するブログ作成サービスを利用します。どのサービスを利用するか決まっていない方は、以下に大手で無料で利用できるサービスを紹介しますので、参考にして下さい。
Seesaaブログ(管理人が使用しているブログサービスです)
http://blog.seesaa.jp/
Yahoo!ブログ
http://blogs.yahoo.co.jp/
gooブログ
http://blog.goo.ne.jp/
ココログ
http://www.shop0.biz/cocolog/
So-netブログ
http://blog.so-net.ne.jp/
livedoorブログ
http://blog.livedoor.com/
かわいいブログを作成するなら「ヤプログ」
http://www.yaplog.jp/
ドリコムブログ
http://blog.drecom.jp/
FC2ブログ
http://blog.fc2.com/
参考になりましたか?今日はここまでです。



