#blognavi
サイドバーのひとことBBSに書いた、あみねこノートを作り始めました。
サムネイル一覧を生成するのは、ホームページビルダーなんかより高機能なフリーソフトの
すなねぃる!!を利用しました。
が、すなねぃる!!の生成するHTMLは旧いのと、最適化するのはやはり手作業になるため、完成まで手間取ってます。
最適化っていうのは、とどのつまり、見てくれるヒトが負担にならないようにページをカスタマイズすることです。
具体的には
- あみねこ一覧を印刷したときに、A4用紙に収まるようにする
- ページ表示が速くなるようにページ容量を抑える
この2つのポイントだけなんですけど。
ブログを利用するヒトは増えたけど、その分、的確なWebページの作り方を知らないヒトもまた増えた気がします。
初心者のためのガイドブックやヘルプをサービス側が提供するか、またはユーザが好きなようにページを作っても、自動的に最適なページに変換されるような機能があればいいのに、とよくおもうのです。
下のスクリーンショットは、すなねぃる!!で生成したサムネイルだけど、
画像45枚でページ容量は150KBくらい、だから、うらんと同じ低速回線ユーザ(^_^;)にも負荷がかからないスピードでページ表示されるハズ。
↑ブラウザの印刷プレビュー画面で用紙に収まるか確認しているところ。
すなねぃる!!は、サムネイルからリンクする個別の画像ページも自動生成してくれるので、ほんっと、かかる手間ひまがおおはばに短縮できて便利だよ～。
作者さん、ありがとう。
2006-06-03
ココから下は追加更新分です。
きゃい～ん。肝心なコトを書き忘れてました。
ページをA4用紙に印刷できるように、また画面も見やすくするためには実際にどーしたらいいか？
まず、
いきあたりばったりでページを作り始めないコトです。事前に、決めるべきことを決めて、画像の大きさやファイル容量、ページ全体の重さを制限しなきゃなりません。
決めるべきことって？それを細々説明してると記事が長くなるので(^_^;)、途中はスキップして結論だけを。
画像一覧を作るのにはテーブルが利用されるとして、
テーブルの横幅を600ピクセルとすること。
テーブルの横幅の中には枠線やセル（画像や文字を入れるマス目）余白の幅もカウントされるので、それらの分を差し引いて、横幅が何ピクセルの画像が、600ピクセルのテーブルに収まるには、いくつセルを作ればいいか計算します。
↑アッチーの画像ひとつが入っているマス目をセル、セル内の黄色い部分がセル余白です。このテーブルは1行2セルで構成されてます。
ページ容量はトータルの、画像のファイルサイズ+ページの構成要素で決まりますが、ブロードバンド時代の昨今では1ページ500KBを上限とすること。
たとえば横幅120ピクセルの画像が、ファイルサイズ平均、15KBだとしたら、テーブルの一行に作るセルは4つ、行数は1行が、15KB*4=60KB、画像自体のトータル容量を400KBとして、400/60の結果を四捨五入して、7行くらい。
ということで、4セル7行のテーブルを1ページに作ればいいんだナってわかります。これでいくと1ページに表示できる画像数は28枚になるので、それ以上の画像は順次2ページ目に回します。（あまり大きいテーブルは作るべきではありません）
きれいなページにするために、画像の横幅を揃えたり画像によって保存時のJPEG圧縮率を変えたりと前準備怠りないことも大切です☆
- うらんさんもあみねこ一覧フォトアルバムを作っているのですね。
わーい！楽しみです！
すなねいる！！見に行ってきました。
いろいろ充実した機能のわりに使いやすそうですね。
さすが、うらんさん。いろいろ勉強になります(*^^)v -- ビアンコ＆ロッソ (2006-06-01 23:16:02)
- 何時もながら 流石パソコンに詳しい
うらんさんは 何でも知っているなあと 感心してしまいます
出来上がるのを 楽しみにしていますよ。 -- ようち (2006-06-02 00:41:40)
- 。。。φ(◎◎へ）フムフム
よさげですね
うちの低速＠ISDN＠だから
確かに、生画像多数貼り付けはちっと・・・
ただ、おらのWEBの師匠は、サムでもダメだそうです
小さい画像でも、トラフィック障害になるので
数があるなら、一枚画像、もしくは、フラッシュなどにして
一枚画像なら、クリッカブル使うのがベストと教えてもらいました
ちなみに、おらのクリッカツール＆画像整理ツールは
HTMLエディターでお世話になってる、ｍａｓａｔｕさんの
Witchで～す
魔法使いシリーズｗ＠ＨＴＭＬエディタは、『Sorcerer』ｗ
まさに、魔法のようにＨＴＭＬとか覚えれたので
でかい面できてます＾ω＾；；ｂ
一応、アド貼り付けときますね↓
htＴp://ww2.tiki.ne.jp/~masatsu/
一応、迷惑防止で、アド加工してますｗ
ＰＳ。
ちと言葉足らずだったかも
うちに居る『たれ』
間違いなく、『Ｎ』女史の物なんですが＠別に自慢にしたくない
黒猫のあみぐるみも編まれたんですね？みたいなコメントが・・・
そんな意味合いの、ＢＢＳだったんです、（。＿。；） ゴメンネ -- コムムス (2006-06-02 01:31:09)
- うらんさんちにも「あみねこアルバム」が出来るんですね。
＞ブログを利用するヒトは増えたけど、その分、
＞的確なWebページの作り方を知らないヒトも
＞また増えた気がします。
↑全くもって、私のことです。
「初心者」にもすぐにブログが作れるようになっていますけど、
うらんさんのおっしゃるように、「バカでもわかる手引書」みたいなのは
どこに行けば手に入るのでしょうか。
みなさん、上手に「おうち」を作っておられますが、
カスピにはカスタマイズなんて、とてもとても出来そうにありましぇん。
クルマもオートマしか乗れないし…（って、関係ないか）
徐々に勉強して、よりよくしていけたらいいなーと
思ってます。
-- カスピちゃん (2006-06-02 03:30:38)
- すご～い！いろいろできるんですね。
うらんさんがうらやましいなあ、パソコンのこといっぱい知ってて。
私、とりあえず使える程度しかわからないから。。。
あみねこノート、楽しみです。 -- ayumi (2006-06-02 09:44:47)
- うらんさんちにも「あみねこアルバム」が出来るんですね～楽しみです。
＞ブログを利用するヒトは増えたけど、その分、
＞的確なWebページの作り方を知らないヒトも
＞また増えた気がします。
↑って、本当ですね。（私のこと）
何も理解していないのに、ただ作りたい！って思いだけで作っちゃいました。
これって、みなさんに迷惑かけているのかな？ちょっと心配に・・・
-- バニラ (2006-06-03 00:10:49)
- ビアンコ＆ロッソさん→
書き忘れ分を追加しました。(^_^;A
あみねこ一覧、、うらんさんも、、ということは、ビアンコさんも、みんなもすでに作ってある！！？(＠_＠;)
またもブービー賞だったんだ、、（爆）。
ようちさん→
あみねこノート、まだ半分です。がんばりまーす。
コムムスさん→
確かにサムネイルも小さすぎると、ページ表示に手間取りますネ。ヤプログが重たいのはそういうのも一因かと。
うらんのあみねこノート、表紙ページのサムは幅80ピクセルどす。1行5セルのテーブルを9個、貼り付けました。今もブラウザはIEがひとり勝ち？現場から離れて1年以上なので本名通りになってるかも(^_^;)Firefoxがんばってるという話も聞きますが、、
一応、CSSでテーブルレンダリングが速くなるように仕掛けてはおきましたが、どうかな～。
1枚画像をクリッカブルも考えたんだけど、アクセシビリティの見地から、ちと不安だったんで。。ソフト情報ありがとです。(^_^)/
カスピちゃん→
てけちゃんのミサンガ届いたようで、安心しました。コメントカキコはこれから^_^;。
初心者用の手引書がどこにあるか、うらんも知りたいです。検索して見つけられるかなあ。
市販の書籍であるかどうか、、今度探してみるね。
バニラさん→
ありゃ、、バニラさんもすでに作成済み？(;_;)
ブログのほうにリンクありますか？実際のページを見られれば何かアドバイスできるかも。
ページの内容が用紙に収まるかは、ブラウザがIEだったら、メニューバーの「ファイル」から「印刷プレビュー」で確認できるよ。
ページが重たいかどうかは回線によるけど、上の、追加したテキストを参考にしてもらって、画像のトータル容量をチェックしてみてはどうかしらん。
-- うらん (2006-06-03 09:36:42)
カテゴリ: [
インターネット] - &trackback() - 2006年06月01日 12:53:54
#blognavi
最終更新：2006年06月03日 09:36
