本文へ移動

【町会でホームページをつくろう!】

ホームページについて

 ホームページ(HP)は、広報誌と違って配布の手間がかかりません。急いで町会の会員にお知らせしたいときなども、HPなら短時間で伝えられる「即時性」があります。日本全国の人に見てもらえる可能性もあります。全く見ず知らずの遠くの人から、「HP見ました」と連絡が来ることもあります。町会の活動を多くの人たちに知ってもらうためにも、私たちは広報誌とHPの特長をうまく使い分けて活用していきましょう。

   ホームページの作成は難しいことではありません。ここでは、もっとも普及しているといわれる「ホームページビルダー」というソフトを紹介します。また町自連では今後、各町会のHP作成や運用等について支援していきたいと考えております。

ホームページを公開するまでの流れ

①契約しているプロバイダにホームページ開設を申し込む。

②「ホームページビルダー」などで、ホームページを作成する。

③作ったホームページを、契約しているプロバイダのWEBサーバーに送信する。

用意するもの

①パソコン
インターネットに接続できるパソコンでホームページを作成します。
②プロバイダから送られてきた、開設や送信のための情報をパソコンにセットします。
 
・URL(町会のホームページアドレス)  http://www.○○○○.jp
・FTPサーバ名(ホストアドレス)
△△△△.co.jp
・FTPアカウント名(ユーザーIDやログイン名)    ●●●●
・パスワード
××××
 呼び名は各プロバイダによって異なりますので、説明書を参照してください。
 
③ホームページ作成ソフト
ここでは「ホームページビルダー」(日本IBM)を使用します。現在はバージョン10 が販売されています。
④ホームページに掲載する文章や画像など。
 

「ホームページビルダー」について

このソフトは作成する人のレベルに合わせて「かんたん」「スタンダード」「エディターズ」の3モードに分かれており、町自連のHPは「かんたん」で作られています。ここでも「かんたん」モードを使用します。

「ホームページビルダー」のインストール

パソコンへのインストールは添付されている説明書に従ってください。セットアップのタイプは「標準」を選択します。

「ホームページビルダー」の起動・終了は、一般的な他のソフトと全く同じです。

ホームページの作成

ホームページビルダーの初期画面です。
「かんたん」モードを選んでOKをクリックします。


 (これ以降表示される図は、パソコン画面を縮小表示したものですので、少し見にくいですがご了承ください)

サイトの作成

プロバイダのサーバー上にホームページのファイルを置く場所(フォルダ)をサイトといいます。ホームページビルダーでは、パソコンの中に作成したホームページのフォルダもサイトと呼んでいます。
サイトを作成すると、更新作業やウエブサーバーにファイルをサイト単位で転送するときなどに便利です。
「サイトを作成する」をクリックします。
右の画面でサイト名を入力します。
サイト名は公開したときに、他の人に分かりやすいものにしておきます。
ここでは仮に「八王子ふれあい町会」としておきます。
このあと、トップページのファイル名や作成先フォルダの指定画面などが出てきますが、画面の指示に従って入力を進めてください。
なお、トップページのファイル名はプロバイダによって決められています。
右が「どこでも配置」モードの ページ編集画面です。
「どこでも配置モード」モードは その名のとおり、文字や画像を ページのどこにでも自由に配置 できるので、初心者に優しい モードです。
左上の「文字の挿入」をクリックして、ページに文字を入力していきます。

文字の入力

ページの適当な場所に自由に文字を入力します。
文字の大きさや太さ、色、書体などの変更は、変えたい文字を選択しておいて、上部のツールバーの赤枠で囲まれた部分をクリックすれば変更できます。
右の画面では、一番下の文字が選択されている状態です。

ロゴの作成

ページのタイトルを作成します。
赤枠内の「ロゴ(飾り文字)の挿入」をクリックすると「ロゴの作成」という画面表示が出ます。
「文字」の部分に「八王子ふれあい町会」と入力します。
文字の大きさはスライダーを左右にドラッグして調整します。
ロゴの中から適当なものを選んでクリックし、下のプレビューで確認し、良ければ「完了」を押します。
ロゴが作成されました。
作成したロゴはいつでも変更出来ます。
ロゴを選択して右クリックし、「ロゴの編集」をクリックすると、上記「ロゴの作成」画面が表示されますから、そこで修正します。

写真の挿入

ページに写真を挿入してみましょう。
「ナビメニュー」の「画像ファイルの挿入」をクリックします。
メニューが出ますので「素材集から」をクリックします。
この時「ファイルから」をクリックすると、パソコン内にある画像を挿入できます。
「素材集から開く」という画面表示が出ますので「写真」をクリックし、pla049という花の写真を選んで「開く」をクリックします。
花の写真が挿入されました。
写真の四隅の四角い部分を
ドラッグすると、写真の大きさを変えることが出来ます。
また、写真は画面のどの位置へも自由に移動が出来ます。

写真だけでなく、イラストなども自由に挿入することが出来ます。

また、挿入した写真は色々と加工が出来ます。写真上で右クリックし「画像の編集」を選んで加工・修正します。

壁紙の挿入

右の画面はページの背景に壁紙を挿入したものです。
「ナビメニュー」から「壁紙の挿入」をクリックし、「素材集から」をクリックすると、色々な壁紙が表示されます。好きなものを選んで「開く」をクリックすると、背景に挿入されます。
右の画面は挿入した後に「プレビュー」で見たものです。

リンクの挿入

ページにリンクを張ると色々なページに飛んで新しいページを見ることが出来ます。
ホームページの大きな特長です。
リンクは「ナビメニュー」の「リンクの挿入」からも設定できますが、ここでは次のようにします。
リンクを張りたい文字列を選択し、右クリックします。
「リンクの挿入」をクリックすると
右画面のような「属性」表示が出ます。「ファイル名」の欄に
リンク先のページのファイル名を入力します。
通常は「参照」をクリックし、表示されたファイル名の中から、目的のファイルを選びます。
リンクが張られると、通常特に設定を変更していない場合は、リンクを設定した文字は青色に変わり、下線が引かれます。
右画面の赤枠内を見てください。

試しに、赤枠内の文字にマウスのポインタを合わせてみてください。ポインタが手のマークに変わって、リンクが張られていることが分かります。
クリックするとリンク先のページへ飛びます。

表を作成する

「ナビメニュー」の「表の挿入」をクリックします。
右のような「表の挿入」が表示されるので「表のサイズ」で行数と列数を指定し、「表のデザイン」の「スタイルセット」から好みのデザインを選びます。
「OK」をクリックすると、表の枠が画面に表示されますので、表を適当な場所に移します。
表の中に文字を挿入します。
表の中に文字を入力して、表が完成しました。
表は枠を見えないようにすることも出来ます。
表は本来、データを整理するものですが、標準モードでホームページを作成するときは、画面の好きな場所に文字や画像を配置するために利用されることも多いのです。

WEBサーバーへの転送

作成した各ページはプロバイダのサーバーへ転送して、初めてホームページとして見ることが出来ます。

「FTP転送」と呼ばれますが、ここでは説明は省略します。

右画面はホームページビルダーでFTP転送を設定するための最初の画面です。
詳しくは、ホームページビルダーの説明書やプロバイダーの説明書を参照ください。
この画面はホームページビルダーではなく
「FFFTP」というFTP転送専用のフリーソフトの画面です。

FTP転送については、多少のパソコン知識が必要となりますが、説明書をよく読んで実施すれば、難しいことではありません。
画面の左側がパソコン内のサイト、右側が
WEBサイトの内容を示しています。

サンプルテンプレート(ひな形)について

「白紙からページを作るのは面倒…」という人のためにホームページビルダーでは、ホームページのひな形(テンプレート)を多数用意しています。好きなテーマとテンプレートを選び、指示に従って行くと、簡単にホームページが出来上がります。

「スタート」→「ページを作成する」→「サンプルテンプレート」とクリックしてゆくと、右の画面になります。
右の画面は「複数ページのサンプル」です。
テンプレートには、1ページだけのものと、複数ページから構成されたものがあります。
また、「どこでも配置モード」用と「標準モード」用があります。
これは、ページの「デザイン・テンプレート」の画面です。
ページのレイアウトや背景の色、文字色など、好きな画面を選べます。

これらのひな形は、もし好みのものが無かった場合でも、自由にアレンジ出来ます。
白紙から作るのが面倒な方は、ご利用するとよいと思います。
八王子市町会自治会連合会
※2019.3.18に移転しました
〒193-0832
八王子市散田町2-37-1教育センター内
TEL/FAX  042-673-4680
受付日/月曜日~金曜日
(祝・休日、年末年始等を除く)
受付時間/9:00~16:00
3
9
3
4
9
7
TOPへ戻る