ページ作成メモ

ほとんどすべてが手作りのパソ研のページ作成のために役立ちそうな事をメモしておこうと思い立ちました。そのうち時間があったらきちんとまとめたいものです・・。とりあえずパソ研でやったこと、質問に出たことなどを中心に書き足していきます。
皆さんのためになりそうなこと、気が付いたことなどありましたらどうぞ教えてくださいね。

パソ研の「ホームページ作成のためのリンク集」、Mac分科会の「ソフトの紹介」もご覧ください。

「Macintoshで作成」--まとめ担当missa

HTML作成に必ず必要なもの
- ブラウザ・・・NetscapeNavigatorなど。
- テキストエディター・・・Jeditが望ましい。SimpleTextでも一応可。
配色を考えるのにあると便利なもの
- HexColor・・ダウンロード
  実際に見ながら色を選んでボタン操作でその１６進数をコピーできる。あとはそれをペーストするだけ。一色（背景色など）を決めてそれにならべてもう一色を選べる。フリーウエア(９８K)。
- （PC、Mac共通の）参考ページ・・ [ZSPC HomePage]のカラーチャート、 [とほほのCOLOR入門]
画像を入れる場合にあると便利なもの
- PixelCat・・画像データビューアーです。
  PICT.圧縮PICT.StartupScreen.BMP.GIF.JPEG(JFIF).LHAで圧縮されたファイル内の画像／テキストなど、様々なフォーマットのファイルを見ることができて、また、JPEG(JFIF).MAG.PICなどに変換して保存することができます。サイズをかえるには手軽。
- JPEGView
- GifScan・・ダウンロード
  GIF,JPEG画像をこのアプリケーションに落とすと、一瞬にして、＜IMG SRC="ball1.gif" ALT="ball1.gif (920bytes)" HEIGHT=16 WIDTH=16 BORDER=0＞
  といったIMGタグを作ってコピーボードにクリップしてくれる。画像のサイズなどの情報も入れてくれるすぐれもの。ただタグを入れたいところにペーストするだけの手軽さがうれしい。 IMGタグの書き方は好みで変えられる。
- GraphicConverter
- GifBuilder・・MacでアニメーションGIFのファイルを作るのに、有名なソフトです。
  その他、背景が透明になるGIFファイルを作るのにも利用させていただいてます。
  操作はとっても簡単で、GIFかPICTでセーブしたファイルをフレームに乗せて、プレビューウィンドを見ながら、付けたいオプションを設定して行きます。
  検索サイトで探すと、取ってこれる場所や使い方の詳しい説明をしてくれているところを探すことができます。
サーバにアップするのに必要なもの
- Fetch・・ダウンロード
- アップ時のお願い・・PCユーザーのためにファイルはJeditで保存する時に改行コードを「CR+LF(DOS)」にして下さい。

「Windows PCで作成」・・・どなたか書いていただけませんか？？？99年9月12日に書きました。mikioです。

HTML作成に必ず必要なもの
- ブラウザ・・・Internet Explorer、Netscape Communicatorなど。
- エディター・・・Internet ExplorerのFront Page ExpressやNetscape CommunicatorのComposerで作成できます。これが一番簡単です。ボタンやチェックボックス等の部品もあります。
- もう少し高度な事がしたい場合には、IBMのHomepage BuilderやMS-Frontpage（MS-Office2000 プレミアムパッケージに入っています）もあります。
- メモ帳やテキストエディタも使えますが、HTMLを自分で打たねばならないので、お奨めできません。テキストエディタとしては、EmEditorや秀丸エディタがあります。窓の杜の［エディタ］にあります。
- ＭｉｃｒｏｓｏｆｔＷｏｒｄ・・・ＩｎｔｅｒｎｅｔＡｓｓｉｓｔａｎｃｅを入れるとワードで作成した文章がＨＴＭＬに変換できます。
配色を考えるのにあると便利なもの
- 最初はあまり凝らずに、簡単なものから作る方が良いでしょう。簡単なものから始めた方が早くに作成した喜びが味わえます。それから、ゆっくりと画像を入れたり、複数ページの構成にしたり、と発展していきましょう。
- 他人のページを参考にするとアイデアも湧きます。
サーバにアップするのに必要なもの
- FTPexplorer・・・Ｗｉｎｄｏｗｓのエクスプローラーと同じ操作で使えます。窓の杜でダウンロード。日本語化モジュールも忘れずにダウンロードしましょう。どちらもフリーソフトです。ソフトライブラリのFTP・Archie関連にあります。
  そこにでていた詳しそうな解説ページもダウンロードしてよく読みましょう。
- FTPExplorerの設定方法
  - プロファイル名：何でも良いのですが、名前をつけてプロファイルを保存しておけば、2回目以降はプロファイル名を指定するだけで接続できます。
  
  - ホストのアドレス：dragonserve.com
  
  - ポート：21のまま。「PASVを使用」をチェック。
  
  - Anonymousのチェックをオフにし、ログインにユーザー名、パスワードは共通パスワードを入れます。
  
  - 初期のパス：dragonserve/hkjpc/member
  
  - ダウンロードのパス：FTPExplorerを使用してファイルをダウンロードする時のダウンロード先(Cドライブのフォルダ名）を指定します。自動的に指定されたフォルダにダウンロードされますので、専用フォルダを作っておくと良いでしょう。
  
  これで設定完了です。接続できたら自分のフォルダを作りましょう。自信の無い人は、サーバー管理者に作成してもらいましょう。
  
  　
画像を入れる場合にあると便利なもの
- PhotoShop等のフォトレタッチソフト・・・画像だけではなく、アイコン、ボタン、ロゴを作るのにも大活躍。ストロボを使った場合に出る「赤目」の修正もできます。JPGファイルをGifやBMP形式に変換もできます。
画像の載せ方
- 画像は大きなファイルですので、本文に載せるとダウンロードに時間がかかり、全体を見てもらえない場合があります。本文には画像を小さくしたものを載せるか、番号を書くだけにしましょう。
- 画像のサイズ変更は、フォトレタッチソフトを使用して縮小できます。目安は100KB位だと思います。
- 本文に載せる画像は、同じくフォトレタッチソフトで縮小し、gif等の形式で保存すれば名前が同じになる（違いはファイル形式）ので、管理もし易くなります。目安は10KB以下でしょう。
- 保存場所を決めて、FTPExplorerで転送します。
- 画像を入れる位置を決め、「挿入」->「画像」と選び、保存場所を指定します。例えば、http://www.dragonserve.com/hkjpc/member/メンバー名/画像ファイル名、です。これは、上で作成した小さい（10KB)以下の画像ファイルです。
- これにリンクを作成すればできあがりです。
リンクの作り方
- 画像（複数のページの場合も同じ）のリンクは、FrontPage Expressなら「編集」--「ハイパーリンク」を使います。
- まず、小さいほうの画像を挿入した場所をマウスで指定します。マウスの左ボタンを押しながら横になぞれば、色が反転します。
- 「編集」->「ハイパーリンク」で保存場所と画像ファイル名を指定します。例えば、http://www.dragonserve.com/hkjpc/member/メンバー名/ファイル名、です。
- これでリンクの出来上がりです。

（共通）「ファイル名をつける時の注意事項／ヒント」

「ファイル名」はなるべく半角英数小文字で。パソ研では８字以内＋.拡張子に統一しています。
例：「frame.htm」、「welcome.jpg」
「ファイル名」にスペースは使えません。"_"（アンダースコア）を使いましょう。
同様にカッコや＊などの特種記号は使えません。
パソ研では沢山のファイルを同じフォルダーに入れています。通常HTMLファイルには連番をつけていきますね。そこで写真なども同様にしておくと、削除する場合などFTPで探すときに（アルファベット順に表示され）簡単だと思います。
例：「yama3.jpg」、「yama0328.jpg」など
ご自分のホームページはご自分のフォルダにのみ保存しましょう。サブフォルダを作ると整理も楽です。

（共通）「アップする時の注意事項」

同じファイル名がすでに使われていなかチェックしてからアップしましょう。特に画像などは重なりやすいので気をつけて。
同じ名前でアップすると前のものは消されてしまいますから。
更新日の記入をしましょう。ファイルがいつのものか簡単にわかります。
共通のファイルを更新するときは、更新者／更新日の記入をしてください。
共通のファイルを更新するときは、必ず最新のものをダウンロードして、そのコピーに手を加えましょう。
もし間違えても一度元に戻してからゆっくりと作成したファイルを見直せます。
アップしたらリンクが正しくなされているか確認しましょう。

最初に戻る