HPを作る時のソースに使う言葉

質問

HPビルダーでHPを作っています。その時、ソースというところに表示される
言葉がありますが、HPビルダーを使わなくても自分のHPの更新をソースで
できるように理解したいのですが、あればいったいなんという言葉なのでしょうか。
また、パソコン用語がなかなか覚えられないので、わかりやすく解説していて
実際にどういうふうに記入を変えたらどういう変化があるかなども詳しく書いている
本があれば、教えてください。予算としては2000円くらいまでを考えています。

回答No.6

starflora

ＡＳＰというのは、わたしは初めて聞きます。また、何のことか分かりませんでした。ＡＳＰの説明というのがありますが、これで分かる人は、この説明を読まなくても，ＡＳＰを知っている人だけでしょう。わたしは、「ＡＳＰでないページ」とは、どういうものか分かる気がしますので、そこから、ＡＳＰとは何かという、想像がつきます。

　　しかし、ＨＴＭＬ文のタグを覚えようという人に、ＡＳＰも何もないと思います。ある程度分かってから、その言葉で、こういうことを指していると説明すると分かるのです。JavaScript が何か分からない人に、ＡＳＰを説明しても分かるはずがないとも言えます。

=================================================

　　以下に、ＨＴＭＬタグ、ＣＳＳスタイル・シート、そして JavaScript とは何かを簡単に説明します。この順序で説明するのが合理的だからです。

　　ＨＴＭＬタグは、「テキスト（文章）を飾る指定を行うマーク」です。ＨＴＭＬが、そういう英語の言葉の頭文字なのです（Hyper Text Mark-up Language です）。

　　普通、次のようにワープロやエディターで書くと、書いた通りに見えます：

---------------------------
わたしは月のうさぎよ。
実はセーラームーンなの。
---------------------------

　　ところが、これを、ＩＥ（インターネット・エクスプローラ）などのブラウザーで見ると、次のように見えます：

===========================
わたしは月のうさぎよ。実はセーラームーンなの。
===========================

　　改行がなくなるのです。ワープロなどで、改行していたはずの文章を、そのままＨＴＭＬファイルのなかに書いて、このファイルをブラウザーで見ると、改行マークがなく、文章全部が、繋がって、ひとかたまりに見えます。これでは困るのです。ではどうするかというと、幾つも方法がありますが、一番簡単なのは、<br> という、「改行」指定のタグを使うことです。

---------------------------
わたしは月のうさぎよ。<br>
実はセーラームーンなの。<br>
---------------------------

　　こうすると、ブラウザーで見ると：

===========================
わたしは月のうさぎよ。
実はセーラームーンなの。
===========================

　　こういう風に、改行されて見えます。この改行のタグ <br> が、一番基本的なタグです。次のようにすると、改行だけで、空行を入れることができます：

---------------------------
わたしは月のうさぎよ。<br>
<br><br>
実はセーラームーンなの。<br>
---------------------------

　　これは、二行の文章のあいだに改行タグが二つ入っている訳で、ブラウザーで見ると：

===========================
わたしは月のうさぎよ。

実はセーラームーンなの。
===========================

　　こういう風に、あいだに二行開いて見えます。<br> をたくさん入れると、空行がどんどん増えて行きます。

　　もう一つ、文字の大きさ（サイズ）や、文字の種類（フォント）、文字の色（color）などを指定する、フォント・タグというものを紹介します。

　　普通、何も文字に指定しないと、文字のサイズは３の大きさで、文字の色は黒です。また、文字の種類は、ＩＥだと、「ＭＳ Ｐゴシック」という文字タイプ（フォント）になります。これを、デフォルト・フォント、デフォルト・サイズ、デフォルト・カラーとも言います。予め決まっているフォント、サイズ、色という意味です。

　　ここで、上の「わたしは月のうさぎよ。」という文章（テクスト）のなかの「月のうさぎ」だけを強調するため、赤い色の文字にしようします。この場合、

---------------------------
わたしは<font color="#ff0000">月のうさぎ</font>よ。<br>
---------------------------

　　こんな風に、<font color="#ff0000">と</font> で強調したい「月のうさぎ」を挟むと、次のようになります：

===========================
わたしは月のうさぎよ。
===========================

　　ここでは分かりませんが、ブラウザーで見ると、「月のうさぎ」の部分だけが、赤い色の文字になっています。この<font ……> と </font> は、前者を「開始タグ」、後者を「終了タグ」と言って、何時も対にして使います。これは、ある場所から、ある場所までの文字テクストに、ある指定をしたい場合に使うので、指定を始める位置と、終わる位置を決めなければならないので、指定開始位置に、開始タグを使い、指定終了位置に、終了タグを使うのです。

　　<br> のように、改行を指定するようなタグは、単独で使えます。また、開始タグが、<abcd ……> という形だと、終了タグは、</abcd>とう風に、頭にスラッシュ（／）を入れた形になっています。タグはすべて、半角英数文字で書きます。

　　「月のうさぎ」を、色、サイズ、文字の種類の三つについて一度に指定するには、フォント・タグを使って次のようにします。サイズは、デフォルトの３より一つ大きい４にし、文字の種類は、「ＭＳ Ｐ明朝」というものにします。（文字の種類は、自分のコンピュータにその種類の文字が、インストールされていなければ、指定しても出てきません。「コントロール・パネル」の「フォント」で見ると、どういう文字が入っているか分かります）。

---------------------------
わたしは<font face="ＭＳ Ｐ明朝" size="4" color="#ff0000">月のうさぎ</font>よ。<br>
---------------------------

　　これも、この画面では分かりませんが、ブラウザーで見ると、「月のうさぎ」の部分が、ＭＳ Ｐ明朝という、明朝文字に変わっていて、文字のサイズが少し大きくなり、色は赤くなっているのが分かります。

　　文字の種類（フォント）の指定は、face="" という指定のなかで、フォントの名を入れて指定します。サイズは、size="" のなかに、サイズの数字を入れます。色は、color="#" の # の後に六個の英数字を入れます。この六個の英数字で、どういう色になるかは、カラーチャートというものが普通、ＨＴＭＬタグの参考書には、あります。色が出ていて、この色は、#40a8dd などと表示されています。他に、color="red" というような、色名指定というのもあります。（size="4" でも、size=4 でも構いません。"" は、指定をはっきりさせるために使っています）。

　　文字を強調するため、「太文字（ボールド）」にするには、<b>と</b> ではさみます。また「イタリック体」にするには、<i>と</i> ではさみます。

　　これらが、ＨＴＭＬタグの一番基本的なものです。ＨＴＭＬでは、他にテーブルとかフレームというようなものも指定できます。これらの指定には、一定の規則があって、学習しないと分かりません。

=================================================

　　以上が、ＨＴＭＬタグの例ですが、スタイル・シート（ＣＳＳ）というのは、ある意味、ＨＴＭＬタグの指定を、もっと細かく、拡大して指定できるようした「スタイル指定言語」だとも言えます。例えば、文字の大きさは、ＨＴＭＬタグでは、七種類しかありません。１，２，３，４，５，６，７または、－３，－２，－１，＋０，＋１，＋２，＋３の七種類の大きさしかありません。ところが、スタイル・シートでは、もっと沢山の文字の大きさが指定できます。文字の位置の指定も細かくできます。無論、文字の色や、種類やサイズなどの指定もできます。

　　ＨＴＭＬタグの指定機能を大きく拡大して柔軟にしたのが、スタイル・シート指定言語だとも言えます。

　　ＨＴＭＬタグも、スタイル・シートも、実は、或る意味、一種の「プログラム言語」だとも言えます。一種のプログラムなので、ＨＴＭＬのタグの列などは、スクリプト（文字列）とも言います。

　　ある部分の文字の色を赤にして、サイズを大きくして……というような、「命令」を、実現するのが、ＨＴＭＬタグですから、これは、命令を実行するプログラムでもあるのです。

=================================================

　　JavaScript は、純然たるプログラム言語になります。ＨＴＭＬやスタイル・シートに混じって使える、簡単なプログラム言語だとも言えます（Java というプログラム言語が別にあるのですが、これと、JavaScript は、よく似たコマンド形式で、しかし、全然別のものであるという複雑な関係にあります。別のものだと考えるのが自然です）。

　　JavaScript は、どういう風に使われているかということの説明で、どういうものか、幾分分かります。例えば、あるページを開くと、「おはようございます。今日は１月２３日です。時刻は、午前６時３８分です。」などというメッセージが、文字として出てきた場合、これは普通に、こういう文章を書いてあるのではありません。もし、そうなら、そのページを何時開いても、このメッセージの内容は同じはずです。ところが、こういうページは、開く時間が違うと、「おはよう」が「こんにちは」だとか「こんばんは」に変化します。当然、日や時刻の表示も変わります。

　　これは、JavaScript を使って、プログラムを書いているのです。ＨＴＭＬタグやスタイル・シートでは、こんなことはできないのです。

　　別の例として、あるページを開くと、真ん名に「ようこそ」とだけ書いてあったとしましょう。そこの文字のところに、カーソルを近づけると、カーソルの形が手の形に変わると同時に、今までそこになかった、絵が、文字の下に出現したとします。カーソルを文字のある場所から外すと、また、絵が消えて、文字だけが残るとします。こういうことも、JavaScript でプログラムを書いて行います。

　　（何もしないのに、自動的に色々な絵が次々に出現しては別のものに変わるというのは、「JAVAアプレット」が多いですが、JavaScript でも、簡単なものは、アニメーションという形式を使うとできます）。

　　JavaScript は、あまり派手なことはできませんが、結構、色々なことができます。

=================================================

　　いままで、ＨＴＭＬ文とスタイル・シート、JavaScript の説明をしましたが、これらは、広い意味で「プログラム言語」です。JavaScript になると、いかにもプログラム言語という感じがしてきますが、ＨＴＭＬやスタイル・シートも、広い意味では、プログラム言語です。

　　ここで、最初のＡＳＰという概念との関係がおそらく出てきます。ホームページを造る時には、以上述べた、ＨＴＭＬタグ、スタイル・シート、JavaScript 以外に、「ＣＧＩプログラム」とか、「JAVAアプレット」というものも使います。JAVAアプレットは、Java というプログラム言語で書いたプログラムで、アプリケーション（Application）の小さなものという意味で、アプレット（Applet）と呼びます。ＣＧＩプログラムは、普通、Perl というプログラム言語で書かれていますが、必ずしも Perl とは限りません。ＣＧＩ（Common Gateway Interface）という、サーヴァーのコンピュータとのあいだで連絡を取るインターフェースを介して働くプログラムのことです。言語は Perl が多いですが、言語でＣＧＩプログラムだと決まるのではありません。

　　そこで、こういうことは、あまり、最初の段階で知る必要のないことなのですが（説明を読んでいると、混乱して分からなくなってくるからです）、以上のＨＴＭＬ、スタイル・シート、JavaScript の簡単な説明の上で、説明しますと、次のようなことになります：

　　つまり、ＨＴＭＬタグや、スタイル・シート、JavaScript プログラムは、インターネット上の画面に出てくるので、インターネット上で、こういうプログラムが実行されているような感じに思えるのですが、実は、ＨＴＭＬ、スタイル・シート、JacaScript と言ったプログラムを実行しているのは、そのページにアクセスした時使った、貴方のブラウザーが行っているのです。ブラウザーは、貴方のコンピュータの情報処理機構を利用している訳で、ＨＴＭＬタグの見え方が、ＩＥとネットスケープで違うというのは、ＨＴＭＬの解釈を、貴方のブラウザーが行っているからです。

　　ブラウザーは、htmlファイルをダウンロードして来て、「インターネット一時ファイル」というところに置き、このhtmlファイルの文字テキストや、ＨＴＭＬタグやＣＳＳ指定や、JavaScript を読んで、自分でプログラムを実行し、そういう画面をローカルで、つまり、貴方のコンピュータのなかで、造っているのです。だから、JavaScript で表示される時刻は、貴方のコンピュータの内蔵クロックの時刻が出てきます。内蔵クロックが狂っていると、狂った時刻が、JavaScript で画面に出てきます。

　　しかし、上のＣＧＩプログラムなどの場合は、プログラムは、貴方のブラウザーやコンピュータが実行するのではなく、ホームページが置かれているサーヴァーのコンピュータ（普通、ユニックスＯＳのコンピュータです）が実行します。つまり、オンラインでプログラムが実行されているのです。

　　ＨＴＭＬやスタイル・シート、JavaScript は、ローカル（貴方のコンピュータ）でプログラム処理が行われているに対し、ＣＧＩプログラムは、オンラインで、サイトのサーヴァーのコンピュータが処理します。だから、こういうプログラムを使っているページを、ＡＳＰ（Active Server Page）と呼ぶのでしょう。普通のページは、サーヴァーのコンピュータは、内部で、プログラム処理などはしていないのです。アクセスして来た人に対応する簡単な機械的プログラム処理はしますが、それは、ファイルをアクセスして来た人に渡すだけで、ファイルのなかのＨＴＭＬなどの解読は、ユーザーのローカル・コンピュータが、ファイルをダウンして来て、自分のコンピュータで処理しているのです。

　　掲示板などは、普通、ＣＧＩプログラムで、掲示板を使った場合、そのページは、ＡＳＰということになります（別の場所に掲示板があり、そこへ行く場合は、行った先のページがＡＳＰになっているのです）。また、カウンターも、実はＣＧＩプログラムで、カウンターのあるページは、ＡＳＰだと言えます。

　　しかし、ＡＳＰなどと言うことを、最初から言う必要などない訳です。こんな色々な言葉は、知っている人には便利なのかも知れませんが、知らない人には分からないですし、混乱の元です。また、次々に新しい言葉が出てきますし、最初から、理解できる概念ではありません。

お礼

長々ありがとうございました。

回答No.5

toshi_1919

ASPはActive Server Pagesの略で、HTMLが
ユーザー（クライアント）側の処理をするに対して
ASPはサーバー側で処理をするプログラムです。
JavaScriptなどはユーザーがブラウザー上で行った行為に対して
即座に処理をする。
例えばユーザーが間違った行為をした時にメッセージウィンドウを出したり
などです。
詳しくはホームページ辞典で学習して下さい。
ホームページ辞典は「ＨＴＭＬタグ辞典」＋「JavaScript」＋「スタイルシート」を一つにしたお得版です。

参考URL：

http://www.shoeisha.com/book/pc/dic/index.html

お礼

参考にします。ありがとうございました。

回答No.4

starflora

ソースを開いて見えるのは、普通は、「ＨＴＭＬ文章」です。これは、ＨＴＭＬ文では、タグというものを使い、タグで、文章（テクスト）に飾りを付けたり、大きさや色を指定します。

　　基本は、ＨＴＭＬ文のタグを一定数覚えることです。自分が使いやすいタグを覚えます。本には色々載っていますが、必要なものだけ覚え、後は、必要に応じて勉強して使い方を覚えて行きます。

　　実際には、いまは、ＨＴＭＬ文のタグだけでは、多くのホームページのソースは理解できません。ＣＳＳ（カスケード・スタイル・シート）という、タグの代わりになる記号を使ったり、JavaScript なども使っているからです。

　　けれども、ＨＴＭＬ文のタグを知っていないとどうしようもありません。

　　ＨＴＭＬ文のタグは、タグ辞典という本を買って、後ろの索引から、タグの名前を捜して、どういう風に使うタグか調べます。わたしが使っているＨＴＭＬ文のタグ辞典は、

　　＞「ＨＴＭＬタグ辞典」アンク著　
　　＞株式会社翔泳社（しょうえいしゃ）
　　＞本体定価１５００円

　　です。これは少し難しいですが、本を最初から読むのではなく、タグの意味を調べるのに使います。また、テーブルやフレームを使いたくなった場合は、そこの項目を読みます。もっとやさしい入門書があるかも知れませんが、あるていどレヴェルがないと、参照用として役に立ちません。

　　この本は、基本的に、タグを使ったスクリプト（文字文）が左ページにあり、このスクリプトで、ＩＥ（インターネット・エクスプローラ）とネットスケープでは、どう見えるかの絵が、右ページに載っていますから、どうなるのかが分かります。最初、分からないタグがあるかも知れませんが、分かるところを理解して行くと、段々、以前、分からなかったところも分かるようになります。

　　ＨＴＭＬは、Hyper Text Mark-up Language の頭文字から、こう言います。「普通の文章に飾りを付けて、もっと凄い文章にする言語」というような意味です。

　　あまりに基本的で、タグ辞典には載っていないものもあります。普通の飾りを付けるのなら、タグは、五個から十個ぐらい知っていれば、かなり十分です。テーブルを理解するのに、また五個から十個ぐらいという風に増やして行きます。

　　ソースを見て、分からない記号（タグ）を、ここで追加質問に入れると、回答があると思いますよ。

お礼

ありがとうございました。

回答No.3

madman

HTMLタグについて紹介していてわかりやすいサイトをお教えします。
ホームページ入門と、HTMLリファレンス辺りを参照ください。

参考URL：

http://tohoho.wakusei.ne.jp/www.htm

お礼

ありがとうございました。

回答No.2

mellon

ホームページのソースを一般的には「HTMLタグ」と呼んだりします。
タグの種類もは色々ありますが、ホームページで優しく解説している処もあれば書籍も揃っています。

私が一番重宝しているのは、やはり翔泳社の『HTMLタグ辞典』です。
この出版社からは『HTML…はじめの1冊 HTMLのすすめ』という書籍も出されているのでこちらもよいかもしれませんね。

参考URL：

http://www.ank.co.jp/books/2001/tagjiten4.html

お礼

ありがとうございました。

回答No.1

toshi_1919

こんにちは！

言語はmiyonさんがこの質問をされているところにある
HTML：ハイパーテキスト記述言語です。
それ以外にもASP、JavaScriptなどを組合わせて
作っていきます。

本は定番ですが、翔泳社のホームページ辞典　１９００円
がいいと思います。
一通り基礎の基礎を学習出来ますよ！

補足

ASPやJavaScriptってどういうものですか？