岡崎ガイドに投稿する記事を書く時の注意点

by デクラン・マーフィー


記事を書いて投稿するためには、まず正しい情報を集めることが必要です。そしてそれを記事にしてHTMLファイルで書き上げるには、30分もあれば充分だろうと思います。基本的にはそれだけの作業に対して、編集部では3000円の謝礼金をお渡ししています。もし始めから編集し直す必要がある場合には、その点で減額されますし、内容が良く、後はサイトに載せるだけという状態の場合には金額が上乗せされます。ここでご紹介する注意事項を守って頂ければ、HTMLファイルを作るのはとても簡単なことです。誰にでも快適で見易く(特に軽さの点において)、維持管理し易くするために必要な注意点ですから、是非守って下さい。

題材はどんなものが良いでしょうか?

YAMASAの学生の皆さんや、岡崎に住む外国人の方々にとって役に立つ岡崎情報であれば、題材は何でも構いません。
つまり、既にホームページに掲載してあるカテゴリーに新しい情報を追加する(例えばレストランの項目の中に、自分のお勧めレストラン情報を加えたい場合)のはもちろん、全く新しいカテゴリーを自分で作ることも可能です。いずれにしても実際に作業に取り掛かる前に、まず最初にテーマをガイドブック担当までメールでお知らせ下さるか、あおいホール1階の国際部オフィスにお立ち寄り下さい。編集部がOKを出せば、すぐにでも作業に取り掛かって頂くことが出来ます。

手配写真−この顔にピンと来たら・・・ そうは言っても、HTMLの書き方が分かりませんが・・・

心配ご無用。とても簡単です。少なくとも編集部が希望しているものは、とても簡単です。

デクランのHTML5分講座

とりかかりはとても簡単です。

デクラン・マーフィーはとても醜いガイジンです。

つまりこれだけ入力できれば、もうあなたは正しいHTMLファイルを書くことができたも同然です。まず、これをテキストエディターで入力して下さい。もしYAMASAの日本語OSパソコンを使っているなら、「メモ帳」が使えます。「メモ帳」は「スタート」⇒「プログラム」⇒「アクセサリー」⇒「メモ帳」と進めば見付かります。そして、今書いたものを「index.html」という名前でディスクに保存します。これだけで、既にウェブサーバーに送ることができるHTMLファイルがひとつできあがったも同然です。それは、YAMASAのサーバーで保存できるものですし、Netscape Navigatorであろうと何だろうと、インターネット上で見る事ができるもので、サーチエンジンに登録して検索対象になるものです。どうですか?HTMLファイルを作るのはとても簡単なことです。ですから、謝礼金の金額は、自ずと内容次第ということになってきます。

例1:もし何か強調したい部分があって、例えば例文の「とても」の部分をイタリック体にしたければ:

デクラン・マーフィーは<I>とても</I>醜いガイジンです。

とします。HTMLとは、Hypertext Markup Languageの頭文字を取ったもので、上の例の場合、<I></I>の記号のことを差します。<I>の記号が、ブラウザーに、それ以降の文字をイタリックにしなさいという指示を与えます。</I>の記号は、<I>の命令をここで終了しなさいという指示を与えます。 HTMLには、数十種類のこの様な記号があります。HTMLを覚えるのに最も良い方法は、自分が気に入ったサイトを訪れて、そのソースコードを開いて見てみることでしょう。私自身は、ほとんどの場合そうやって身に付けました。

文章の整え方

記号を使って指示を与えたら、その指示を終わらせたい所で必ず「指示の終了」を指示しなければなりません。つまり、「ここからイタリック」という記号と「ここまでイタリック」という記号の両方が必要となります。また、異なる意味を持つ記号を重ねることもできますが、後から与えた指示を先に閉じます。例えば、<B>太字</B>と <I>イタリック</I>を同時に使う場合を見てみましょう。
デクラン・マーフィーは<B><I>とても</I></B>醜いガイジンです。

もし</B>で太字にする指示を終了しなかったら、それ以降は全て太字として表示されます。その他の記号としては、改行のためには<br>、1行空けて段落を変えるためには<P>などが有ります。

ここに岡崎ガイドへの記事を例にして、ソースコードの書き方例を示してみます。


  <html>
  <head>
  <title>ここに記事全体のタイトルを書きます</title>
  </head>
  <body bgcolor=white text=black>
  <h2>ここにも記事全体のタイトルを書きます</h2>
  by ご自分の名前
  <hr>
  ここに導入部を簡単に書きます。
  <a href="declans_mugshot.jpg">
  <img hspace=5 vspace=5 align=right HEIGHT=134 WIDTH=179 src="declans_mugshot_smallsize.jpg"  
  ALT="画像に関する注釈を書きます (写真:自分の名前←もし必要なら)">
  </a>
  <h3>最初の章のタイトルを書きます</h3>
  本文を書いて下さい。何でも結構です。ただし、
 「デクラン・マーフィーは<B><I>とても</I></B>醜いガイジンです。」
  はもうこの辺で勘弁して下さい。
  <p>
  段落を変えながら、「粋で才気溢れる」記事を続けて書いて下さい。   
 <h3>第2章のタイトルを書きます(もし必要なら)</h3>
  本文を続けます。そして規定の語数の中で本文を書き上げます。
  <hr>
  <p>
  <center>
  <a href="mailto:guidebook@yamasa.org">感想、苦情、激励、コメント、何でもこちらへ!</a> /  
  <a href="contribute.html">作品投稿のページへ</a>
  <p>
  </body>
  </html>

自分で行う作業は、< >内のソースコードはそのままに、タイトル、本文の文字部分を書くことだけです。それで、おしまい。

初めての時には慣れるのに20分くらい必要かも知れませんが、後はテンプレートを使えば全く簡単です。ただ画像の挿入には、多少難しいところがありますので最後に説明します。デジタルカメラが無い方には編集部で貸し出していますし、画像のサイズの換え方が分からない時には、編集部で代わりに作業致します。ノウハウが分かっているのなら、絶対ご自分でやった方がいいですよ。なぜって?その分もらえる金額が多いのですから。

画像を挿入する方法:

  
<a href="declans_mugshot.jpg">  <img hspace=5 vspace=5 align=right 
HEIGHT=134 WIDTH=179 src="declans_mugshot_smallsize.jpg" 
ALT="画像に関する注釈を書きます (写真:自分の名前←もし必要なら)">  </a>

折角のきれいな写真が周りの本文を押しのけて画面一杯に配置されていては台無しです。また、サイズが大き過ぎる画像を表示するには時間が掛かりますので、サイズが適当でないと、長い待ち時間で読者にストレスを与えてしまうかも知れません。そこで、本文中には小さくした画像を挿入し、そこから拡大写真へのリンクを作る方法が良いと思います。ALT=""の""の間に文字を書いて、画像にコメントを添えることもできます。

画像を小さくすれば、本文は自然にその周りに流れ込むようになり、もし、ダウンロード時間を短縮するために、画像が表示されないように設定してネットサーフィンをしている人が居ても、少なくともどんな画像があるのか、コメントから想像することができます。これで画面全体の表示時間は短くなり、画像を大きくして見たいと思えば、画像をクリックして拡大写真を見る事ができるようになります。

お分かり頂けましたか?ここまでにご説明したことを実際にご覧に入れましょう。実際にブラウザー上でどのように表示されるか確かめるために、ここをクリックして岡崎ガイド・テンプレートをご覧になって下さい。

もちろんもっとたくさんの種類の記号があって、様々な機能があります。しかし、差し当って必要なものはここでご説明出来たと思います。HTML講座にお付き合い下さいましてありがとうございました。それでは皆さんからの記事をお待ちしておりますので、どしどしご応募下さい!!

作品投稿のページへ戻る / 岡崎ガイドブックへ