HTMLを勉強しよう

HTMLを勉強しよう
以前も、ご説明しましたが、HTML言語とは、ホームページ上で文字や画像をどのように表示するか定義するための言葉です。ここでは、HTMLをちょっとだけ、勉強して、楽天の無料テンプレートを、改造してみましょう。具体的には、色の変更と、特殊文字の変更です。 HTML言語を見ただけで、「嫌だ。」と言われそうですが、ちょっと頑張ってみましょう。 1. 楽天無料テンプレートのHTML言語の中身は？楽天無料テンプレートをそのまま使っている方がたくさんいらっしゃいますが、そのテンプレートのHTML言語のポイントの部分を押さえれば、簡単に、改造できます。まずは、テンプレートのHTML言語の中身を見てみましょう。まず、アフィリエイトのTOPページにある、「HTMLテンプレート集」をクリックして、「HTMLテンプレート集」のページを呼び出しましょう。次ぎに、「このテンプレートを使用する」をクリックして、HTMLソースのウィンドウの中身をコピーします。コピーしたら、メモ帳に、ペーストして、HTMLソースを見てみましょう。下記にあるように、HTMLソースの先頭行＜table width…から、＜/table＞までが、「タイトル」を入れるエリアに相当します。ここでは、「色」の設定が、どのようになされているかに、見てみましょう。「色」の設定は、#xxxxxxの6桁の規定された英数字の組み合わせで設定されています。例えば、背景色(Back Ground Color)は、bgcolor=" #ccccff "、文字の色は、font color=" #3366CC "のように設定されます。 2. 楽天の無料テンプレートにて、色の変更「色」の設定は、#xxxxxxの6桁の設定方法以外に、代表的な色については、直接、その色の名前で、設定することができます。代表的な色は、下記のとおりです。先ほどのテンプレートの「タイトル」を入れるエリアが、青色で構成されていたので、上記の代表的な色を使って、赤色の構成へ変更してみましょう。いかがですか、明るいイメージが出てきましたね。 3.楽天の無料テンプレートにて、特殊文字の変更次ぎに、「タイトル」を入れるエリアの中の、■の特殊文字へ変更して見ましょう。特殊文字は、たくさんありますが、その中で、代表的な特殊文字としては、・しかく：■□◆◇ ・まる：●○ ・さんかく：▲△▼▽ があります。今回は、特殊文字を、■から●へ変更してみましょう。いかがですか、イメージがちょっと変わりましたね。 4.HTMLの勉強について HTMLの勉強については、まず、楽天から簡単なHTML言語の解説がありますので、覗いて見ましょう。具体的には、楽天広場の「ヘルプ」をクリックすると、楽天広場の「ヘルプトップページ」 http://plaza.rakuten.co.jp/hlp/　へ飛びます。このページの中の、「HTMLタグ解説」をクリックしましょう。「HTMLタグについて」のページが現われて来ますので、ここで、HTML言語について、ポイントが学習できます。なお、このページの最下段あたりで、使用ができないタグの解説がされていますので、興味のある方は、一読されたらよいと思います。正しく、一から学びたいという方は、本屋さんで、「わかりやすいHTMLの入門書」を一冊購入されるのを、お薦めします。以上

HTMLを勉強しよう

以前も、ご説明しましたが、HTML言語とは、ホームページ上で文字や画像をどのように表示するか定義するための言葉です。
ここでは、HTMLをちょっとだけ、勉強して、楽天の無料テンプレートを、改造してみましょう。具体的には、色の変更と、特殊文字の変更です。
HTML言語を見ただけで、「嫌だ。」と言われそうですが、ちょっと頑張ってみましょう。

1. 楽天無料テンプレートのHTML言語の中身は？

楽天無料テンプレートをそのまま使っている方がたくさんいらっしゃいますが、そのテンプレートのHTML言語のポイントの部分を押さえれば、簡単に、改造できます。
まずは、テンプレートのHTML言語の中身を見てみましょう。

まず、アフィリエイトのTOPページにある、「HTMLテンプレート集」をクリックして、「HTMLテンプレート集」のページを呼び出しましょう。
Board-2

次ぎに、「このテンプレートを使用する」をクリックして、HTMLソースのウィンドウの中身をコピーします。
Board-5

コピーしたら、メモ帳に、ペーストして、HTMLソースを見てみましょう。
下記にあるように、HTMLソースの先頭行＜table width…から、＜/table＞までが、「タイトル」を入れるエリアに相当します。
ここでは、「色」の設定が、どのようになされているかに、見てみましょう。
「色」の設定は、#xxxxxxの6桁の規定された英数字の組み合わせで設定されています。例えば、
背景色(Back Ground Color)は、bgcolor=" #ccccff "、文字の色は、font color=" #3366CC "のように設定されます。
Board-7

2. 楽天の無料テンプレートにて、色の変更

「色」の設定は、#xxxxxxの6桁の設定方法以外に、代表的な色については、直接、その色の名前で、設定することができます。代表的な色は、下記のとおりです。
ClipBoard-1

先ほどのテンプレートの「タイトル」を入れるエリアが、青色で構成されていたので、上記の代表的な色を使って、赤色の構成へ変更してみましょう。
いかがですか、明るいイメージが出てきましたね。
ClipBoard-3

3.楽天の無料テンプレートにて、特殊文字の変更

次ぎに、「タイトル」を入れるエリアの中の、■の特殊文字へ変更して見ましょう。
特殊文字は、たくさんありますが、その中で、代表的な特殊文字としては、
・しかく：■□◆◇
・まる：●○
・さんかく：▲△▼▽
があります。
今回は、特殊文字を、■から●へ変更してみましょう。
いかがですか、イメージがちょっと変わりましたね。

ClipBoard-9

4.HTMLの勉強について

HTMLの勉強については、まず、楽天から簡単なHTML言語の解説がありますので、覗いて見ましょう。具体的には、楽天広場の「ヘルプ」をクリックすると、楽天広場の「ヘルプトップページ」 http://plaza.rakuten.co.jp/hlp/　へ飛びます。
このページの中の、「HTMLタグ解説」をクリックしましょう。
ClipBoard-7