HTML作成前の準備
撮影画像のセレクト

まず、画像をセレクトします。
入場、式、退場などのカテゴリーなど、個別のフォルダに分けます。
カメラが2台あり、撮影情報が正しくない場合には、時系列が正しく並ぶようにファイル名をリネームする必要があります。
画像のタテヨコを正しく修正します。

画像のタテヨコを正しく修正します。画面の方法はWindowsXPの標準的な方法で高速すが、よりキレイに変更するなら「IrfanView」で画像を開き、「左回転」「右回転」で1点1点行うほうがよいでしょう。
画質補正

「IrfanVIEW」なら「Shift」+「U」キーで自動色彩調整ができます。また画面を見ながら手動での色調補正もできます。
写真集ページの作成
リサイズ

フォルダ分けした元画像を必ず残してください。「irfanview」「ファイル」→「一括変換」機能を使います。「詳細設定」タブをクリックし、最終的な表示用の大きいサイズ画像にリサイズします。長いほうを指定780ピクセル以内が適当です。
画リサイズした画像を「「IrfanVIEW」」でサムネイル表示

画サムネイル表示は「ファイル」→「サムネイル」でサムネイル表示できます。ここで最終的に出来上がる写真を再度セレクトすることができます。携帯電話に対応する場合は、10点以内になるようにします。
画像のタテヨコを正しく修正します。

「オプション」→「サムネイルの設定」画面を表示させ、大きさを指定します。PC用では任意の大きさでかまいませんが、携帯用では150*150以下(65*65推奨)にします。また、サムネイル音背景色とウィンドウの背景色を指定します。これは後で作成するHTMLのbodyカラーに合わせて調整するようにします。
HTMLの作成

出力ファイル名,保存フォルダ: 任意ですが、重複しないように気をつけます。ファイル名接頭語か接尾語を設定するとファイルの重複を避けることができるので設定しましょう。
サムネイルを保存するサブフォルダ、画像を格納するサブフォルダ: 任意ですが、作成したほうがあとあと便利です。[images][js][css]とう名称はつけないようにしてください。
サムネイル一枚につき〜:PC版の場合は、チェックをはずして、直接画像にリンクするようにします。携帯版の場合はチェックを入れて、HTMLブラウジングができるようにします。
HTML設定:タイトルや列数を指定します。
リンク/画像 リンク先を現在のウィンドウに表示にチェックを入れます。
HTMLのテンプレートフォルダ:
お試しの方は、「IrfanView」インストールフォルダのhtmlを指定するか、ない場合は下記のHTMLテンプレートファイルダウンロードし使ってみてください。
パソコン版(ライトボックス仕様)「PC-HTML_temp.ZIP」(4.00 KB)
携帯版(シンプルHTML仕様)「Mobile-HTML_templ.ZIP」(4.00 KB)
ファイルをサーバーにアップロード
できたフォルダにライトボックスライブラリの「css」「js」「images」をおいて、アップロードします。サーバーに予め任意のフォルダを作っておくとよいと思います。
この作業を繰り返してシーンごとの写真集HTMLを作成していきます
コメントする