新学期特別編:ホームページ作成に関するページ

 岩手県立大学ソフトウエア情報学部 市川 尚

 

はじめに


 今回は新学期特別編の第3弾といたしまして、ホームページ作成に関するページを紹介します。本書を購読しておられる方々も、ホームページを見るだけに留まっている人が多いかと思います。新年度に入って新しいことに何かチャレンジしてみようと思っている方は、ホームページ作成に取り組んでみるというのはいかがでしょうか?
ホームページを作成すると言っても、学校のホームページである必要はなく、例えば個人的なページとして、日常の身近な話題や、趣味の話、日記などを載せたりと、簡単なところからはじめてみるのがよいでしょう。そういった方々を支援するために、いちからホームページを作るためのガイドが載っているページや、ホームページの基本であるHTML言語のマニュアルが公開されているページなどが公開されています。ホームページのことは、ホームページに聞けばわかるというわけです。ホームページ上で扱う画像をフリーで提供してくれているところもあります。また、関連するところとして、前号ではWebゼミナール(http://www.docan.co.jp/~websemi/)を紹介しました。
もちろん、すでにホームページを持っている皆さんにとっても、さらに充実したホームページを作っていくためのヒントがWeb上に公開されています。ホームページをよりインタラクティブにしていくための仕掛けを紹介しているページや、HTMLのタグをチェックしてくれるページ、良いページにしていくためのヒント集など、いろいろあります。
教育用のホームページを作りたいという方は、技術的な側面だけでなく、どんな内容を発信し、どうホームページを活用してくかが大きな問題となりますが、今回は作るという技術的なことだけに焦点をあてて、ホームページを紹介していきます。

 

ホームページ作成ガイド・リファレンスマニュアル


 ホームページ作成について、いちからアドバイスしてくれたり、HTMLタグのリファレンスマニュアルが提供されていたりと、ホームページ作成の話題を統合的に扱っているホームページがあります。
●「とほほのWWW入門」(http://wakusei.cplaza.ne.jp/twn/www.htm;図1)は、ホームページ作成の方法が、非常にわかりやすく解説されています。まったくの初心者のためには、いちからホームページの作成をガイドする「ホームページ入門」があり、準備段階から公開までを扱っています。HTMLの基礎もここで学ぶことができます。その他にも、画像をホームページ上に載せるための「画像入門」や、ページに色をつけるための「色入門」、HTML言語をリストした、「HTMLリファレンス」などがあります。その他、応用編にいたるまで、ホームページについて知りたいことは、ほとんどここだけで間に合います。「用語集」も用意されていますので、この本稿で何かわからない言葉があったときは、調べてみるとよいでしょう。
●「初めてのホームページ作成講座」(http://www.hajimeteno.ne.jp/;図2)
 導入編から、基礎編、応用編と段階にわかれています。初心者の方は導入編を見れば、ホームページ作成に必要なことやその手順がわかります。解説の中では、作成に利用するソフトが紹介され、ダウンロードできるページへリンクがはられており、何も準備していない人は便利です。このページにも、HTMLリファレンスが提供されていますが、さらに初心者向けに「逆引きHTMLリファレンス」が用意されており、やりたいことがわかれば、該当するタグを見つけ出すことができます。リファレンスをオフライン用にダウンロードすることもできます。応用編には、「i-mode専用HTMLリファレンス」として、今話題のi-mode用のページ作成方法も解説されています。ホームページ作成ソフトの比較表も載っており、ソフト購入の参考になります。

 

ホームページ作成支援ソフト


 これまでの連載で紹介済みのソフトをダウンロードできる「窓の杜」(http://www.forest.impress.co.jp/)や「Vector」(http://www.vector.co.jp/)などでは、ホームページ作成を支援するためのソフトが多数公開されています。ホームページ作成エディタとして、HTMLタグをクリックひとつで埋め込んでくれるものや、色の選択を支援してくれるもの、画像を作成するものなど、実に多種多様です。
 最近では、ホームページ作成ソフトのおかげで、ホームページはHTMLを知らなくとも、ワープロ感覚で作成できるようになりました。筆者は、ホームページ作成ソフトが、あまりにも複雑なタグを生成するために、ずっとテキストエディタでHTMLを書いてホームページを作成してきたのですが、最近はDreamweaverを利用するようになりました(かなりきれいなタグでHTMLファイルを生成してくれます)。こういった作成ソフトはかなりの数が出ており、例えばNetscapeにはComposerという作成ソフトが最初から付属しています。また、最近のワープロソフトには、HTML変換機能などが付いています(見るに耐えないタグを生成するようですが)。
このようにホームページはHTMLを知らなくてもできるようにはなってきましたが、基本であるHTMLを知った上で(どうしてホームページが表示されるのかの仕組みを知った上で)利用してほしいところです。

 

ホームページ自動作成


 ホームページ上で、データを入力するだけで、自動的にホームページを作ってくれるところがあります。
●「3分間Homepage Cooking」(http://www.mthouse.com/home/3hp.html;図3)では、「プロフィール編」や「就職活動編」などの用途に応じたページを、ページ上からいくつかの項目に従ってデータを入力したり(ページのタイトルなど)、画像を選択したりするだけで、自動的に作成してくれます。その作成されたホームページを自分のところへ保存する方法も解説されています。ホームページの入門として、一番最初に試してみるのもよいかもしれません。

 

素材集


 パソコン上では、比較的簡単にイラストなどの画像を作ることができますが、そういうものを作成することが苦手な人も多いと思います。近年、パソコン上で何かもの作りをするときに、よく利用するのがフリーの素材集です。最初からできあがっている素材を選んで利用しながら、ホームページを作っていくことができるのです。幸いにも、こういったフリー素材集が、ホームページ上ではたくさん公開されています。しかし、素材の利用に溺れて、肝心の内容の部分がまったくないなんてことのないように気をつけましょう。また、素材集のページの利用上の注意をよく読んでから使用するようにしましょう。
●「エム・エー ファクトリー」(http://www.ma-fa.com/;図4)では、ボタンや背景、アイコンの画像や、花の写真など、3700個以上ものフリー素材が提供されています。ホームページで使用する場合は、無料で使用できるそうです。ここで公開されている画像をそのまま、自分ホームページに即利用することができます。
●「牛飼いとアイコンの部屋」(http://www.ushikai.com/;図5)では、「Free Graphics」として、ホームページ上で使えるアイコンが公開されています。「テーマの部屋」では、秋やクリスマス、年賀など季節にかかわるアイコンや、妖精の国や銀河鉄道など、独特のテーマに沿った素材が提供されています。なかなか他では手に入らないようなアイコンが多いです。また「夜のアイコン」などは、雰囲気が出ていてとてもきれいです。ちょっとしゃれたページを作りたいときにおすすめです。


HTML検証器


 ホームページを作った後に、HTMLの文法がきちっとなっているかなどをチェックしてくれるホームページがあります。間違っているところを指摘してくれるので、便利です。初心者向けというよりは、どちらかというと玄人向けと言えます。
●「Another HTML-lint gateway」(http://openlab.ring.gr.jp/k16/htmllint/htmllint.html;図6)では、自分のページのURLを指定したり、HTMLを入力することによって、HTMLの文法をチェックし、採点してくれます。チェック項目は好みでカスタマイズすることができるようになっています。項目はかなりの数に上っており、かなり詳しい部分までチェックし採点してくれます。
●「Doctor HTML」(http://www2.imagiware.com/RxHTML/)は、合計のファイルサイズや速さ、リンクのチェック、英語のスペルなどを自動解析してもらえます。

 

ホームページにいろいろな仕掛けをつくる


 普通のホームページではあきたらなくなって、ページにインタラクティブな仕掛け、たとえば掲示板などを設置したいと思ったときなどに、その方法を解説していたり、フリーのプログラムを置いているページがあります。
●「ネットサーフレスキュー[Web裏技]」(http://www.rescue.ne.jp/;図7)では、アクセスカウンタや掲示板など、CGIが多数公開されています。利用規定をよく読んでから利用するようにしましょう。豆知識として、CGIに関わる情報も載っています。
●「一撃必殺JavaScript日本語リファレンス」(http://www.shiojiri.ne.jp/~openspc/JavaScript/index.html;図8)は、JavaScriptの「リファレンス」や、実際のプログラムや使用例が載っている「ライブラリ」などが充実しています。逆引き辞典やその他の解説も多数用意されています。

 

良いホームページを作る


 ホームページをどのように作っていったらよいのか、どのように宣伝していったらよいのかなどを解説しているホームページがあります。昔からホームページに重い画像を載せると待ち時間が増えて、見る人がいらいらするから駄目だと言われてきましたが、それだけではありません。そういったヒントを公開しているホームページを紹介します。
●「アクセス向上委員会」(http://www.access.or.jp/;図9)では、「アクセス向上の100の方法」として、サーチエンジンの登録などの宣伝の方法や、訪問者に良い印象を与えるためのホームページ作りの方法など、さまざまな方法が紹介されています。
●「間違いだらけのHTML書法」(http://hp.vector.co.jp/authors/VA000199/html/html.html;図10)では、「<img>にはwidthとheightを指定しよう」など、ホームページを作る(HTMLを書いていく)上での注意事項が載っています。

自薦・他薦のホームページ募集中!(次回から紹介を再開予定)ichikawa@soft.iwate-pu.ac.jpまで。
ホームページ紹介記事バックナンバーhttp://www.iwate-pu.ac.jp/home/ichikawa/new/

図1 とほほのWWW入門
図2 初めてのホームページ作成講座
図3 3分間Homepage Cooking
図4 エム・エー ファクトリー
図5 牛飼いとアイコンの部屋
図6 Another HTML-lint gateway
図7 ネットサーフレスキュー[Web裏技]
図8 一撃必殺JavaScript日本語リファレンス
図9 アクセス向上委員会
図10 間違いだらけのHTML書法


Return to:
  ホームページ紹介バックナンバーリスト


ichikawa@soft.iwate-pu.ac.jp