初めてのホームページ作成（1）
ＨＴＭＬそしてＣＳＳ
色々勉強をしていると、HTMLだけでは思うようなデザインが出来ない事がわかり、CSSSの勉強が始まりまりました。
CSSが又難しい、HTMLも理解できていない状態で、CSSの継承とは、親要素への宣言、子要素への宣言、クラスセレクタ、
IDセレクタ等、それに輪をかけた様に難しいのがボックスモデル(パディング、マージン、ボーダー) ・・・・
これでは64歳の頭ではとてもホームページ作成は無理な様な感じになって来る。ここで悩んでいても仕方ない、
取りあえずは、ウェブに何か参考になるページは無いかと探していたら以下の様なページが見つかりました。
『ホームページ制作に役に立つテンプレートやフリー素材、このテンプレートは、Web標準に準拠したXHTML+CSSでコーディングされています。
色もサイズもご自由にカスタマイズしてお使いください』
早速このホームページよりhtml,CSSのソースをダウンロードし解析を始めました。
初めてのホームページ作成（2）
デザイン考察
HTML、CSSを使いホームページを作ったが出来栄えがまったく良くない、これでは人様に見てもらう訳にはいかない。
それも当然の事で、他社神社のホームページを見ると。
1.境内が広く綺麗で立派な建物が建っており、こういった写真が掲載されている。
2.年間の祭礼・行事など色鮮やかに紹介している。
3.社宝などを紹介している。 etc
最も、日本中に名が知れている神社と比較しても始まらない、しかし見栄えのするホームページは出来ないものか
色々ウェブを見ていると、動画（アニメーションと呼ぶらしい）を使って見栄えを良くしているページがある、調べて見ると
JavaScriptで作られたJQueryと呼ばれるプログラムが動作し、画像をスライドしたり、回転をさせていると言うことが分かりました。
JQuery
JQueryの事を調べて見ると、自分で一から作らなくても、JQueryプラグインとして、プログラムが公開されている物もありこれにより
容易に画像や文字のスライド、画像を瞬時に切り替えるなどが出来ることが分かり、これを使えば変化にとんだ見栄えが良いホームページが、
出来るのではないかと思いJQueryの勉強を始めました。
初めてのホームページ作成（3）
ＦｉｒｅｂｕｇそしてＦｉｒｅＱｕｅｒｙ
JQueryの紹介記事を色々見ていると、これを使えたらと思う紹介記事がウェブにあるが細かい使い方までは詳しく載っていない
詳しい説明はないかと調べると、作成もとは殆どで海外であるため、説明文は英文でかかれており英文もそうだが、 JQueryの動作原理が
まったくわからない、色々調べていると、ウエブに以下の様な記事が見つかりました。
『FireQueryは、Firebugを便利にさせる機能強化アドオンで、Firebugのコンソールで楽々JQueryを使えるようにしたり、
DOM画面イベントがどこについているのかとかを確認することができるようになるツールです。
ただのFirebugでもJavaScriptのデバッグや動作の確認をすることはできたのですが、FireQueryを入れることによって、
jQueryを使ったサイトでのデバッグや動作確認などがものすごく楽にできるようになります』
どうやら現在使っているブラウザ「Mozilla」
にアドオンソフトとして「Firebug 及びFireQuery」を追加する事によりウエブ作成のデバックが容易に出来るらしい、又 JQueryの動作も分かる様である
、早速「Firebug及びFireQuery」をアドオンしJQueryで書かれているページを動作させ、アニメーション部分のコーディング部分を見ると
黄色く表示され、CSS部分の値が変化しているのがよく分かりました、又Firebugを使って色々なホームページを見ると、実際のソースが表示され
どの様に、JQueryを実装しているかが手に取る様に分かる様になりました。
初めてのホームページ作成（4）
JQueryの組み込み
JQueryの組み込みはJQueryのプラグインを紹介しているウェブ
www.htmldrive.net
より、これは面白そうだと思える内容のDemoを見て気に入った物のJQuery,CSS等をDownloadしHtmlに組み込み試行錯誤により動くようにしました。
神社のホームページでは、6種類のJQueryプラグインを使っています、コツが分かると結構簡単に組み込める様になりました、
ただ苦心して動く様にしたのにブラウザにより動かない物もあり特にInternet Explorer通称 IEで動作しないので使用を断念したプラグインもあります、
ちなみに現在動作確認をしているブラウザは「Safari Ver5.1.7,Mojilla Ver12.0,IE Ver9.0.6」です。
JavaScriptを色々な個所に組み込んでありますが、JavaScript未対応ブラウザの対応としては、簡易画面表示をしています。
開発ツール（全てフリーウエア）
Htmlエディタは、ez-HTML（現在これがMain）そしてHeTeMuLu Creator及びMKEditirを使用。
デバッカーは、MozillaのアドオンソフトFirebugを使用、今ではこのソフトが無いとどうにもならない存在になっている。
画像編集ソフトは、GIMPを使用このソフトが無いとホームページ作成は出来ないと言っても過言ではないと思う。
そしてPHPプログラムのテスト用としてXAMPPを使用（詳細は後で説明）
