〜WORDで作るHP〜

目次Δ 

序章 〜用意するもの〜

第1章〜フォルダとファイル〜第2章〜ハイパーリンク〜第3章〜ページの中でリンクさせるには〜第4章〜背景の設定〜第5章〜表示とソース(文字化け)〜第6章〜アクセスカウンター〜

序章〜用意するもの〜

HPに必要なものをここに書いておきますのであらかじめ用意しておいてください。

マイクロソフト ワード もしくは ジャストシステム 一太郎

FTP(WSFTP推薦)後に説明します。

第1章 〜フォルダとファイル〜

Δ

では、はじめに「どんなHPを作りたいか」というより

もどうやって作るのかという問題になるわけだです

が前に述べたようにココではWORDを使用します。

とりあえず

マイドキュメントにでも右クリックで「新し

いフォルダ」を作ってください。

そして新しいフォルダ

と書かれている部分を半角で自分の好きな文字を

いれてください。因みに私の場合は「NET」としてい

ます。さて、今度はそのフォルダの中でさらに右クリ

ックの新規作成で

「MICROSOFT HTMLDOCUMEN

T」

を押して新しく作ってください。そしたらフォルダの

中にHTML形式のファイルがひとつだけポツンとあ

るはずです。これをさらに右クリックで

「WORDで開

」を選択します。それを開くと後はよくみなれた形で

すので適当にうちこんでください。それが終わったら

終了はめんどくさいので右端の上のXでも押してくだ

さい。そうすると「これを保存しますか?」と聞いてき

ますので「はい♪」でOKです。その他にも文字形式

などを聞いてきますがこれらもすべて「はい」にしてく

ださい。深く考えなくていいですよ。最後に保存が終

わったらHTML形式のファイルがありますのでそれ

をいつものようにダブルクリックしてください。ちゃん

と残っていればOKです。

  

余談 その他にも直接WORDを開いて編集した後にHTML形式で保存

というところで形式を変換させる方法もありますが私の場合は前者を選びます。

ひととうりのまとめと流れ

マイドキュメントの中で右クリック

新しいフォルダフォルダの中で右クリックHTML右クリック

WORDで開く

編集閉じる注意事項はとりあえずすべて「はい」確認完成

とりあえず今回の講義はココまで♪こんどはハイパーリンクをUpいたします。

 

 

第2章〜ハイパーリンク〜 目次へΔ

今回はハイパーリンクについてお話します♪インターネットをされている

皆さんハイパーリンクはもうご存知ですねココに来る時もそれをクリックし

てページを開いてきたはずです。

さて、その設定ですが、まず2つのファイル(ページ)を用意いたします。そ

してそのうちの一つのファイルにとりあえずリンクとでも入力してください自

分の好きな文字で結構です。では今作った文字のすぐ左から左クリックを

おしたままズズっと右端までずらしてください。そしたらカーソルが変化して

指定された文字を包み込んでいるはずです。それが出来たらその文字を包

み込んでいるカーソルの上で右クリックをしてみてください。切り取りとか、コ

ピーとかメニューが出てきているはずです。それの中心のあたりにアニメー

ション付きでハイパーリンクとかかれたものがあるのでそこを左リクリックして

ください。そしたらハイパーリンクの挿入と書かれたものが出てきます。そのみ

かたですが

今、指定したつまりカーソルで包んだところはクリックしたらどこにジ

ャンプさせますかときいてきています

ので、上の空欄の端にある参照を左クリッ

クしてください。そこで自分のリンクしたいページ(ファイル)をダブルクリックして

ください。そしたらカーソルで包んだ部分(ドラックした部分)が恐らく青く変化し

ているはずです。それでハイパーリンクは完成です。

つぎはページの中でリンクさせるにはというテーマでお話いたします。

つまりこれです→ 

Δ

 

第3章 〜ページの中でリンクさせるには〜Δ

前回に引続き今回もリンクについてですがページの中でリンクさせるには

やり方が若干ことなります。

はじめに

リンクをつけたい場所ではなく、リンクの目的地の方に好きな文字をうちこんでください。

通常のリンクとは逆のやりかたのなってます。

その後、カーソルを操作して文字を包んでください。(ドラックですね)

さて、それができれば次ぎはその

文字をリンクさせたい場所まで

ドラックして、移動させてください。

移動させて目的の場所まできたら

そこでドラックを解除してください。そしたらすぐにメニューが出てきますので

下の方にあるハイパーリンクを左クリックです。そしたらハイパーリンクが完成するはずです。

完成したら

一度そのページを保存してHTMLで開いていつものようにテストしてみてください。

多分、

ジャンプは出来ないはずです。プロキシサーバーがなんとかとかいいながら

難癖をつけてきます。ではどうすればよいかというと、

もう一度ワードで開いた後

そのハイパーリンクを右クリックして

「ハイパーリンクの編集」を左クリックしてください。

そしたら前回説明した通常のリンクの指定画面が現れるはずです。そして一番上の

いつもアドレスを挿入しているところにそのページのアドレスをうちこんでください。

これで行くことが出来るようになります。

次ぎからアドレスの挿入の画面では

表示されることはないのですが、これで再認識させることで出来る

ようになるのです。

第4章〜背景〜

Δ

 さて、これでHPは完成ですが背景がほしいところです。

背景はそのHPの雰囲気作りには欠かせません。

ワードで背景の設定をする場合は

上の欄の書式をクリックしてください。

そしたら

下のほうに背景とありますね。

そこでいろいろ選択するのですがべたな色を選択してみてください。

そのHPの背景が変更されたはずです。これでOKですね。

次、私が作ったHPのようにするには背景を設定したところの

さらに下に塗りつぶし効果を選択してください。そこから自分が

気に入っているがらを選んで背景にしてください。

自分で作った背景を使いたい場合にはがらがある下に

その他のテクスチャを選択して背景をえらんでください。

第5章〜表示とソース日本語化?〜

Δ

今回は表示についてお話しいたします。

皆さんが普通にHPを作っている過程のなかで

上の青のライン上に自分のHPのタイトルではなくURLが表示されてしまい

タイトル(指定の文字)を表示させたい場合とソースを開いたとき

$:ccみたいに

エラーのように表示されるときなどがあって困ってしまう場合や

HPの文章自体がおかしな文字で表現されてしまう場合などが

あるようですがこういった場合の処置をここに書いておきます。

まず

左上のファイルの欄からプロパティを選択します。

その中にタイトルとありますので書き込んでください

多くの人は書き込まずにオートに頼っているはずです。

さらにその下にページを保存するコードとあります。

エラーの多くはここがアメリカ、西ヨーロッパ言語

となっていると思います。

そこを

日本語(JIS)に変更してみてください。

これで正常に動いてくれるはずです。

第6章〜カウンター〜 

Δ

この章に関しては自分がアカウントをとっているプロバイダ

に聞くのが一番だと思いますが、私の表示の方法をとりあ

えず書いておきますのでよろしければ参考にしてください。

まず5章に書いたようにソースを開きます。ソースを開いた

状態でとりあえず一番上に

img src="/cgi-bin/Count.cgi?dd=A|df=メールアカウント.dat"

と入力します。そのあと一度そのHTMLを保存して開きなおす

と一番上に四角い箱ができているはずです。そして左上に表

示できない「x」のマークもあると思います。この表示されたもの

が真四角で大きい場合が多々ありますがそのときは、

WIDTH=120 HEIGHT=30 

にしてみてください。標準的な形

ができるはずです。その他にも

srgb=00FF00prgb=00ffff

で左が内側、右が外枠の色を決めることができます。ここ

は好みのいろに変更してください。これらをひとつにまと

めるを↓のようになります。

<IMG SRC="/cgi-bin/Count.cgi?frgb=7FFFD4|df=メールアカウント.dat|srgb=00FF00|prgb=00ffff" WIDTH=120 HEIGHT=30>

これをそのまま自分のHTMLのソースの中に入れても表示でき

るはずです。なお、メールアカウントはご自分のをお使いく

ださい。

ただしこれはGETEWAYの表示方式ですのでどれにでも

通用するわけではありませんのでご了承ください。

 

わからない点があれば板にでもカキコをお願いいたします

どんな些細なことでも結構ですできる限りのことはさせて

いただきます。

WORDで作るHPの作成法は以上で終了です。とりあえずHP

に最低限必要なものはできたと思います。その他にもCGIや

JAVA・SSIなどを利用したBBSやチャットがありますがそれは

多少複雑な設定をしなければならず(パーミッションなど)初

心者の方にはとりあえずフリーで提供されているBBSなどを

利用することをお勧めいたします。 お疲れ様でした…

                              2000年 管理人・馬の骨03

BACK