| 初めてホームページを作る人のために、対話型で簡単に制作できるツールを準備しているプロバイダーも多い。これは、専門知識なしに制作できてしまうので、初心者にとってはとても有益でありがたいことです。しかし、メンテナンスや拡張を考えると、最低限必要な知識は習得しておく必要があります。 |
|
|
| 基本デザイン | 詳細デザイン |
|---|---|
| 制作するホームページのイメージを創造し掲載するコンテンツを決定します。このサイトの「顔」を作るという観点からとても重要です。イメージが湧かないときは、同様な目的を持つ他のホームページを検索してみてください。ネットサーフィンで、こんなこともできるのか、こういう構成もあるのか、というようにイメージが広がってきます。さしさわりのない範囲で気に入ったページをダウンロードし研究してみるのも有効です。 ・ターゲット： 性別、年代、職業、職種 など ・目的： プライベートな情報配信、ビジネスのプロモーション、アンケートデータ収集 など ・優位性： 他のサイトに無い情報、優れている情報 など ・コンテンツ： 各ページの内容、著作権表示 など ・制作スケジュール： 各ページの制作期間、完成時期、公開時期 など ・制作方法： 完全自作、プロバイダーの開発ツール利用、その他の無料開発ツール利用、委託 など ・開発ツール： ビルダー、ブラウザー、FTP、素材など |
サイトとホームページの全ての仕様を決めます。つまり、サイト設計とＵＲＬ設計を完了します。どのページのどこにどの情報をどんな形式で盛り込むか、いつ更新するかなど、可能な限り詳細に落としてください。行き詰まったら可能な範囲でサンプルページを作成してみることをおすすめします。（通常、インデックスページをプロトタイピングして作成の難易度、容量などを確認してみるとよくわかります。） 次のような項目を決めてください。順序にこだわらず、分かりやすいものからとりかかってみてください。実際には、ホームページ（スタートページ）は、他のページの後で制作するのがよい。 ・ファイル・フォルダ構成： 階層構造、どのフォルダ（ディレクトリ）にどのファイルを配置するかなど ・各ページの設計： ＵＲＬ、フレーム、データ（テキスト・画像など）の配置、プロパティ（色・フォントなど）、フォーム、ハイパーリンクなど ・データ設計： 使用するデータのタイプ・大きさ・長さ・属性（テキスト、画像、認証ページではＩＤ、パスワードなど） |
| データの準備 | HTML文書作成 |
|---|---|
| 必要なあらゆるデータを作成します。本文（テキスト）、画像、ロゴ、ハイパーリンクのＵＲＬ、コンテンツによっては映像や音声も準備しなければなりません。この作業はＨＴＭＬ文書作成と並行して行われるかもしれませんし、その前に行われる場合もあります。例えば、ＨＴＭＬ文書に挿入するファイル名が決まっている場合、ＨＴＭＬ文書は作成できますが、画像の大きさなどは実ファイルを挿入してみないと正確にはわかりません。早期にデータをそろえるとＨＴＭＬ文書の編集時間が短縮できます。次のデータを準備します。
・掲載するデータファイル： テキスト（ｔｘｔ，ｄｏｃなど）、画像（ｇｉｆ，ｊｐｇなど）、サウンド（rm，mp３など）など ・必要な構成部品： ロゴ、ボタン、バナー、背景画像など ・その他の装飾部品： FLASH、GIF Animation など |
ビルダーソフトを使って各ページ（HTML文書）を作ります。文書といってもタグ付きの簡易言語によるプログラム作成です。高機能のビルダーを使用すればプログラムであることを意識せずHTML文書を作成できます。しかし、ビルダーも万能ではありませんので、メモ帳や他のテキストエディターで文書を開き、直接プログラムのステートメントを入力しなければならない場合もあります。また、簡単なHTML文書は、HTML形式をサポートするワープロソフトでも作成できますが、できれば初めから信頼できるビルダーソフトを決めて使い込むこと。 ・ビルダーによる作成： ほとんどのHTMLステートメントをGUIにより作成 ・エディターにより編集： ビルダーでサポートされないタグやコメントの作成、ステートメントをレビューしながら作成 |
| ＣＧＩプログラム | その他のプログラム |
|---|---|
| ＨＴＭＬ文書だけでは実現できない機能（掲示板、チャット、フォーラム、各種申し込みなど）を、ＣＧＩプログラムを使って開発します。サイトで訪問者との双方向のコミュニケーションを実現するためにはＣＧＩプログラムが必ずといってよい程、必要になります。ＣＧＩは、簡単なものでも通常のＨＴＭＬ文書の１０倍以上の制作工数になります。さらに、Ｐｅｒｌ言語の知識を持ち、サーバー側のプログラミング環境にも精通していなくてはなりません。 しかし、最近ではネット上のサイトやインターネット関連の書籍の付録ＣＤ-ＲＯＭなどで、フリーのサンプルプログラムが入手できます。著作権・使用条件に問題が無ければ、専門知識なしでも、それらを利用できるかもしれません。また、大手のプロバイダはよく使われるタイプのＣＧＩプログラムを、あらかじめ提供している場合が多い。 | JAVAスクリプト、JAVAアプレット、スタイルシート、FLASH
などのステートメントを作成し、HTML文書に挿入します。これらのステートメントの作成は、ビギナーには敷居が高いかもしれませんが、最近は、さまざまなサンプルが提供されているので、次のような特性を理解した上で活用してください。 ・ブラウザにより対応が異なる。 ・組み込んだページは重くなる。 ・HTMLビルダーでは、開発できないし、デバックできない。 これらは、あくまでスタンダードなHTML文書の補足として考えるべきである。というのは、動く装飾品の開発にハマってしまい、肝心のHTMLの基本がおろそかになってしまうことがある。こうした傾向は、特に経験の浅いエンジニアやプログラマーによく見られる。 |
| テスト＆レビュー | 更新＆拡張 |
|---|---|
| 完成したファイルをＦＴＰで転送し、実際に稼動させてみます。できれば、回線速度など稼働環境の異なる複数の人にモニターになってもらい、感想や意見を送ってもらいましょう。意外な不具合やパソコンの違いから生ずる予期せぬクレームがあるかもしれません。ブラウザの種類やディスプレィの解像度によっても異なる場合があります。レビュー結果によっては、例えば、画像の一部を別ページに挿入する、フォントサイズを変えるなど、デザインのステップに戻り、修正する。
・パフォーマンスの測定： 表示速度（ｘｘ秒）、ボトルネックのページ・画像 など ・不具合の発見： アドレス・リンク先の間違い、ＨＴＭＬ記述の間違い、音切れ など ・変な表現の発見： ブラウザ・フォント・リゾリューション・ＰＣの種類による違い など ・特殊効果の確認： 個々の特殊効果（GIFアニメ、マーキーなど）が効いているか など |
開設したサイトを新鮮な状態に保つための施策を検討します。サイトに掲載された情報が何も変わらないことがわかると、訪問者が再度訪れることはまれです。常に魅力ある情報が更新されていれば、人々は定期的に訪れるようになります。また、ＨＴＭＬ文書が完成し公開すると、次に、どんな人が訪問者してくれたのか、どのくらいアクセスがあったのかといった管理情報も必要になると思います。情報の一方的な配信だけでは、ＨＰの意義も半減してしまいます。目的に応じて必要な管理情報が収集できるよう機能を充実させましょう。さらに、面倒なファイルの更新についても迅速に行える手段を検討してみましょう。
・メンテナンス・プロシージャの策定： バックアップやアップデートの方法の検討、ファイル・ディレクトリの見直し など ・拡張計画の策定：追加ページ・変更ページの検討、補助機能（統計、アンケートなど）の準備 など |
| ＨＴＭＬとは | ダイナミックＨＴＭＬ |
|---|---|
| ＨＴＭＬは、現在のＷｅｂページを作る際の基本プログラム言語である。プログラム言語とい うよりも、ほとんどテキストを書くような感覚でプロ グラムを組み立てていける、他の言語に比べると極めて簡単なものである。インターネット上のホームページの多くは、ＨＴＭＬをベースに、必要に応じて他のスクリプト（Ｊａｖａ，ＶＢＳなど）を挿入して表示機能を拡張したり、プラグインを呼び出したり、ＣＧＩのようにプログラムの中でＨＴＭＬ文を生成したりして、コンテンツを表示する。つまり、ＨＴＭＬは全てのＷｅｂページの基本となる言語であり、Ｗｅｂ開発者が使用しているビルダーソフトは、このＨＴＭＬ文を開発者に代わって生成する機能を持っている。実際にどのような言語なのかはブラウザやビルダーのソースを表示する機能を使用すれば確認できる。（数多くの文献が出版されている。） | ＨＴＭＬが静的な表現しかできないのに対し、ダイナミックＨＴＭＬは、Ｊａｖａ、ＧＩＦアニメーション、プラグインなどの力を借りずに、ＨＴＭＬだけで動きのあるＷｅｂページを制作しようとする新しい技術である。具体的には、次のような技術の組み合わせである。動きのあるページを作りたいなら、まずダイナミックＨＴＭＬを理解しよう。（ブラウザの種類により表現できないものもある。）
１．ＨＴＭＬ２．スタイルシート（Cascading Style Sheet）制作者の意図どおりに文字や画像を表示させる技術であり、ＣＳＳと呼ばれる。フォント、色と背景、レイアウトに関する設定などが提唱されている。 ３．スクリプトＨＴＭＬの中に埋め込んで実行できる言語であり、Ｊａｖａスクリプト、VBスクリプトがある。 |
| ＨＴＭＬ文書を作るには |
|---|
| ＨＴＭＬ文書（Ｗｅｂページ）は、次のようなツールで作成できる。 １．専用ビルダー（ＷＹＳＩＷＹＧ型） ２．タグ編集型エディター ３．ワープロなど（拡張機能型） ４．プロバイダの提供するサーバー側のツール |
| ３、４を使用すると、驚くほど簡単にＷｅｂページが制作できる。ところがワープロやプロバイダのツールはシンプルなページを制作するには効率的だが、気に入らない部分の微調整や複雑なテンプレートを使用するページには不向きであり、制作者の意図するところを１００％満たしてくれるものではない。１の専用ビルダーで作った表などに関して枠線がどうしても思うように表示されないとか、テキストに関してインデントが思うような位置に挿入されない、といった不満が生じる場合もある。各々のビルダーは万能ではなく、癖もある。同じ表現をしようとしても、生成されるＨＴＭＬ文はソフトによって異なる場合がある。フリーウェアなどの簡易型ビルダーを使用すると、それ以上の緻密な表現法を使いたいと考えても限界がある。さらに高度な表現をしたければ、より高度なビルダーを探してインストールするか、ＨＴＭＬを勉強しソース文に２のタグ編集型エディターなどで打ち込む必要がある。簡易ビルダーのみでＷｅｂページを制作し続けるとタグの知識が習得できず進歩が止まってしまう。制作者の思いどおりのＷｅｂページを制作するには、やはりどこかでタグの打ち込みが必要になる。 ■とほほさんのWWW入門サイト。おすすめ！ ■Webサイトを作るためのHTMLタグを種類別に解説している。 ■ホームページ作成支援siriasu.net 初心者でも分かりやすいサイト。 |
|
|
| 【ＨＴＭＬで色を指定】ＨＴＭＬで使用できる色は、通常制作に使用するビルダーやツールのオプションから指定するため、色名や16進数で入力することはあまりないかもしれない。色名で指定する場合は、VGAパレットに準拠した次の１６色が基本となる。他の色名の指定はブラウザによっては正確に表示できない場合がある。この１６色以外の色を表現しようとする場合は１６進数で表現する。 | ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|
|
|