スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

勝手にHTML講座 Vol.1 HTMLとは

HTML講座 01 HTMLとは

えーっと勝手に進めさせていただきます。

第一回のテーマ。
「HTMLとは」

少し退屈かもしれませんがまずはこれを呼んでみてください。


HTML とは、 Hyper Text Markup Languageの略。
主にウェブページの記述をするために用いられるプログラミング言語の一種。
電子的方法により送信される文書のことをHyper Textと呼び、その構造を定義づける物として定義される。


はっきりいってこれは読む必要なかったです。
ごめんなさい。
でも次は必要なので「大体」でいいので読んでみてください。


HTMLは、次の形式を主として記述される。
(例)
<a href="http://www.google.co.jp">Googleに飛ぶ</a>
htm01-01



わからない?そうかもしれない。
ここは我慢しよう

HTMLは「タグ」(tag)というものの集まりで出来ています。
「タグ」は、このようにかかれます。

<タグ名 属性名="属性値">タグ内容</タグ名>


タグ名」とは、タグの種類をあらわす名前です。
タグによって意味は違ってくるので。
上の例では、「a」という種類の、「リンクをつくる」タグをさししめしています。

属性」は、「タグ」だけでは表現できないことをあらわすために使われます。
「a」タグにおいて、リンクする先を「href」属性であらわし、属性値に「http://www.google.co.jp」を指定しているわけです。
タグにはそれぞれ指定できる属性が決まっており、またこれはスペースで区切って複数記述することができます。

「内容」は、「タグ」の中身で、タグはこの内容を「修飾」するものとされています。

でそのタグには「開始タグ」と「終了タグ」があり、それで内容が挟み込まれます。
「終了タグ」は、タグ名の前に「/」が入っただけです。
「属性」は、「開始タグ」にはつけられますが、「終了タグ」にはつけることができません。
一部「終了タグ」を持たないタグがありますがそれは別のときに。

ちなみに内容と一部の属性値以外、日本語は使えないので(そりゃ英語圏で作られたから)、
すべて「半角」なのでご注意ください。

でIEとかのブラウザはこういう奇怪なものの集合体を読み取ってごにょごにょしたのを表示しているわけです。
人間と同じです。
見た目にだまされるな、と。

でその奇怪な何かを操ろうとするのがこの講座のやろうとしていること。


じゃあここまで退屈な、実は少し重要な話をしてきたので、
ちょっと実践的なことをやってみましょう。




<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN" "http://www.w3.org/TR/REC-html40/strict.dtd">
<html>
<head>
<title>Hello World!</title>
</head>
<body>
<h1>ハロー ワールド!</h1>
<p>これが見えているかな?</p>
<p><a href="http://www.google.co.jp">検索する</a></p>
</body>





これをそのままメモ帳に貼り付けてください。

メモ帳ですよ!

Wordとかワードパッドとか一太郎とかじゃだめだよ!

※メモ帳がわからない人 [スタート]から[ファイル名を指定して実行(R)]→「notepad」入力&OK で起動可能。
※だいたいアクセサリにある
※Macのひと テキストエディットの[環境設定]→[新規書類]でフォーマットを「標準テキスト」
htm01-02


じゃあそれを貼り付けたら、[名前をつけて保存]してください。
htm01-03


で名前に「test01.htm」と入力して[ファイルの種類]を[すべてのファイル(*.*)]にしましょう。 ここ重要。
保存先はとりあえずデスクトップにでも。
01_04.png



するとデスクトップにこんなアイコンが出現します。
htm01-05


これをダブルクリック。
htm01-06 


htm01-07

こんな風に表示されれば完璧です。

※表示されない人 ファイル名を間違えていないかチェック「test01.htm.txt」「test01.txt」「test01.htn」とか

Hello World!とタイトルに表示されたでしょうか。あと文字は大きくなったりリンクになったりしているでしょうか。

自分で文字を変えてみたりして遊んでもいいでしょう。

ちなみに、Hello Worldというのは、プログラミングを始める際、はじめのプログラムに表示させる、慣例というかそんな言葉です。


今作ってもらったファイルが、HTMLファイルです。

拡張子は「.htm」または「.html

ブラウザで開かれますが、別にネットにあがったわけではありません。

でこんな風に、このサイトも、あの検索サイトも、あの巨大掲示板も、作られているわけです。

但しここで注意しておきたいのは、

HTMLとは、構造を定義する文書」であることです。

文字色の指定なども出来ますが、基本的に「検索」とか「書き込み」とかは、

その「検索」するための「構造」を定義するだけで、「機能」までは定義できない、ということです。

つまりHTMLでグーグ○や2c○は作れないということです。


長くなりましたが、上のことをとりあえず今日は覚えて置いてください。

スポンサーサイト

コメントの投稿

No title

何事も基本からですね!だいたい分かりましたv-290

hello world・・・現代魔法が役に立った
非公開コメント

最新記事
カレンダー
09 | 2017/10 | 11
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30 31 - - - -
月別アーカイブ
カテゴリ
プロフィール

pojime.6654

Author:pojime.6654
特撮に目がないPC中毒者です。
http://anchorage.2ch.net/sfx/

あと最近また変な方向に走っていきそうで…

最新トラックバック
最新コメント
リンク
メールフォーム

名前:
メール:
件名:
本文:

検索フォーム
RSSリンクの表示
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。