アルバムページの作成

2000年代前半、高校時代の仲間から写真グループに誘われました。D70を購入して撮り始めた頃で、おっかなびっくり参加しました。写真グループが利用していたのが「Yahoo! オンラインフォトアルバム」でした。幹事役のS氏からIDとパスワードを受け取った後、写真のアップロードやタイトル・キャプションの入力を練習しました。その時のオンラインフォトアルバムは大体下図のような仕組みでした。

Yahoo! オンラインアルバムの仕組み

数年間は重宝して使っていたのですが、Yahoo!がオンラインフォトアルバムのサービスを終了すると発表、このサービスではアルバムに付帯するメーリングリスト機能もよく使っていたので、突然の終了は青天の霹靂で弱りました。幹事役のS氏の骨折りでメーリングリスト機能は Google のサービスに移行することになり、アルバムの方は写真をメールに添付することで間に合わせることになりました。

◆アルバム計画
Yahoo!オンラインフォトアルバムの終了を機に、
自分のホームページにアルバムを載せることにしました。Yahoo!のフォトアルバムのようなページを自作したいと思い、悪戦苦闘した結果、自分流のアルバムを完成させました。Yahoo!に倣って「写真+タイトル+キャプション」の構成です。Yahoo!の場合は表示中の写真から離れた写真はサムネイルが見えず不便だったので、全サムネイルを一括表示するため、10列×n行のマトリックス方式にしました。(下図)

アルバムの構成(クリックで拡大)

◆アルバム作成
1)アルバム掲載画像の準備

以前はCapture NX-2とPhoto shop、今はNx StudioとPhoto shopを使って、imagesフォルダーに掲載する画像を保存します。

撮影・現像・編集&画像保存(クリックで拡大)

2)サムネイル作成と掲載順序の決定
既にサポート終了のMicrosoft Expression Web 4(以下EW4)を米国のMSサイトからダウンロードして使っています。我がテンプレートhtmlをEW4で開くと10列×6行のテーブルが表示されます。imagesフォルダーの画像を掲載順にドラッグして、テーブルの左上から埋めてゆくと、EW4のオートサムネイル機能が働いてテーブルにサムネイルが並びます。アルバムを保存する時にThumbnailの保存先を指定すれば任意のフォルダーに保存されます。下の例では《thumbフォルダー》に保存先されます。

オートサムネイル(クリックで拡大)

3)HTML文の完成
ページ作成には画像とそのサムネイルに加えて、1枚1枚の画像にコメントとキャプションが必要で、秀丸エディターを使って作成します。書き上げたコメントとキャプションは、配列1「タイトル」と配列2「キャプション」に別けて格納しますが、空白行の削除、タイトル行とキャプション行の分割等の作業が必要になります。それには秀丸のいくつかの機能とExcelのデータ/フィルター機能を使います。完成したHTML文とアルバムページの関係を下記に示します。

アルバム作成テンプレートの概要(クリックで拡大)

お散歩アルバムのページにはこれまで作成したアルバムが2004年から2024年まで載せてありますが、サムネイルを「10列×n行」のマトリックスで載せる方式は2008年頃から登場しています。2008年当時のアルバムは後からマトリックス方式に変換したかもしれませんが、この辺の記憶が朧です。