2007年03月17日

[HTML]ホームページ製作講座イントロ

気を取り直して本日から連載でHTML講座なんてやってみたいと思います。
さて、そもそもホームページを記述する際に使われるHTMLとはなんでしょうか。またよく初心者の方から「HTMLってプログラミング言語とは違うの?」などといったような質問を受けます。
 
『HTML4.01 仕様書邦訳』には
 
地球規模での配信を目的に情報を公開するためには、全てのコンピュータが潜在的に理解可能であるような出版用母語の一種である、世界中で理解される言語が必要となる。World Wide Webで使われる出版言語は、HTML(HyperTextMarkupLanguageの略)である。
 
とあります。つまり、簡単に言うと、ホームページを配信するために、世界中どこに行っても共通なコンピュータ言語がHTMLなのです。HTMLはブラウザ(Internet ExplorerやNetscape Navigatorなど)と呼ばれるソフトによって全て解釈され、視覚的に表示されます。
 
この言語は非常にシンプルで理解しやすいため、初心者の方でも簡単に習得し、ご自分のホームページを作ることができるようになります。以下10回(予定)の講座であなたもHTMLを習得しよう!
まずHTMLと実際に表示されるときの動作を確認するために以下のようなファイルを作って見ましょう。
適当なフォルダもしくはデスクトップにて「右クリック→新規作成(W)→テキストドキュメント」の順番でファイルを作成し、ファイル名:sample.txtとしてください。
(ご使用の環境でファイル名の後ろに.txtなど拡張子が表示されないときは、適当なフォルダを開き、ツールバーから、「ツール(T)→フォルダオプション(O)」を選択し、表示タブから「登録されている拡張子は表示しない」のチェックをはずしOKボタンをクリックしてください。その後ファイル名を変更するときには.(ドット)以下の部分(ここでは.txt)が消えないようにしてください。また設定を戻す際には上の手順をたどりチェックボックスにチェックを入れてOKを押してください。)
ファイルアイコンをダブルクリックして、内容を編集します。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<HTML>
<HEAD>
<META http-equiv="Content-Type" content="text/html; charset=Shift-JIS">
<TITLE>HTMLを使ってみよう</TITLE>
</HEAD>
<BODY>
<!-- ここから本文部分 -->
<H1>連載HTML作成講座</H1>
<P>HTMLはマークアップ記述言語の一種で、
ドキュメントの構造を記述するための言語であるSGMLより派生した。
HTMLはSGMLの特徴である「文章の意味を構造から記述できること」に加え、
文章以外の画像を埋め込んだり、また
<STRONG>外部文章への参照を直接指示</STRONG>
することができます。</P>
</BODY>
</HTML>
これを上書き保存して、ファイル名をsample.txtからsample.htmlに名前を変更してください。
「拡張子を変更すると、ファイルが使えなくなる可能性があります。変更しますか?」の質問にはい(Y)とクリックしてください。ファイルのアイコンが変わったことを確認して、アイコンをダブルクリックしてください。
 
html1.jpg
 
ブラウザソフトが開き、上のように表示されたらお疲れ様でした。表示されない場合は以下のことを確認してください。
ファイル名は合っていますか?sample.txtではなくてsample.htmlと名前を変更したことを確認してください。
内容を全て半角で打ち込んでいますか?スペースを含めて日本語以外の部分は全て半角で打ってください。
 
それでも解決しない場合はコメント欄へ
 
 
 
これだけではまだなにも分かりませんが、次回から順番を追って説明いたします。今はただHTMLファイルとはただのテキスト情報であるということさえ分かっていただければ結構です。
 
 
宿題的なもの。
上のサンプルの日本語の部分をお好きな文章に変えて打ち込み、表示されることを確認してみてください。
サンプルの英字記号部分を全角文字に変えて表示イメージを確かめてみてください。
 
ヒント:htmlを再編集するときにはファイル名を再び.txtに戻し編集するか、IEの場合にはツールバーの「表示(V)→ソース(C)」の順番でメモ帳を開き編集することができます。
posted by ラリコ at 22:48 | Comment(3) | TrackBack(1) | 小技術
この記事へのコメント
ちょっと目を離してた間に一気に記事が増えてる\(^o^)/
HTML講座、勉強させていただきやす
Posted by 毒セレブ at 2007年03月17日 22:50
フフフ、期待を180度裏切る男ラリコさまを舐めるなよ!(ぇ

というか、更新した直後に来るとわwもう雲さんのためにもまじめにやるしか・・・w
Posted by ラリコ at 2007年03月17日 22:54
おぉお、やるね!
こんな感じの内容なら期待が持てそうだ!!
Posted by BIRUGE at 2007年03月18日 00:20
コメントを書く
お名前:

メールアドレス:

ホームページアドレス:

コメント:

認証コード: [必須入力]


※画像の中の文字を半角で入力してください。

この記事へのトラックバック

さーてやる事も無いし
Excerpt: ラリさんのブログにトラバ貼って勝手にHTMLの勉強でもしちゃいますか。 5:03 勉強開始 HyperTextMarkupLanguage・・・この単語すっかり忘れてました。 略すとHTML..
Weblog: 毒セレブログ
Tracked: 2007-03-18 17:08

広告


この広告は60日以上更新がないブログに表示がされております。

以下のいずれかの方法で非表示にすることが可能です。

・記事の投稿、編集をおこなう
・マイブログの【設定】 > 【広告設定】 より、「60日間更新が無い場合」 の 「広告を表示しない」にチェックを入れて保存する。


×

この広告は180日以上新しい記事の投稿がないブログに表示されております。