2008年04月15日
PHPとは、スクリプト言語のひとつです。
ホームページに埋め込まれたプログラムと考えてくれたらOKです。

似たようなものにJavaScriptがあります。

JavaScriptもスクリプト言語のひとつで、
ホームページを動的に変更したり出来ますが、
JavaScriptはクライアント側で動作するプログラムです。
つまり、閲覧者のパソコンで動作します。

これに対し、PHPはサーバー側で動作するプログラムです。
つまり、ホームページを置いてあるパソコンで動作します。

具体的にどんな事ができるか?
管理人の作ったホームページを見てみましょう。

バスケットボール情報館
http://eleven.huu.cc/top/news/

このホームページでは、
自動的に最新のバスケットボール情報を表示し続けてくれます。

PHPでは、このように動的なページを作成する事が可能になります。
タグ:PHP
posted by ぴろあき at 23:10 | Comment(25) | TrackBack(0) | PHP
2008年03月26日
さて、ホームページを作成しても自分しか閲覧できないのでは意味がありません。

他人にホームページを見てもらう為には、
作成したホームページをインターネット上に公開しなくてはいけません。

そのためには、インターネット上にホームページを保管しておくスペースが必要になります。

このスペースになってくれるのがサーバーです。

ADSLや光など、インターネット接続契約を結んでいる方であれば、
プロバイダのサーバーがホームページスペースとして利用できます。

といっても、プロバイダが提供してくれるサーバースペースでは、
色々と制限も多く、最低限の事しかできません。

例えば、
・容量が少ない
・アフィリエイト禁止
・自作CGI禁止

などです。

プロバイダによって、容量や禁止事項は異なりますので、
まずは自分のプロバイダのホームページスペースを調べてみましょう。

プロバイダのホームページスペースに満足できない。
そもそもプロバイダ契約をしていない

という方も大丈夫。
レンタルサーバーを借りれば問題ありません。

無料のレンタルサーバーもありますよ。
無料レンタルサーバー一覧

ただ、無料レンタルサーバーの多くは、
容量少なかったり、商用利用を禁止していたりする他、
広告が表示されるなどの制約を受ける場合があります。

そういった方は、ロリポップ!などの有料レンタルサーバーを借りましょう。
高機能なサーバーが、月々わずか263円で借りられますよ。


posted by ぴろあき at 14:42 | Comment(0) | TrackBack(0) | 下準備
さて、次はタイトルバーの文字を変えてみましょう。
Windowの左上に表示されている文字の事です。
画面下のタスクバーの中の文字もそうですね。

この文字は、ページの名前を表す重要な文字です。

検索エンジンであなたのページが検索された場合も、
このタイトルバーの文字が表示されます。

ホームページ訪問者が、一目でページの内容を理解できるような文字を付けましょう。
さて、方法ですが、非常に簡単です。

titleタグを使用するだけです。

<title>と、</title>に挟まれた文字が、
タイトルバーに表示されます。

<title>ゼロから始めるホームページ作り</title>
とすれば、ゼロから始めるホームページ作りという文字がタイトルバーに表示されます。

あとは、html文書のどこに記述するかだけですが、
<html>の後、<body>の前です。

<html>
<title>ゼロから始めるホームページ作り</title>
<body>

といった具合ですね。
これだけでも、ちゃんと表示されますが、ちょっとお行儀を整えましょう。

<html>
<head>
<title>ゼロから始めるホームページ作り</title>
</head>
<body>

・・・の様に、titleタグはheadタグの中で使用します。
といって、まだheadタグの意味は分からなくても結構ですよ。

これで、html文書は下のようになりましたね。

<html>
<head>
<title>ゼロから始めるホームページ作り</title>
</head>
<body>
<font color="#8B0000">
Hellow World !!
</font>
<br />
<a href="http://homepage11.seesaa.net/">ゼロから始めるホームページ作り</a>
<br />


<br />
して
みよう
</body>
</html>

ブラウザで開いてタイトルバーを確認してみてください。

タイトルバーの文字が変わっている
posted by ぴろあき at 11:57 | Comment(0) | TrackBack(0) | html
だんだん、ホームページ作りにも慣れてきましたね。

次は改行をしてみましょう。
改行がないと、とても読みにくくなってしまいますからね。

すでにお気付きだと思いますが、
htmlファイルの中で改行をしていても、
ブラウザで開いてみると改行されていないんです。

どうすれば、改行できるか?

改行の方法はいたって簡単!
改行したい位置に<br>を挿入するだけです。

これがbrタグと呼ばれるものです。

今までの、fontタグや、aタグは、
<font></font>の2つがセットになっていて、
この2つに挟まれた文字が、色が変わったり、ハイパーリンクになったりしました。

対して、brタグの場合は、<br>だけで完結してしまいます。
これでは、初心者が見たら</br>を探してしまいそうですね。

そこで、<br />の様に記述しましょう。

細かい事を言うと、自分が書いているhtmlのバージョン(DOCTYPE宣言)によって、
<br>か、<br />か変わってくるんですが、
まぁ、その辺は今のところはいいでしょう。

大抵のブラウザであれば、どちらでも問題なく改行してくれます。

<html>
<body>
<font color="#8B0000">
Hellow World !!
</font>
<br />
<a href="http://homepage11.seesaa.net/">ゼロから始めるホームページ作り</a>
<br />


<br />
して
みよう
</body>
</html>

ブラウザで下のように表示されれば成功です。

改行されているブラウザ
posted by ぴろあき at 11:16 | Comment(0) | TrackBack(0) | html
2008年03月14日
ハイパーリンクを作ろう!

ハイパーリンクとは、
クリックするだけで指定したホームページへジャンプする機能の事です。

例えば、下のようなものです。

バスケ画像&動画倉庫

上のバスケ画像&動画倉庫という文字をクリックすると、
「バスケ画像&動画倉庫」というホームページにジャンプする事ができます。

自分のサイト内をハイパーリンクで結ぶ事で、
ページからページへの移動がスムーズになり、
利用者がより使い易いホームページになります。

では、このハイパーリンクを作成する方法を一緒に学んでいきましょう。

前回、文字の色を変えるのにfontタグを使用しましたが、
同じように今回はaタグというものを使用します。

色を変えたい文字をfontタグで挟んだように、
リンクさせたい文字をaタグで挟みます。

<a>リンクさせたい文字</a>といった具合です。

でもこれだけでは、どこのページにジャンプするのかが指定されていませんね。
そこで、ジャンプさせたいページのURLをaタグ内で指定してやります。

fontタグで、color="green"と指定したのと同じように、
href="http://homepage11.seesaa.net/"と指定してやりましょう。

<a href="http://homepage11.seesaa.net/">ゼロから始めるホームページ作り</a>

これをhtmlファイル内に記述してみましょう。


<html>
<body>
<font color="#8B0000">
Hellow World !!
</font>
<a href="http://homepage11.seesaa.net/">ゼロから始めるホームページ作り</a>
</body>
</html>

このようなファイルを作成したら、ブラウザで開いてみてください。

ハイパーリンク作成後

ハイパーリンクをクリックして、
リンク先にちゃんとジャンプすれば成功です。

勘のいい方ならお気づきかも知れませんが、
</font>や</a>というのは、それぞれのタグの終了を示します。

fontタグで指定した色が有効なのは、</font>タグまでですし、
ハイパーリンクさせたい文字列になるのは、</a>タグまでです。

簡単ですね。
posted by ぴろあき at 13:31 | Comment(0) | TrackBack(0) | html
2008年03月09日
前回、文字に色を付ける方法を習得しました。

けど、あれだけじゃ赤い色しか付けられませんよね?
他の色はどうするの?って話しですよね?

前回、文字が赤くなったのは、フォントタグ内で、
color="red"
と赤い字で文字を書くように指定したからです。

このcolorを色々と変更する事で色々な色を付ける事ができます。

redの他にも、blue greenなどが指定できますが、
それだけでは少し寂しいですよね?

そこで、色見本サイトを利用しましょう。

沢山の色の中から、あなたのホームページに合った色を選択してください。

色の指定はcolor="red"のようにName欄の文字で指定してもいいですし、
color="#FF0000"のようにCode欄の文字で指定してもいいです。

#FF0000というのは、RGBで色を指定する方法です。
#FF0000で赤がFF、緑が00、青が00です。

FFというのは255を16進数で表現したものですが、
これらについても知る必要はありません。

色見本サイトで色を選んだら、
#FF0000の部分をフォントタグのcolorで指定してやると覚えるだけです。

これだけで、あなたの好きな色の文字を表示できるようになりますよ。

試しに、darkredの文字を書いてみましょう。

darkredの色文字

redの部分を#8B0000に書き換えるだけです。

簡単ですね。

こんなような事を繰り返していくだけで、
ホームページなんて完成しちゃうんですよ。
posted by ぴろあき at 14:56 | Comment(0) | TrackBack(0) | html
前回、htmlファイルを作成して、
ブラウザ上にHello, World!と表示する事ができました。

次は文字に色を付けてみましょう。

その前にお行儀を整えます。

htmlタグとbodyタグを追加

htmlファイルをメモ帳で開いて、上図のように、
<html><body>と</body></html>を
Hellow World !!の前後に付け加えましょう。

この<html>などのように < > で囲まれたものをタグと呼びます。

難しくなってきたぞ〜なんて身構えなくても大丈夫。
まだ、意味は分からなくても問題ありません。

次に、Hello, World!の前に
<font color="red">を、後ろに</font>を付けてみましょう。

fontタグを追加

できたら、上書き保存してメモ帳を閉じてください。
htmlファイルを開いてみると・・・。

赤い文字でHellow World !!

赤い文字でHello, World!と表示されれば成功です。

これが <font>タグと呼ばれるもので、
<font>から</font>までの間の文字フォントを変更する事ができますよ。
posted by ぴろあき at 14:10 | Comment(0) | TrackBack(1) | html
ホームページ作りは難しい!

・・・と思ってませんか?

実はホームページは簡単に作れちゃうんです。
ホームページ・ビルダーなんて必要ありません。

無駄なお金は使いたくありませんからね。

では、一緒に作ってみましょう。

まず、作業用のフォルダを作成します。

フォルダ作成

そのフォルダを「HP」という名前にでもしておきましょう。

次に、そのフォルダの中にhtmlファイルを作成します。
テキストドキュメントを作成後、
「index.html」という名前で保存すれば出来ますよ。

htmlファイル作成

拡張子を変更すると、ファイルが使えなくなる可能性があります。
変更しますか?

というメッセージが表示される事がありますが、
「はい」と答えて問題ありません。

この「index.html」がホームページのファイルになります。
まだ、中身が空っぽですので、編集してみましょう。

右クリック→プログラムから開く→Notepadで編集できます。

ファイル編集

メモ帳が開いたら、「Hello, World!」と入力してください。

Hellow World !! 入力

いや、入力する文字は何でもいいんですけど、
新しい言語を習得する時のお約束なんで・・・(^_^;

入力が終わったら保存してメモ帳を終了します。

保存

これで、ホームページは完成です。
ちょっと、お行儀が悪いホームページですが、今はこれでいいでしょう。

「index.html」ファイルをダブルクリックしてください。
先ほど入力した「Hello, World!」という文字がブラウザに表示されるはずです。

Hello,  World!

またメモ帳が開いてしまったよという方、
「index.html.txt」というファイル名になっている事が考えられます。

コチラを参考に、フォルダメニューの
[ツール]→[フォルダオプション]→[表示]から、
拡張子の表示設定を行ってください。
posted by ぴろあき at 09:36 | Comment(0) | TrackBack(0) | html

広告


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

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

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


×

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